Creative coding stack
The stack has to favour fast prototyping, clean export, performance and web deployment.
- Selection
- 9 2 optional
- Target budget
- $49 per month
- Profile
- Starter business stage
Which tool does what?
FoundationCore
Three.js
Keep in this stack: clear role, recurring use, direct impact on delivery.Document from the first project to stay maintainable.FoundationCore
p5.js
Keep in this stack: clear role, recurring use, direct impact on delivery.Document from the first project to stay maintainable.FoundationCore
Processing
Keep in this stack: clear role, recurring use, direct impact on delivery.Document from the first project to stay maintainable.ProductionCore
TouchDesigner
Keep in this stack: clear role, recurring use, direct impact on delivery.Document from the first project to stay maintainable.
ProductionCoreRive
Keep in this stack: clear role, recurring use, direct impact on delivery.Document from the first project to stay maintainable.ProductionCore
GSAP
Keep in this stack: clear role, recurring use, direct impact on delivery.Document from the first project to stay maintainable.
ProductionCoreSpline
Keep in this stack: clear role, recurring use, direct impact on delivery.Document from the first project to stay maintainable.DeploymentIf needed
Vercel
Keep in this stack: clear role, recurring use, direct impact on delivery.Enable when volume, risk, or complexity justifies it.RepoIf needed
GitHub
Keep in this stack: clear role, recurring use, direct impact on delivery.Enable when volume, risk, or complexity justifies it.
Why these tools together?
The trap: keeping prototypes in a local folder. The client has to see, test and approve the experience online. ToolTrim approach: one tool per role, one source of truth per topic, and guardrails before premium tooling.
A good fit if…
Installations, generative work, web motion, shaders, canvas and visual experiences.
Look elsewhere if…
You only want a generic tool list without delivery, monitoring, or maintenance logic.
Scope before coding
Brief, deliverables, limits, access, and acceptance criteria must be set before final tooling choices.
Deliver the full chain
Code, preview, tests, logs, documentation, and billing must be designed together.
Make handover possible
The client must understand what exists, where it is hosted, how to deploy, and what to monitor.
What should you budget?
Spline$12
Rive$9Three.jsFree
p5.jsFree
ProcessingFree
TouchDesignerFree
GSAPFree
Verceloptional$20
GitHuboptional$4
The target budget is the recommended starting envelope. The list price adds up each core tool's first paid plan. Optional tools are not included.
What to watch out for
The trap: keeping prototypes in a local folder. The client has to see, test and approve the experience online.
Overbuilt stack
A senior stack is not a huge stack. It removes as much as it adds.
No monitoring
Without errors, logs, and uptime, you discover issues through the client.
AI without guardrails
AI accelerates but does not replace tests, review, or technical judgment.
Several active clients
Standardize templates, checklists, conventions, and project onboarding.
Production risk
Add monitoring, alerts, backups, secrets, and tests before adding new frameworks.
Recurring maintenance
Move from one-shot delivery to a tracking system: changelog, tickets, light SLA, and monthly report.
Questions to ask yourself
Can the client see an up-to-date version without asking?
No → add preview, short changelog, and stable link in the project page.
Do you know what to monitor after production?
No → start with errors, uptime, useful logs, and the main business event.
Can the stack be explained to the client in five minutes?
No → it is probably too scattered or not documented enough.