As we work on a new landing page for CodeYam, we saw this as a perfect opportunity to test out some of the most talked-about AI tools for prototyping software projects. These tools promise to simplify website creation, but how well do they actually perform on a real task?
As a product and web designer with over ten years of industry experience, the idea of AI simplifying this job is both exciting and a little daunting. My typical (pre-AI) process involves prototyping in Figma, reviewing designs with the team, and then handing them off to developers who bring them to life through code. This often leads to multiple feedback loops and revisions, which can be time-consuming. I am particularly curious to see how AI handles this process and whether it can streamline the transition from design to development, reducing the back-and-forth and making collaboration and implementation smoother.
To keep the comparison fair, I used the same basic prompt across all the platforms, and kept it super simple to test how each tool performed with very little information:
"I need a landing page for a product we are building. It's a software simulator called 'CodeYam'. This is the website we currently have. Can you create something similar but more professional looking?"
I also included a screenshot of our existing website to see how each tool would interpret and enhance our design with minimal additional input.
💡 Best for technical users who want a deeper GitHub integration.
Requires downloading the Cursor app and connecting it to GitHub.
The most technical of the bunch – requires running commands and managing GitHub interactions.
Provides a preview via an external link.
Output was very basic – it mostly rearranged our existing components instead of proposing new content.
The hardest to use for a simple website due to the setup process.
💡 Best user experience and feature-rich interface.
My favorite in terms of UI – aesthetically pleasing and easy to use.
Allows saving history and accessing different projects with ease.
Live preview during the chat and adapts well to changes.
Shareable preview links make feedback collection seamless.
Offers a library of pre-existing apps, components, and starters (though I didn’t use these in my test). It did help to get a great overview beforehand of what results I could expect out of this platform.
💡 Best for generating quality content and messaging.
Simple interface with just a chat and a preview window. While I appreciated the simplicity, I found myself wanting more control over the process.
Impressed me the most with how well it handled messaging and content generation with minimal input.
💡 Easiest to use, but the least impressive results.
Very simple UI, no distractions. Super similar to Lovable, but with more basic results.
The most basic and unimpressive output in terms of design and content.
Provided a live preview as we chatted.
Didn’t offer much in terms of content improvements or design enhancements.
All of the tools, except Cursor, were very intuitive and required no technical knowledge.
Outputs were generally simple and professional-looking, but none were groundbreaking. I wonder if results could have been different with more specific prompting.
No AI hallucinations (I was happily surprised!) – everything generated was logical and structured.
All platforms allowed code inspection, making it easy to tweak and refine for developers.
Cursor felt like the most "real" developer tool, integrating directly with GitHub and giving me visibility into the process. However, it's overkill for a simple landing page.
v0 by Vercel stood out for its usability and polished interface, making it the one I’d be most likely to continue experimenting with—though the generated content was somewhat generic.
Lovable delivered the most impressive content, making it a strong choice for teams needing help with messaging.
Bolt.new was too basic to be useful, and I likely wouldn’t use it again.
Overall, if you want a simple but professional looking website, any of these options can help deliver one in a super fast, cohesive way. But don't expect unique or fancy designs.
The team and I are working on messaging and how to best convey all of the ways CodeYam can help technical teams deliver faster, better products. Once we agree on content, I’ll be testing how these tools handle more complex design requirements and integrations.
CodeYam helps software teams increase confidence in code changes by making it easier to discover if a change is having the intended impact, or introducing bugs or side effects, via software simulations. These simulations provide test coverage, help teams understand the state of and any changes to their application, and can be used for documentation, demos, and collaboration. To learn more, please contact us or join the waitlist.