This how get AI to produce better Designs for my app

@youraveragetechbro

196.4K followers · usually 4.2K views a post

Views

13.1K

Likes

397

Comments

8

Shares

23

SoundTikTok sound · original sound - youraveragetechbro

Promoted product

Geminihttps://yorby.ai ↗

Why it worked

The video provides a practical and actionable workflow for leveraging AI in UI design and coding, appealing to developers and startup founders seeking efficiency. The creator's use of their own product (Yorby.ai) as a bio link, combined with a clear demonstration of AI tools, creates a subtle yet effective promotion.

Summary

The creator demonstrates a workflow for using AI, specifically Gemini, to generate UI design inspiration by feeding it a folder of screenshots and design language. This output is then used to guide AI coding assistants like Claude and Cursor to maintain design consistency.

Structure

1Create a folder of UI inspiration screenshots.
2Dump screenshots into Gemini and provide design language.
3Use Gemini's output to guide AI coding assistants (Claude, Cursor).
4Maintain design consistency with the AI-generated system.
5Mention parallel agents for multi-feature development.
6Direct viewers to another video for a full workflow breakdown.

Original caption

My AI trick for better UI design #coding ##softwareengineer #startups #programming

More from @youraveragetechbro

Product placement

Gemini: AI model that generates text and code. It acts by taking user input and producing output. Removing it would change the video's outcome. Claude.md: A file format used to store design system information. It appears as a file being used by the AI. Removing it would change the video's outcome. Claude: An AI coding assistant. It acts by assisting with code generation. Removing it would change the video's outcome. Cursor: An AI coding assistant. It acts by assisting with code generation. Removing it would change the video's outcome. Yorby.ai: A platform for social media growth. It is mentioned in the creator's bio link and is the product the creator is building. It appears as a link destination. Removing it would change the video's outcome.

Call to action

check out this video right here

On-screen text

This how get AI to produce better Designs for my app

Transcript

This how get AI to produce better Designs for my app So the first thing that I do is I create a folder over here that has basically a bunch of screenshots of different UI inspo that I like, apps, websites, you name it. And then I essentially dump that entire folder directly into Gemini. I personally think it's a step function above any other model out there. And then I tell Gemini like a design language, explaining the design elements that I like. And then I get the output of what Gemini created for my design language and design system. And I dump it into a claude.md file. Then whenever I use any type of AI coding assistant, whether that be Claude code or Cursor, whatever it is, that design system file, I tell it to reference that design system file to make sure that it stays true to the design that it originally enjoyed from the very beginning. That's just one piece of my AI coding workflow. I also use parallel agents to work on multiple features at once, a Claude scale that automatically keeps the context of my entire app up to date. And if you want a full breakdown of my entire 2026 AI coding workflow, then you can check out this video right here.