How To Actually Design With AI

@LexnLin
Leon Lin@LexnLin
68 views Jul 14, 2026 ~5 min read
Advertisement

Design has always been one of the areas where AI struggles to match human ability. But most people still misunderstand what designing with AI actually means. Designing with AI does not mean asking it to do everything for you. The idea, direction, feeling, and creativity should still come from you.

Media image

AI is there to help you execute.
Here is the process in simple terms:

  • You develop the idea.
  • You gather inspiration.
  • You translate your thinking into prompts and use AI to build it.
  • You can use tools like Cursor, Codex, Claude, or any harness. Basically at its core, you are turning your thoughts into instructions. AI can execute extremely well, but it still lacks true creativity. It understands design rules like spacing, typography, color theory, and hierarchy.

    But it does not understand taste. It does not know what feels original, meaningful, or genuinely good.

    That is the gap.

    You cannot give AI real taste yet, but you can work around that limitation.

    Method 1: Use a Design Skill

    This is the fastest approach. If you are short on time or working on something small, you can rely on prebuilt design skills.

    Some examples:

  • Impeccable
  • Emil Kowalski’s UI skills
  • Skills.sh
  • TasteSkill
  • TasteSkill Version 2 is also coming soon with a dedicated GPT 5.6 one first. :)

    The process is simple:

  • Add a design skill.
  • Give the AI context.
  • Prompt it a few times to create your site/app/poster
  • Fix obvious issues.
  • Ship it.
  • The result will usually be decent. It may still feel similar to other AI-generated designs, but good skills help avoid the worst mistakes/slop. This is what most people use.

    Method 2: Design It Yourself With AI

    If you want something that actually stands out, you need to go deeper. You want people to land on your product and feel that real thought went into it. That requires a more intentional process.

    You might be building:

  • A mobile app
  • A desktop app
  • A website
  • A landing page
  • A dashboard
  • A poster
  • Whatever it is, you need a clear direction first. If you do not know what you are building, AI will not figure it out for you.

    Start With Meaning

    Before anything else, define the foundation.

    Ask yourself:

  • Who is this for?
  • What problem does it solve?
  • What should it feel like?
  • What should it represent?
  • The UI should reflect the meaning of the product. Write this down. You can also use AI here, but not for design. Let it ask you questions instead.

    For example:

  • What is the product about?
  • Who is the audience?
  • What feeling should it communicate?
  • What should the branding feel like?
  • What colors and fonts fit?
  • Should it feel minimal, playful, premium, technical, or experimental?
  • Collect Inspiration

    Once you have direction, start collecting references. A strong source is Mobbin.

    It has real product screens across many categories. Do not just look at designs and think “this looks good.”

    Ask yourself why.

  • Is it the layout?
  • The spacing?
  • The typography?
  • The structure?
  • The interaction?
  • Save anything useful.

    Organize it into folders like:

  • Navigation
  • Heroes
  • Pricing
  • Cards
  • Mobile screens
  • Dashboards
  • Animations
  • Typography
  • Build your own reference library over time. That is also hw you develop "taste".

    (The Mobbin link is an affiliate link. You can get 10% off your first three months, and I may receive a commission at no extra cost.)

    Other useful sources:

  • Pinterest
  • Cosmos
  • Awwwards
  • Webflow Templates
  • Craftwork
  • Rebrand Gallery
  • Component Gallery
  • Savee
  • Lummi
  • also:
    Do not copy entire designs. Combine ideas into something that fits your product.

    Map the Structure

    Now define what you actually need to build.
    For a website:

  • Navigation
  • Hero
  • Features
  • Pricing
  • Testimonials
  • CTA
  • Footer
  • For apps:

  • Onboarding
  • Home
  • Search
  • Profile
  • Settings
  • Core flows
  • Empty states
  • Each section needs clear content.
    For example, a hero needs:

  • Headline
  • Description
  • CTA
  • Visual
  • AI can help with copy, but clarity still comes from you.

    Build Component by Component

    Now you start building. Take individual ideas from your references and adapt them.
    Instead of saying: “Build me a full website”

    Say: “Create a hero section based on this style, adapted to my branding.”

    Work step by step:

  • Navigation
  • Hero
  • Cards
  • Buttons
  • Typography
  • Details
  • AI performs much better with smaller tasks. You also keep control.

    Generate Custom Assets

    Use image generation when needed. Tools like GPT Images 2.0 or Seedream 5.0 are strong enough now.

    Give clear context:

  • Colors
  • Style
  • Composition
  • Use case
  • Avoid generic stock images. Custom visuals make everything feel more cohesive.

    The Workflow

    The full process:

  • Define the idea
  • Clarify purpose and audience
  • Set branding direction
  • Collect references
  • Organize them
  • Map structure
  • Build components
  • Generate assets
  • Add interactions
  • Refine everything
  • This produces far better results than one prompt.

    Method 3: Use an Inspiration Board

    There is a faster middle ground. Instead of building everything piece by piece, you can give AI a curated set of references.

    Collect screenshots from:

  • Mobbin
  • Awwwards
  • Webflow
  • Craftwork
  • Rebrand Gallery
  • Component Gallery
  • Savee
  • Cosmos
  • Pinterest
  • Then tell the AI:

    “Combine the style and direction of these references into a design for my product. Do not copy directly.”

    Still give full context first. Let the AI ask questions. Then generate.

    This is faster than building everything manually, but still much better than a generic prompt.

    The Three Approaches

  • Design Skills
  • Fast, decent results.

  • Component-by-Component
  • Slow, highest quality.

  • Inspiration Board
  • Balanced approach.

    Additional Tools

    SVG Generation
    Use Quiver to create SVGs.
    SVGs allow for better animations because elements are separate.

    Video
    Use tools like Google Flow.
    Video can enhance:

  • Hero sections
  • Backgrounds
  • Product demos
  • Image Libraries
    Use platforms like Lummi when needed.
    Just make sure images match your brand.

    Layering
    Use background removal and layering to add:

  • Depth
  • Motion
  • Interaction
  • Small details do make a big difference.

    Final Thoughts

    AI should not replace your thinking.

    You still decide:

  • What to build
  • Why it matters
  • Who it is for
  • What it should feel like
  • AI just helps you execute faster. The best results will not come from better prompts. They will come from better taste.

    I will share more about design, development, and building + tuts on making your first money online with AI soon. :)

    If you have questions, leave a reply! Hope this helped. :)

    (btw I yapped 30min to whispr and then edited the article with Codex)

    Actions
    What You Can Do
    • Export as PDF or Markdown
    • Batch Export to Notion
    • Bookmark & Highlight
    • LinkedIn & Instagram Carousel Maker
    Create Free Account

    Includes 7-day Premium trial

    Advertisement