Prototyping with Cursor to Shipping with Co-pilot
Cursor
Copilot
V0
Loveable
Storybook
Interaction Design
Human-computer-interaction
See through software
8 months ago
Lovable to Cursor in 20 mins
Middle of the night, I found myself in a rabbit-hole using Loveable to prototype something for my work. I also wanted to see the hype for myself.
The first 10 mins, I was awestruck. As I went on feeding it prompts after prompts, it started losing its charm very fast. Very good at creating random things but not so good at following instructions and building on past instructions. I got frustrated, hated the back and forth and then ran out of prompt limits.
But I was still hooked & outcome driven, I had a fully functional prototype with realistic mock data in 20 mins, which was honestly incredible, and I didn't want to stop. I immediately downloaded Cursor, paid for it and exported the loveable project to Github.
Now, I was not only giving Cursor instructions, was also looking at the code and editing it where I could using my instincts. I could fix small things fast.
Over a week I watched Cursor write code, and found myself writing too, refactoring things to make things more manageable. Till this point who knew what the hell was refactoring?
4 months ago
Cursor to Co-pilot: A blessing in disguise.
I learned we had legal limitations and we can't use cursor, and my company is paying for Co-pilot, I had no choice to shift to co-pilot. Co-pilot slowed me down as a vibe coder, and forced me to learn code. A blessing in disguise. Despite being slower now I was being forced to pay attention, update code myself and learn.
By now I had learned conceptual nature of how react worked. I had created working playgrounds for POCs, experiments etc and rapidly testing them with people as I made them.
It took me half a day to create a very complex prototype and see the interaction details for myself. I cannot stress enough on the fact - how horrible, tedious and time consuming it was to use figma variables for testing/ validating interactions.
As of Dec 2025
Shipping small features
I have shipped small feature updates myself of course with the help of co-pilot.
Contributing to React Library
In certain parts of our platform we have a legacy design system that cannot be easily migrated to our latest design library, but it's presence in a very complex and critical part of he experience was also a non-negotiable problem owing to usability issues and it's distinct appearance.
Past month I updated the core components of this library to match our latest design system, added storybook documentation and playgrounds for faster testing and PR reviews.
Feasibility isn't an after thought
Feasibility isn't an afterthought anymore. As I am designing and iterating, I know what's feasible, what's not, and what design choice is worth an engineering spike. I understand the architecture and it's limitations, I know the services involved and how they interact, how they limit UX and where they should be reconsidered.
Lesson 1
The whole is more than sum of its parts
The whole ineffective, inefficient process of prototyping interactions in bits and parts without being able to see how the whole functions when the parts are stitched together is completely eradicated. I don't have to ask and wait engineers to publish everything on storybook, so that I can see how they behave.
It used to be like designing a car without being able to turn on the engine or drive it. Even if the car could start locally, you won't be the person driving, you have to watch someone else drive. And now I can't believe we lived like this for this long.
Lesson 2
Code as Fabric for Weaving UX
As someone who learns by doing and think visually, it has been very difficult to learn coding as it is so abstract that there is nothing that could have helped me paint a picture of how it all comes together. Now that's not the case.
When I am watching Cursor write code I am seeing the concepts being turned into abstraction live. And that has helped me so much to grasp the concepts. As much as the code is an abstraction, the abstraction also has a physical form that can be touched and seen. For example: what is a hook? What is a utility? What is refactoring? What is a service? What are props? How Dry principle is manifests itself in Figma components? You can see them all. you can see the fabric with which the user experience is woven.
In 2 days from asking it to build things for me, I went to data modelling. And I swear I am not using buzzwords here, I didn't know I was creating data structures until my partner said I "what you are doing has a name". Isn't it incredible?
Lesson 3
For designers who don't want to code..
There is no way out.. this thing is very good but not that good where you can just feed in prompts and have it build things, at least for a while. There is also no way you can vibe code your way out of it.. you have to learn to code for a while. But good thing is, it's easier than ever.
Lesson 4
Designing APIs and hence Information Architecture..
I have lately been dealing with legacy systems and how they were designed - some engineer's idea, that pretty much dictates the UX right now. When I was working on my prototype for a complete overhaul, I found myself unintentionally modelling data structures. Reflecting back, it was a moment where all disciplines could collapse into 1 person.
Think about from the POV of human-computer interaction, where designers mostly focus on the human part and design the interface of the computer, now as we have found a gateway inside the computer, we can change things beyond the interface. If we are bridging the gap between human and computer, the ultimate goal now is to make the computer require no bridge, so much so that it stops relying on borrowing our cognition and making the cognitive load completely disappear.
Lesson 5
No more staring at a sketch and deliberating what can it do…
Greatest thing about this is, we have skipped so much unnecessary deliberations, debates, where you are looking at a picture of a car and imagining what would it be like to drive this car.
Lesson 6
Idea -> Brought to life -> Validate -> Decide
Product design is a lot of things. When I think of things I am good at, I don't think about the tools. Tools are only as good as those using them. It's always the meta thought that matters.
Am I good at Figma? I don't know and I don't care,
but how do I structure my boxes and auto-layout, how do I name them, is it intentional? what does it accomplish?
e.g., the boxes and the names are an attempt at mirroring the react component for the developer to consume, and to think about how it will be built. No I am not trying to be good at Figma, I only try to be good at thinking about what anything means, and what is it's implication.
Point being, what I appreciate in myself and other designers are the following:
being thoughtful,
being curious
being proactive,
looking underneath the surface,
reaching out to people,
being resourceful,
borrowing from different disciplines.
These are the things will always be in dearth. As far as Co-pilot or AI or Cursor is concerned these are only tools enabling us to look underneath the surface inside the fabric ( code ) and allowing us an opportunity shape UX from the inside rather on the surface.
Lesson 7
It will always be the meta thought that will matter..
There will be designers, who can bring their ideas to life faster than anyone else, and that will make them efficient & unique. Not being slowed down or blocked by the constraints of hosting, engineering, tools. If someone wants to be showing static images of a car to their stakeholders & users to solicit feedback, rather have them drive it, it's not gonna work anymore.
Lesson 8
Directly testing artefacts against embodied cognition is evidence driven design made super fast, incredibly efficient
It will rid you off the most painstaking process of deliberation, debates that go no where. It will make you and everyone else accountable. I cannot stop ranting about how many times I have to deal with people with more power vested in them who would talk out of their asses rather provide valid authentic feedback. You could look through them and their mental gymnastics solely devoted to serve their ego. And you are left wondering what is this game we are playing and why? Why wasn't this part of the job description? So far I have adjusted to this by seeing the ego itself as a stakeholder, and I am not the only one, everyone knows it, everyone abides by it, no one says it. There is a hope here that, you might be able to skip this whole exhausting debates that go no where by getting to the evidence faster at lightening speed and move the conversation to talking about the evidence. It will also hold us designers accountable too, for we can see our biases not playing out the way we thought.