Designing a Website with Cursor

Vibe coding is utilizing ai technology to develop code using plain speech. It approaches design through a code now and refine later approach, which was definitely how I developed my website with Cursor. 

I created a website for designers, artists, art directors etc to source historical references through curated collections. I went through a few different prompting trials with Cursor to begin. At first, the initial results felt too far from my intended outcome to just redirect the software. After a few drafts, I narrowed my prompt down to be more straightforward with the description and specific with it’s functions. I also referenced Pinterest as general style inspiration, but in the final draft I was more specific on the aspects of Pinterest’s design that I liked, like the grid structure and layout.

While I did a lot of troubleshooting, Cursor helped speed that process up. It allowed me to more quickly realize flaws in my original idea, and rework them more efficiently. It slowed the creative aspect of my design because I spent a lot of time figuring out the best way to communicate what I envisioned. Also, I was finding myself taking more breaks / getting distracted when waiting for the code to load, so it definitely interrupted my creative flow a bit. 

If I had more time, I would create better visual references for Cursor at the beginning. Maybe some wireframes or sketches to help better communicate what I picture. Additionally, I would spend more time figuring out the right language to prompt Cursor with. Since I’m not a developer I don’t understand coding super well, so having a wider range of the  vocabulary would help me more accurately redirect Cursor.