- Platform
- YouTube
- Durasi
- 4:40
- Bahasa yang diucapkan
- Inggris (Amerika Serikat)
- Tontonan
- 214 rb
- Jeda potongan median
- 3.00s
- Wajah di layar
- 43%
- Frame gelap
- 50%
Transkrip I Gave Claude 600,000 UI Screens… Then This Happened
Ditranskripsikan oleh model suara dari audio filmnya sendiri, bukan ditulis oleh mereknya. Klik baris mana pun untuk melompat ke momen itu.
- 0:00I asked Claude to draft me an onboarding flow for a fintech app, and it gave me these two flows.
- 0:05This one, it looks fine, but it's generic.
- 0:08As for this one, it's grounded in real finance apps.
- 0:11It accounts for things like identity checks, compliance requirements.
- 0:15This one feels much more considered.
- 0:18Here's why.
- 0:19I gave Claude access to Mobbin MCP.
- 0:22Once you connect your AI tool to Mobbin MCP,
- 0:25you're essentially handing your AI a library card to over 600,000 real app and website screens,
- 0:34flows, animations from products that have already been shipped.
- 0:38So now I have Claude on a browser connected to Morbin MCP.
- 0:43Let's say we're designing the onboarding flow for a fintech app.
- 0:46Using Morbin MCP, research how top apps design their onboarding and account opening flows
- 0:51across fintech or banking apps.
- 0:53find the most relevant screens and user flows,
- 0:56compare patterns across products,
- 0:58and identify what the best apps do differently.
- 1:01Lastly, I'll ask it to create a visual report
- 1:03showing the top examples, common patterns,
- 1:06and the best practices that top companies converge on.
- 1:12It's actually fetching account opening flows in the finance category.
- 1:17It studied some welcome screens from fintech apps.
- 1:20It understands the industry context,
- 1:22so it knows a banking onboarding flow is not the same as a generic one.
- 1:27Now the report is done.
- 1:29It pulls out all the common patterns, trade-offs, blind spots that we tend to miss.
- 1:35If you see a reference you want to dig deeper on, click on it.
- 1:38It will bring you to Morbin.
- 1:40From there, you can look for similar screens or study the end-to-end user flow.
- 1:45It also distills what the best apps do differently from the copy and the user flow as well.
- 1:51Now we move on to building it. So here I've got a file set up inside Paper with a made-up design
- 1:57system. I'll open a fresh code session on the Cloud desktop app with Paper MCP connected.
- 2:03Attach two things, the research report and a simple document describing what you want to build.
- 2:09This is optional but it helps the agent understand the full context. Using Paper MCP,
- 2:15In this file, propose an onboarding flow for Curve and build it.
- 2:19Flag anywhere that you're intentionally deviating from a pattern you found.
- 2:25While Claude is building this, it's actually pushing back on the brief and telling us why.
- 2:30In our PRD, we asked where does the save offers nudge belong without feeling manipulative.
- 2:36Claude decided to put it inside the homepage right after onboarding
- 2:39because it has did its research and referenced an app like One
- 2:43where the setup bonus is actually on the homepage as well.
- 2:49We don't recommend one-shotting a design right away.
- 2:52Research using Morbin MCP first,
- 2:54then use Morbin MCP to solve specific design problems.
- 2:58Inside Figma, when we go to the agent
- 3:00and ask it to design the map and filter views for iOS screens,
- 3:04this is what it came up with.
- 3:05As you can see, some of the UI are broken.
- 3:08On the other hand, when we connect to Morbin MCP to research first,
- 3:12It studied the references citing the source and gave us this.
- 3:19Compare competitors head-to-head, like how DoorDash and Uber Eats handle checkout, tipping, order summary.
- 3:30Look something up really fast, like showing you 10 empty states from productivity apps like this.
- 3:37Suggest copy tailored to your users, citing the sources of inspirations that it got it from.
- 3:44We've also seen people remixing ideas across industries.
- 3:52Ask Morbin MCP to nail different edge cases.
- 4:00Go to morbin.com slash mcp for the setup instructions.
- 4:03Morbin MCP is included with any paid Morbin plan.
- 4:07And it works with popular AI tools like Clot, Antigravity, Codex, Cursor and a lot more.
- 4:13But what Morbin MCP can't do is help us decide what to prioritise, what to keep and what to cut.
- 4:20That part's still our core.
- 4:22Next up, watch our latest breakdown on paywalls.
- 4:25We studied 3000 paywalls to find out what actually converts people.
- 4:29We've also studied over a thousand onboarding flows to find out what works.
- 4:33I'll see you there.
64 baris · 689 kata
More from Mobbin
All of Mobbin →The rest of their work we have taken apart.
Cut at the same speed
Films whose median shot runs closest to 3.00s.
25M viewsHubSpot
HubSpot x TikTok: Smart Data Meets Viral Reach
0:5031 frames3.0s cut26% face
9.2M viewsVodafone Australia
Great value with Vodafone
0:3020 frames3.0s cut75% face
1.1M viewsNothing
Nothing Phone (1)
0:2314 frames3.0s cut0% face
Launch504K viewsPhoton
Photon - Your agent is ready. The platform shouldn't be the hard part. Introd...
1:2538 frames3.0s cut37% face
185K viewsApple
iPhone 17e: Everything you love about iPhone at a wallet-friendly price
1:0535 frames3.0s cut14% face
50K viewsGoogle
How to use Agent in Google Flow | Find Your Flow
1:5673 frames3.0s cut52% face
923 viewsOFFEO
Facebook Ads Manager: NEW FEATURE!
1:5557 frames3.0s cut5% face
852話(hakoniwa)
A reminder that our V1 video models are also compatible with our Anim...
1:2050 frames3.0s cut2% face
Launch198K viewsCursor
You can now create and manage automations in the same workspace as yo...
0:2615 frames3.0s cut0% face
6K viewsiA Inc
iA Presenter
0:5425 frames3.0s cut4% face
Launch148K viewsPerplexity
Personal Computer is now available in the Perplexity app for Windows....
0:5721 frames3.0s cut0% face
828K viewsGlorify App
Glorify 2.0 Promo 2020
2:30114 frames3.0s cut4% face
Lit and framed like this
Closest on how much of the running time has a face in it and how dark the frames are.
Peter McKinnon
Cinematic Videos in 2024
2:5291 frames1.8s cut43% face
Launch145K viewsLuma
Direction goes in. Cinema comes out. Ray3.2 is here →
1:2950 frames3.2s cut42% face
Launch1.0M viewsKarim
We brought in a writer of Toy Story to build a robot that feels alive...
1:1644 frames2.7s cut43% face
504 viewsLeisure Visuals Ltd
Runkeeper Ad
1:0029 frames7.3s cut45% face
55K viewsbonzo
i lived in my car for 478 days in sf, while working at a startup.
1:5495 frames1.4s cut43% face
775 viewsSkydio
Prepared + Skydio DFR Command: 911 Call to Drone Launch in One Workflow
2:11118 frames2.9s cut47% face
97K viewsNike
Road Less Traveled with Grant Fisher | Nike
4:15199 frames2.4s cut38% face
Launch38K viewsCursor
Introducing Cursor for iOS
1:1446 frames2.5s cut46% face
5K viewsSofia Pompei
LCBO - Holiday Commercial
0:1511 frames3.5s cut45% face
240K viewsRunway
Turn simple sketches into fully rendered 3D characters. Use our new ...
1:0040 frames2.2s cut48% face
4.1M viewsCursor
Cursor now shows you demos, not diffs. Agents can use the software t...
1:4287 frames1.0s cut44% face
14K viewsDennis Müller
Amie Beta Launch
1:2448 frames2.6s cut48% face
More social
Same category, other makers, most watched first.
622M viewsBase44
Your ideas, your apps—Base44
0:5651 frames1.1s cut6% face
538M viewsBase44
Turn any idea into an app with Base44
0:5538 frames2.2s cut50% face
154M viewsBase44
Build Your Website with One Sentence | Base44
0:4835 frames0.9s cut31% face
81M viewsNike Football
Rip The Script | Nike Football
6:00310 frames1.1s cut60% face
75M viewsPetSmart
PetSmart | "Pickup in...STORE!"
0:1511 frames1.4s cut64% face
69M views1X
NEO The Home Robot Order Today
9:53271 frames2.8s cut25% face
69M viewsApple
Apple Education: Ready for every learning opportunity
1:4687 frames1.3s cut40% face
64M viewsBland
Phone calls suck. So, we bought a giant telephone car, raised $65,00...
1:4854 frames4.3s cut81% face
39M viewsFigma
Oh wait there’s more: we’re building 3D Transforms, here’s a preview ...
1:0423 frames4.0s cut78% face
36M viewshims
Getting Help is Simple, With Hims
0:3023 frames2.0s cut70% face
36M viewsFigma
Made in Figma (2025) Like this ❤️ we designed it for you
0:3872 frames0.5s cut7% face
35M viewsApple
Hello, MacBook Neo
3:50291 frames67.5s cut1% face