AI Web Design
Using AI tools to build in a modern web framework
AI Driven Development
Design Thinking
Rapid Iteration
CI/CD Pipeline
Project Details
Scope
Leverage outdated HTML and CSS knowledge to build a polished and maintainable website for Neuron 5 by using an AI assistant as lead developer within a modern web framework.
- • Explore whether AI tooling could act as expert.
- • Develop usable and maintainable website scaffold.
- • Create a corporate branded and professional website.
Approach
Use a combination of AI assistants on a free tier to build a modern website using Next.js, Typescript and TailwindCSS. The Git repo was linked to vercel for CI/CD purposes.
- • Component-first architecture using modern framework.
- • Act as principal to direct AI assistant towards goal.
- • Collaborative development using Cursor & Chat-GPT.
Outcome
The result was a significantly accelerated build cycle whilst maintaining production grade standards. The ability to rapidly iterate through design options was unparalleled.
- • Reduced development time.
- • Improved iteration speed.
- • Covered high volume of design choices.
Impact
Rapidly built a production grade modern website despite limited prior experience with React based frameworks. Linking Git to Vercel allowed for instant deployment with every code push.
- • Leveraging experience turns AI expert into a co-worker.
- • AI generated scaffolding facilitated rapid iteration.
- • Changes deployed to live site with just one click.
Key Takeaways
When used correctly AI can be a great productivity multiplier in software development however it can be somewhat unreliable and lacking in consistency if not properly guided. Engineering quality comes from constraint and judgement not tooling alone. The most effective workflow is AI-assisted generation with strict human enforcement of structure and standards.