Add polished micro-interactions to an AI-built UI with ready prompts
elwingo1 published a library of UI micro-interaction prompts for AI coding tools on Show HN, so generated interfaces get hover, press and transition details.
Source
elwingo1 on Hacker News · 2026-10-22 · Project link
Written in our own words. Credit to the original author. Link checked 2026-10-24.
What they did
elwingo1 published a library of UI micro-interaction prompts for AI coding tools on Show HN, so generated interfaces get hover, press and transition details.
Result (as claimed)
Vibe-coded interfaces feel less generic.
Tools they used
Cost: Pricing depends on the tools you pick; check each official pricing page.
Set it up
Write a one-page brief
Describe the app in plain words: who it is for, the 3 core screens or actions, and what "done" looks like.
Start the project with your agent
Open Claude Code and paste the brief. Ask it to propose a stack and a file plan before writing code.
Build one slice at a time
Ship the smallest working flow first, run it, then add features one by one. Commit after each working step.
Test it like a user
Click through on desktop and phone. Ask the agent to add basic tests and fix anything that breaks.
Check security and ship
Keep keys in environment variables, check auth and database rules, then deploy and share the link.
Copy the full setup prompt
Paste into your agent and it will walk you through the setup, asking before anything that sends, posts or spends.
You are helping me set up this AI use case end to end in Claude Code. Goal: Add polished micro-interactions to an AI-built UI with ready prompts What the original author did: elwingo1 published a library of UI micro-interaction prompts for AI coding tools on Show HN, so generated interfaces get hover, press and transition details. Reported result (as claimed by the author): Vibe-coded interfaces feel less generic. Source: https://news.ycombinator.com/item?id=50199290 Tools they used: Claude Code, Cursor Category: Vibe coding & apps Please: 1. Ask me 3 short questions about my situation (accounts I have, budget, what I want the output to look like). 2. Propose a step-by-step plan using these tools or cheaper alternatives, with the time and cost of each step. Use official pricing pages; say "check pricing" if unsure. 3. Then do the setup with me one step at a time, waiting for my OK before anything that sends messages, posts publicly, spends money or deletes data. 4. Finish with a checklist to run it again next time.
You are helping me set up this AI use case end to end in Codex. Goal: Add polished micro-interactions to an AI-built UI with ready prompts What the original author did: elwingo1 published a library of UI micro-interaction prompts for AI coding tools on Show HN, so generated interfaces get hover, press and transition details. Reported result (as claimed by the author): Vibe-coded interfaces feel less generic. Source: https://news.ycombinator.com/item?id=50199290 Tools they used: Claude Code, Cursor Category: Vibe coding & apps Please: 1. Ask me 3 short questions about my situation (accounts I have, budget, what I want the output to look like). 2. Propose a step-by-step plan using these tools or cheaper alternatives, with the time and cost of each step. Use official pricing pages; say "check pricing" if unsure. 3. Then do the setup with me one step at a time, waiting for my OK before anything that sends messages, posts publicly, spends money or deletes data. 4. Finish with a checklist to run it again next time.
You are helping me set up this AI use case end to end in Grok Bot. Goal: Add polished micro-interactions to an AI-built UI with ready prompts What the original author did: elwingo1 published a library of UI micro-interaction prompts for AI coding tools on Show HN, so generated interfaces get hover, press and transition details. Reported result (as claimed by the author): Vibe-coded interfaces feel less generic. Source: https://news.ycombinator.com/item?id=50199290 Tools they used: Claude Code, Cursor Category: Vibe coding & apps Please: 1. Ask me 3 short questions about my situation (accounts I have, budget, what I want the output to look like). 2. Propose a step-by-step plan using these tools or cheaper alternatives, with the time and cost of each step. Use official pricing pages; say "check pricing" if unsure. 3. Then do the setup with me one step at a time, waiting for my OK before anything that sends messages, posts publicly, spends money or deletes data. 4. Finish with a checklist to run it again next time.
The Daily 5
Get five new use cases tomorrow morning
Free. Real sources. Unsubscribe any time.
Guides for this use case
How to use Cursor agents and automations ยท How to vibe code an app with Claude Code
Related use cases
Fix a vibe-coded app that Google cannot see
isbkch shares a prompt for Cursor, Claude Code or Lovable that fixes AI-built apps shipping as a blank root div, so crawlers get titles, previews and content.
Install a skill so your coding agent can set up and write your docs
Mintlify released a skill that teaches Claude Code, Cursor and Codex to set up, write and customize Mintlify docs with the right config and components.
Have your agent search your past coding sessions on every prompt
Skillsync searches your past agent sessions on each prompt so lessons from earlier work come back automatically.
Check from your menu bar whether your AI coding plan will last until it resets
Pacer is a macOS menu bar app that tracks how fast you are using Claude Code, Codex, Antigravity and Cursor plans, predicts whether usage will last until the reset, and suggests what to change if not.