
π¬ Claude Image & Video: https://bit.ly/4hG7kio
π¨ Linearity (Claude designs you can edit): https://bit.ly/4AYzk8C
π Agentic OS + Claude Code Masterclass: https://bit.ly/4kol0y5
π Howdy
Hey, I’m Jack, I built and sold my last tech startup with a Gazillion customers, now I’m building AI startups and I share stuff that works. I quit my corporate job to do my start-up and have never looked back since.
π¬ Overview
Claude Design can now build gorgeous websites, brands and motion graphics, yet most people’s results still look like AI slop. These are the 15 Claude Design hacks I use after hundreds of hours of building, from simple to advanced. We start with motion: animations built from a reference clip, loops that start and end on the same frame, and small premium touches like hover lifts and counters. Then we build a brand: a brand guideline in one file, logos and campaign images made with Higgsfield right inside Claude, and on-brand social posts you can actually edit with Linearity. Next, where to find great design: font and icon sites, navbar, footer, CTA and 404 galleries, plus Mobbin and Refero for real app flows. Then the rules: the design loop skill, a five-agent design check, Don’t Make Me Think, and Slop Monster to strip the AI tells out of your copy.
Links
π©΅ 15 Hacks: https://bit.ly/4hG8Px2
π¬ Higgsfield (MCP + CLI): https://bit.ly/4hG7kio
π¨ Linearity: https://bit.ly/4AYzk8C
π FREE Claude Design prompts + skills (the vault): https://bit.ly/3RNNDLa
π Design Loop skill: https://www.skool.com/ai-automation-vault/claude-design-10000-websites-no-ai-slop
πΉ Slop Monster (free repo): https://github.com/ItsssssJack/SlopMonster
π Claude Code Masterclass + my Agentic OS: https://bit.ly/4kol0y5
π£οΈ Glaido (FREE Month): https://get.glaido.com/jack
βοΈ Claude: https://claude.ai/
ποΈ Motion
LottieFiles: https://lottiefiles.com
Transitions: https://transitions.dev
60fps: https://60fps.design
Kinetics: https://kinetics.colorion.co
Motion Primitives: https://motion-primitives.com
π·οΈ Brand
Brand Guidelines: https://brandguidelines.net
Deck Gallery: https://deck.gallery
Logo System: https://logosystem.co
Visual Journal: https://visualjournal.it
Rebrand Gallery: https://rebrand.gallery
π€ Fonts + Icons
Typewolf: https://www.typewolf.com
Fonts In Use: https://fontsinuse.com
WhatTheFont: https://www.myfonts.com/pages/whatthefont
Fontshare: https://www.fontshare.com
Flaticon: https://www.flaticon.com
Icons8: https://icons8.com
π§ Inspiration
Navbar Gallery: https://navbar.gallery
Footer Design: https://footer.design
CTA Gallery: https://cta.gallery
404s Design: https://404s.design
Unsection: https://unsection.com
Bento Grids: https://bentogrids.com
Savee: https://savee.com
Mobbin: https://mobbin.com
Refero: https://refero.design
Gallery list via @iamtanzil_: https://x.com/iamtanzil_/status/2106710926145781986
π Rules
Don’t Make Me Think (Steve Krug): https://sensible.com/dont-make-me-think/
ASD-STE100 Simplified Technical English: https://www.asd-ste100.org
βΆοΈ Watch Next
Claude Motion Design (full video): https://youtu.be/fq3wx-AR6B0
Design Loop skill (full video): https://youtu.be/VwGrXe2ricE
π My 40 favourite design sites: https://design-inspo-bay.vercel.app/
π©΅ Free Resources (the vault): https://bit.ly/3RNNDLa
π¨βπ« Skool: https://bit.ly/4mamFIH
βοΈ Stamps:
0:00 – 15 Claude Design Hacks
0:57 – Hack 1: Motion Graphics From a Reference
2:31 – Hack 2: Looping Animations
3:34 – Hack 3: Premium Micro Interactions
5:17 – Hack 4: Build a Brand Guideline
7:58 – Make Images and Video Inside Claude
9:47 – Hack 5: Edit Your AI Designs
13:48 – Connect Your Brand to Claude
14:41 – Hack 6: Fonts and Icons
17:18 – Hack 7: Design Inspiration Galleries
19:48 – Hack 8: Mobbin and Refero
21:04 – Hack 9: The Design Loop
24:32 – Hack 10: Five Agent Design Check
24:52 – Claude Code + Claude Design Masterclass
25:29 – Hack 11: Don’t Make Me Think
26:45 – Hack 12: Slop Monster
28:44 – Simplified Technical English
29:51 – Hack 13: Recreate Any Poster
31:42 – Hack 14: 3D Websites
32:38 – Claude Motion Design
33:17 – Hack 15: Your Design Operating System
34:36 – Do This Next
Learn 15 Claude Design hacks to build beautiful websites, brands and motion graphics with Opus 5.5, Higgsfield image and video generation, Linearity and free design resources.
#ClaudeDesign #Claude #Opus55 #WebDesign
