Give Me 7 Minutes & Your Web Design Skills Will Take Off
A 7-minute crash course that packs a decade of web design knowledge into three pillars, a conversion warning, and a survival rule for the AI era.
February 13th 2025A 14-minute system that collapses a decade of web design learning into five skills every professional actually uses.
After ten years of web design, only five skills separate amateur work from professional results: typography, layout, color, code basics, and conversion thinking — and most designers are wasting time on everything except these.
Most beginner designers waste years chasing tools and trends when five skills drive the gap between amateur and professional work. Typography comes down to two questions: picking the right fonts and setting up a consistent type scale. Layout means a 12-column grid, an 8-point spacing system, and four visual hierarchy principles. Color means limiting a palette to two or three intentional roles and using opacity instead of extra colors. Code means knowing HTML, CSS, and JS basics well enough to vibe-code the rest. Conversion means designing every page around one single goal and earning trust through clarity and emotional resonance.
Modern Creator members can chat with any breakdown — ask for the hook, quote a framework, find the exact transcript moment. Unlocks at T2: refer 3 friends + add your own API key.
Create a free account →
States the premise: after 10 years, only 5 skills matter. Names the outcome the viewer will have by the end.

Two questions: how to pick fonts (fontshare, uncut.wtf) and how to set them up (major third type scale, REM values, letter spacing, line height). typescale.net as a shortcut.

12-column grid on desktop, 8-column tablet, 4-column mobile. 8-point grid for spacing. Four visual hierarchy principles: proximity, size, contrast, alignment.

Limit palette to 2-3 colors. 60-30-10 rule for balance. Use opacity instead of adding colors. Prioritize contrast ratios. CSS Overview to steal palettes from professional sites.

HTML, CSS, JS, PHP basics are enough. Learn 80% via courses, vibe code the rest with snippets and AI.

Pro designers design for action, not looks. Personal story: redesign that tanked a client's sales by ignoring the user journey. One goal per page. CTAs in hero + nav + every 2-3 scrolls. Trust, clarity, and feelings.

Permission to stop chasing everything. Focus on these five and grow faster than chasing trends.
Confidence in web design does not come from knowing more tools — it comes from having repeatable systems for typography, layout, color, code, and conversion.
“Pro designers don't use more color. They use color more intentionally.”
“One good color used well beats five random colors any day.”
“Pro designers don't guess about where things should go on the page. They have systems that guarantee it every time.”
“I had focused so much on the design that I ignored the user journey.”
“People don't read websites. They scan them.”
Ten years of reading books, taking courses, and building websites — and it comes down to five things. Not fifty. Not a platform, not a trend, not the latest AI tool. Five durable skills that every working professional actually uses, and that most beginners skip entirely in favor of chasing what looks impressive.
Scale each heading ~25% larger than the previous using REM values. typescale.net generates the full system automatically.
All spacing in multiples of 8. Used by Google Material Design and Apple. Set up in Figma as a grid guide.
Assigns a percentage and a job to each color in a limited palette, preventing visual chaos.
Every page has one goal: buy a product, sign up for a call, or capture a lead magnet. Multiple goals split user attention and reduce conversion.
Extension of the classic KLT framework — adds feel as the emotional layer that moves people from interest to action.
“If this video was helpful, make sure to hit that like button and subscribe so you don't miss another episode.”
Soft, friendly close CTA. Mid-video CTA at ~1:39 for likes/subscribe plus slide download and font resource list.
00:00
00:14
00:23
00:34
00:44
00:55
01:14
01:23
01:31
01:42
01:57
02:07
02:16
02:25
02:41
02:46
02:57
03:08
03:18
03:25
03:40
03:52
03:57
04:12
04:22
04:37
04:45
04:54
05:06
05:12
05:28
05:39
05:49
06:00
06:11
06:22
06:32
06:44
06:54
07:05
07:15
07:26
07:37
07:48
07:54
08:09
08:20
08:31
08:43
08:50
09:03
09:13
09:23
09:32
09:46
09:57
10:04
10:18
10:29
10:45
10:51
10:59
11:13
11:23
11:29
11:41
11:57
12:04
12:17
12:25
12:39
12:49
13:00
13:11
13:21
13:37
13:45
13:49
14:01
14:15A 7-minute crash course that packs a decade of web design knowledge into three pillars, a conversion warning, and a survival rule for the AI era.
February 13th 2025Nine named patterns — from barely-there AI minimalism to tech-bro gradients — spotted across hundreds of websites, with a one-rule filter for knowing which ones actually belong on your site.
December 4th 2025Five design habits -- gradient, motion, space, depth, color -- that any Elementor builder can apply in an afternoon.
November 7th 2025A 9-minute screen-share demo where Lovable clones two Elementor templates from a URL paste, then layers in functional features the originals had.
August 1st 2025A 26-minute screen-recorded walkthrough of the DRIP framework: from Stitch vibe mockups to a deployed React app with Supabase auth and Stripe payments.
March 24thAn 18-minute walkthrough of eight specific library choices and prompting habits that turn generic AI output into sites that look professionally designed.
March 24th