Creating no-code apps is easier than ever. Here are my takeaways from using Cursor + Claude + Figma to build an app to track savings goals in Bitcoin terms.
Pt. 1: Product development process
☞ START WITH DESIGNS. Before saying a word to our friend Claude, I recommend spending time up front to think through your desired pages, information hierarchy, UX flow, and basic designs. In general, prompting with visuals and text will get you closer to your desired end state than text alone. When you’re ready, lay out your screens in Figma, save each as a PNG file, and add them to Cursor so that you can reference them in your initial prompt to the AI.
☞ WAIT TO WORK ON THE BACKEND. To reduce complexity, start by asking the AI to build out the front end, informing it you’ll work on any backend elements later. Just tell it to leave placeholders or use dummy data.
☞ WORK ITERATIVELY ON BIG CHANGES. The bigger the change, the greater the risk. Claude’s biggest mistakes seem to come from either lacking context (see “Context is king”) or trying to be too helpful (e.g., adding features you didn’t ask for). Do less, Claude. Give the AI a shorter leash. If you want to allow users to update the icon associated with an expense, you might give it the following prompts in succession: create the “Update icon” button, link it to an empty “Icon Library” page, layout the icons in a grid with a “Save button”, and – finally – update the icon across the app when a user clicks “Save”.
☞ BONUS: DON'T TRY TO USE VOICE. I saw a post on X that made the a voice + AI workflow look effortless. As a result, I spent $20 on a license for this dictation software. In practice, it doesn’t work well. Given the time it takes to turn your voice to text, you’re better off typing short instructions. For longer instructions, specificity is super important – as you’ll see below. Talking at your computer ≠ precise prompting.
Pt. 1: Product development process
☞ START WITH DESIGNS. Before saying a word to our friend Claude, I recommend spending time up front to think through your desired pages, information hierarchy, UX flow, and basic designs. In general, prompting with visuals and text will get you closer to your desired end state than text alone. When you’re ready, lay out your screens in Figma, save each as a PNG file, and add them to Cursor so that you can reference them in your initial prompt to the AI.
☞ WAIT TO WORK ON THE BACKEND. To reduce complexity, start by asking the AI to build out the front end, informing it you’ll work on any backend elements later. Just tell it to leave placeholders or use dummy data.
☞ WORK ITERATIVELY ON BIG CHANGES. The bigger the change, the greater the risk. Claude’s biggest mistakes seem to come from either lacking context (see “Context is king”) or trying to be too helpful (e.g., adding features you didn’t ask for). Do less, Claude. Give the AI a shorter leash. If you want to allow users to update the icon associated with an expense, you might give it the following prompts in succession: create the “Update icon” button, link it to an empty “Icon Library” page, layout the icons in a grid with a “Save button”, and – finally – update the icon across the app when a user clicks “Save”.
☞ BONUS: DON'T TRY TO USE VOICE. I saw a post on X that made the a voice + AI workflow look effortless. As a result, I spent $20 on a license for this dictation software. In practice, it doesn’t work well. Given the time it takes to turn your voice to text, you’re better off typing short instructions. For longer instructions, specificity is super important – as you’ll see below. Talking at your computer ≠ precise prompting.
2