Learning Timeline
Key Insights
The Advantage of Voice Dictation
Use voice dictation to provide highly granular instructions. Instructions that might take 5 minutes to type can be finished in seconds via voice, allowing you to feed more technical details to the AI.
Pro Tip: Debugging Animations
While running the Xcode Simulator, click the Debug menu at the top and select 'Slow Animations'. This runs animations at half speed or slower, making it much easier to spot visual glitches or unsmooth transitions.
Cursor Plan Mode vs Claude Code
Cursor's 'Plan Mode' is more effective for highly complex problems because it asks clarifying questions (e.g., 'Should this button be re-triggerable?') before implementing any code changes.
Prompts
Initial Animation Structure Prompt
Target:
Claude Code / Cursor
Create a button and when I click it, I want an animation to run to simulate an AI searching for nutrition info and calories. First, I want it to say 'Searching' with a shimmering text animation. After 1 second, I want that to drop down, and the text to say 'Analyzing' and I want that to drop from the top and replace it on one line. Then after that, I want it to say 'Found 10 sources' with three circles to the left of it and list some sources like YouTube and New York. Make sure the text is cut off and contained on one line during the animation.
Animation Refinement Prompt
Target:
Claude Code / Cursor
Make sure the text drops down instead of shooting back up. Increase the time to 2 seconds for each of the animations so they can show properly. Also, make the shimmering effect a little more extreme.
Step by Step
Building Complex iOS Animations with Voice Prompting
- Open Xcode and start a new Blank Project.
- Open the project folder using the Cursor editor or access Claude Code through the terminal.
- Enable 'Voice Dictation' on your device to start giving verbal commands and save typing time.
- Give a highly detailed voice prompt to Claude Code: Start by instructing it to create a button that, when clicked, triggers an 'AI Searching' simulation animation.
- Detail the first phase of the animation: 'Searching' text with a 'shimmering' effect.
- Detail the second phase: After 1 second, the 'Searching' text drops down and is replaced by 'Analyzing' text dropping in from the top on the same line.
- Detail the third phase: Display 'Found 10 sources' with three circles to the left and hardcoded sources like 'YouTube' or 'New York'.
- Instruct Claude Code to ensure the text doesn't overflow by setting a 'one line' limit (cut off) during the animation.
- Press Enter to let Claude Code automatically generate the SwiftUI code into your Xcode project.
- Run the app in the Xcode Simulator to see the AI's work.
- Use the 'Slow Animations' feature in the Simulator to carefully inspect the animation's movement quality.
- Provide a follow-up prompt to refine the results, such as increasing the duration of each animation to 2 seconds or intensifying the 'shimmering' effect.
- Repeat the iteration process (roughly 10 to 20 prompts) until you reach the desired level of polish.
