Meng To
@MengTo • 170,791 subscribers
Founder at @designcodeio and https://t.co/Kpiogf2zVu. I teach designers code and developers design.
Shorts
Videos
I recorded a 27-min tutorial on how to prompt beautiful landing pages with animated images 2.0
Meng To120,991 Aufrufe • vor 9 Tagen
I recorded a 43-min video on how to turn a DESIGN.md into landing pages, mobile screens and motion design
Meng To209,925 Aufrufe • vor 1 Monat
So this is a highly curated collection of 400+ DESIGN.md that’s editable and promptable. Just one click to change styles, turn into branding, mobile versions, slide decks and site sections like hero, testimonials & footers. It’s a superpower for creating landing pages & presentations.
Meng To204,724 Aufrufe • vor 1 Monat
Gemini 3.1 Pro is so freaking good at making skeuomorphic user interfaces and animating them
Meng To325,903 Aufrufe • vor 3 Monaten
I recorded a 50-min tutorial on prompting top-tier landing pages with Gemini 3
Meng To483,889 Aufrufe • vor 6 Monaten
I've created 50 designs with Gemini 3.5 Flash. Here are my thoughts: - As good as GPT 5.5 but way cheaper. - Worse than Gemini 3.1 Pro in term of design complexity like layout grids, responsiveness, scroll behaviors, webgl, animations, etc. - Omni looks good for video edits, but lacks emotion compared to Seedance 2.0. - Omni could be a game changer for web design if good with typography. Can't wait for Gemini 3.5 Pro.
Meng To41,465 Aufrufe • vor 14 Tagen
I recorded a 37-min tutorial on how to prompt with Gemini 3 to get the best UIs
Meng To322,381 Aufrufe • vor 6 Monaten
How I created these landing pages with Gemini 3 from start to finish First, I start with the hero section. It includes the nav bar, eyebrow, headline, subheadline, cta, social proof and visual. I spend 50% of the time here because it sets the colors, typography, spacing, which AI uses for the rest of the site consistently. “Create the hero section for my {app} called {name} in the style of {reference_site}”. Pro tip: use a screenshot and you’ll get way better results. Let’s get into the details. For icons, I prompt: “Use Iconify {icon set name}”. Most people use Lucide, but there are hundreds of open-source sets on Iconify like Solar, HeroIcons, Iconoir, Phosphor, etc. Just need to mention in the prompt. Same for custom fonts. For the animation, I prompt: “Animate fade in, slide in, blur in, element by element. Use 'both' instead of 'forwards'. Don't use opacity 0.”. This creates a subtle intro animation the first time users land on your page. Gemini 3 is an excellent animator. For example, I created the beam animation with this prompt: “Add noodles that connect and beam animate into the right circle. Add subtle details to the right beam animation circle with sonar and decorations.” For background animation, I use Unicorn Studio. Remix one of their templates and watch people click on your cover like crazy. What can I say, people love lasers. In the hero or right below it, social proof is super important. You can put ratings or logos, or both. For logos, you can prompt: “Animate the logos with marquee animation looping infinitely using duplicated items and alpha mask.”. Now the CTA. AI always creates basic buttons, which is fine 99% of the time. But Gemini 3 now sets a high bar for baseline design, so you will need to stand out. That’s why I put the extra human touch on animations and lickable buttons. I suggest browsing UIVerse and Codepen for buttons and reference the code in your prompt: “Change main button {code} and secondary button {code}. Add a 1px border beam animation around the pill-shaped main button on hover.”. Once you’re happy with the hero, you’ll want to craft new sections based on your business. Features, action plan, pricing, testimonials, FAQ, CTA and footer are the popular ones. Insert a screenshot and prompt “Adapt a new section, change texts, names and numbers”. Gemini 3 is very smart. It reads your existing styles and site concept and will tastefully mold new designs to fit perfectly into your current site. Finally, repeat the same prompts for icons, buttons and animations. Use midjourney images and remix using Nano Banana Pro. Ask ChatGPT to come up with better headlines, features, ctas, etc. Don’t skip the human part, this is where you’re irreplaceable. Start prompting top-tier landing pages and watch your numbers grow.
Meng To285,887 Aufrufe • vor 6 Monaten
I made a tool that generates UIs with a design system that's copyable as prompts. Everything is a prompt: font pairings, color system, spacing, icon sets, buttons and even webgl & threejs with full code samples. This made explorations with Gemini 3.1 Pro so precise and fun.
Meng To94,732 Aufrufe • vor 2 Monaten
I'm building my dream video editor with Claude AI 11k lines of code, 685 commits, 3 full weeks. Cursor, Tailwind, React, Firebase. Web-based, cloud saves, versions, can edit on mobile. This video was recorded using the tool. Never in a million years I thought I was capable but here we are. AI is a multiplier.
Meng To792,462 Aufrufe • vor 1 Jahr
My 8yo son built a Three.js site with zero coding experience He used Claude AI and let Cursor apply all the code for him. He actually made several projects including 2 platformer games, a drawing app, an animation app and an AI chat app. ~2 hours spent on each. I only helped him set up Cursor, Git and Netlify. Code is a design tool and you don’t even need to code anymore.
Meng To772,967 Aufrufe • vor 1 Jahr
