Design is a Party

The Art of Typography

Elizabeth Lin

Building an alternative design school starting with The Art of Visual Design.

Follow my step-by-step process for building a type hierarchy from scratch.

Build effective type hierarchies

Learn to critically analyze and assess examples of typography. What makes a good type pairing?

Evaluate examples of good typography

Tired of using Inter for everything? Practice exploring more creative and advanced type pairings.

Explore creative type pairings with me live

Become your team's expert with one of the industry's most popular design tools: Figma! Nearly every team is using Figma in some way, due to its take on collaboration, community files and plugins, and its powerful design system and prototyping features. Whether you're brand new to Figma, looking to brush up on the fundamentals, or want to understand more about how the basics relate to the design tool's advanced features, such as&nbsp;multi-edit, variables, auto layout, or design systems, this course covers it all. ✨

Covering all of Figma's features to help you become an expert with the tool.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc vel lectus ridiculus laoreet at tortor porttitor placerat maecenas. Id sed mattis commodo, commodo. Donec tellus libero sapien tristique quis rutrum. Diam, euismod ac, nec vitae nullam pellentesque. Diam purus.

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Course syllabus

Learn at the pace that feels right for you! Every week, recorded modules will be available to view, each focused on various topics and features to help you understand all there is to know about Figma.

Self-paced lessons

I’m a design systems-focused product designer who loves helping others tackle web design and responsive layouts across different screen sizes. Through hands-on examples and practice assignments, I’ll share tips and tricks for scalable design, along with how I keep organized!

Practice focused on designing for all breakpoints

Tune into live working sessions hosted via Zoom. Together, we'll recreate various interfaces using components, variables, auto layout, and other Figma essentials. All live sessions will be recorded &amp; shared if you're not able to make it!

Weekly live design sessions

Course schedule

Beginners who are interested in learning all about using Figma, with a focus on product design and design systems.

Senior and staff designers looking to learn more about how to best build, structure, and organize components and component libraries.

Design teams who are in the process of making the switch to Figma and want to learn more about how to get the most out of the tool.

Content Designers who would like to learn how to collaborate effectively with designers in Figma.

Who is this course for...

Key outcomes

Learn how to navigate the Figma interface, make and arrange design elements, and create and manage teams, projects, and files. Understand the tool's foundations, such as frames and groups, and practice with all the essential tools to help you succeed.

Gain a solid understanding of the basics

We’ll cover the many features that can help you save time as you design, such as auto layout, variables, component creation, variants, and properties. I'll also cover everything new in Figma's latest redesign and how we can effectively use Figma's new AI in the design tool.

Learn several advanced techniques and time-saving features

Become the Figma expert on your team in understanding component organization and publishing flows to help everyone design using your team's system and library. I'll be sure to cover methods for following atomic component design within the tool, as well!

Learn how to make, organize, and publish component libraries

My favorite thing about design is the opportunity to meet and work with others; throughout this course, there’s an emphasis on just that. Through regular office hours (Thurs 12:30p/7p EST), feedback sessions, and built-in community tools, everyone can connect with one another.

Receive feedback and meet other designers

Learn all you need to get started and excel with one of the industry's most widely used design tools. 

Refreshed for Config 2024!

Group 13

Joey Banks

Product Designer, Design Systems

Group 12

Group 14

Design high-fidelity components in Figma with various design techniques to create high-fidelity web components. Colors, shadows, typography, etc. Everything to take your visuals to the next level. Master Figma Design Techniques Elevate your design skills using advanced Figma techniques to create high-fidelity web components, focusing on colors, shadows, typography, and more. HTML &amp; CSS ImplementationTranslate your Figma designs into precise HTML and CSS components, no previous coding experience needed. CSS Fundamentals and LayoutsUnderstand the CSS box model, layout properties, and various building techniques to create well-structured and polished web components. Advanced Styling TechniquesLearn advanced CSS techniques like flexbox, grid layouts, stacked shadows, concentric radii, and elevation highlights to set your designs apart. Pre-recorded lessons to learn at your paceAll lessons are pre-recorded for you to learn when it's best for your schedule.

From Figma designs to high-fidelity HTML & CSS implementation


Provide a brief description for each module as a way to sell the value of what students will be learning throughout the course.

First Module

Second Module

Third Module

Bi-weekly sessions to go over common questions and address specific support needs.

Live Q&A


We're not going to learn with existing shared assets, you're going to design and build by following along and creating your own work with us.

Design and build together


We'll craft common components you'll take to your own UI.

Projects that go with you


Designers wanting to learn the basics of UI Engineering. If you're curious about how to create pixel perfect polished components in code.

Engineers wanting to learn styling techniques. If you already know how to code but want to learn how to create better looking components.

This course is NOT for people wanting to learn JavaScript-related techniques. This is only for HTML and CSS building and styling techniques.

Who this course is for

What you’ll get out of this course

Colors, shadows, typography, etc. Everything to take your visuals to the next level.

Utilize various Figma design techniques for high-fidelity components.


Translate Figma designs into pixel-perfect HTML and CSS to bring your UI to where it's used. Perfect for designers aiming to bridge the gap between design and development.

Translate Figma designs into pixel-perfect code.

CSS has many different ways to build with. We'll cover beginner, intermediate, and advanced building techniques for not only great structure, but amazing polish detail as well.

Understand the CSS box model and layout properties.

Flexbox, concentric radii, stacking shadows, elevation highlights, etc. We'll cover many things to set your designs and implementations apart.

Apply advanced CSS techniques for stunning visuals.

Unlock the full potential of your UI design and engineering skillsets. Learn to design and translate polished components into HTML and CSS.

Mariana Castilho


Staff Product Designer // Pierre

Derek Briggs


Director of Design // Clerk


Cohort 4

Cohort 5

Whether you are a seasoned designer, totally new to the industry, or wanting to make a career switch — if you’re wanting to level up your web design skills, this course is for you. In this hands-on course, you will learn everything you need to know to design at the professional level by mastering the principles of typography, color and layout. You'll put industry practices into place as you gather and curate inspiration, establish a style, and design a cohesive web experience on your very own landing page project. At the end of four weeks, you will have:&nbsp;• Several portfolio pieces to share&nbsp;— use them to land that new client or to apply for a full-time web design role• A fully designed landing page with desktop and mobile screens, using the same methods as top-tier agencies• All the knowledge you need to&nbsp;interview for new roles and design websites at a professional level.

Design websites like the pros

Join your instructor each Monday for live teaching sessions covering the week's module. We'll have time for Q&amp;A after each lesson, so bring your questions!

Live Sessions

Loads of design principles to help you level up.

4 Self-Paced Lessons

<ul><li>Practice adding type styling to a real client project</li><li>Write a creative brief for your project</li><li>Create color palettes for the web using color theory</li><li>Develop a wireframe for your landing page</li><li>Gather inspiration and create a stylescape</li><li>Style your wireframe</li><li>Design a landing page</li></ul>

7 Design Exercises

Get feedback on your work or ask questions during regular live sessions with your instructor.

Live Office Hours

Graphic Designers Make the jump to professional web design and increase your income potential.

UX/UI Designers Build upon your interface design knowledge and start designing your own websites

Web Developers Add web design skills to your arsenal using the same methods as top-tier agencies

Who is this course for?

We’ll start with everything you need to know to get started in web design. You'll learn how to select typefaces and establish hierarchy, create color palettes for the web, and properly use grids to create responsive layouts.

Apply principles of web design and industry best practices to real projects

We’ll cover frameworks used by some of the best web design agencies that you can use right away to ideate and create cohesive concepts for the web, including hero exploration, working collaboratively with other designers, and moving quickly from concept to design to dev handoff.

Implement tried-and-true industry techniques used by world-class agencies on your own landing page project

We’ll be breaking down the design process on real client projects, created by some of the best in the industry. You'll get to see the full process from start to finish on five- and six-figure, award-winning projects, including methods you can use on your own projects.

See behind the scenes of real client projects

Share your work, ask questions and get feedback on your work throughout the week in the course community. Ask the hard-hitting questions in a relaxed, open environment during live office hours on Fridays at 12:00 EST.

Get feedback on your work, connect with your instructor, meet other designers and ask hard-hitting questions during live office hours

Master web design principles and build a portfolio-ready landing page in Figma from start to finish.

Benten Woodring

Senior Web Designer

Cohort 3

I’ve been there. Presenting designs that felt like breakthroughs—only to watch them fizzle out in a sea of competing priorities. Seeing stakeholders nod along but never fully commit. Trying to push a bold vision forward, only to face hesitation, skepticism, or indifference.&nbsp; It’s frustrating. But it’s also fixable.&nbsp; The designers who make the biggest impact aren’t just great at design—they’re great at getting buy-in. They know how to frame their work in a way that resonates with executives, engineers, and PMs. They tell stories that make their ideas impossible to ignore.&nbsp; This course is about mastering that skill.&nbsp; How We’ll Do It&nbsp; Design Storytelling isn’t about vague theory—it’s a hands-on program designed to help you communicate your ideas in a way that sparks action.&nbsp; Over four weeks, you’ll roll up your sleeves and build:&nbsp; - Stakeholder Maps – Identify who really matters, map their concerns, and craft messages that resonate.&nbsp;- Structured Story Frameworks – Shape raw ideas into compelling narratives that people remember (and rally behind).&nbsp;- Storyboarding Templates – Test and refine your story before spending hours perfecting slides.&nbsp;- Live Feedback &amp; 1:1 Coaching – Get real-time guidance on your actual projects, so you leave with presentations that work.&nbsp; By the end of the course, you’ll have a repeatable framework for crafting story-driven presentations that influence decisions and move projects forward—without endless back-and-forth.&nbsp; What You’ll Get Beyond the Course&nbsp; - Resource Bundles &amp; Templates – Reusable frameworks so you’re never starting from scratch.&nbsp;- Live Workshops &amp; Q&amp;A – Test ideas, get feedback, and refine in real-time.&nbsp;- Peer Community – Connect with designers tackling the same challenges.&nbsp;- Ongoing Support – Post-session follow-ups to ensure you’re actually applying what you’ve learned.&nbsp; Your work deserves to be seen, understood, and championed. If you’re ready to master the skill that separates great designers from impactful designers, I’d love to see you in this cohort.&nbsp;

Overcome Organizational Resistance & Master Strategic Storytelling


All live sessions happen twice a week for four weeks. You'll work through interactive lessons, hands-on exercises, and peer critiques to build your storytelling framework.

Tuesdays & Thursdays

Each week, you'll apply the concepts from class to your own work. Expect guided projects like stakeholder mapping, storyboarding, and refining your presentation flow.

Weekly Projects


After the main cohort ends, join this follow-up session to ask questions, address challenges, and refine your approach.

Optional Q&A


You’re ready to get buy-in for your biggest ideas&nbsp;– Learn how to frame your work so it lands with execs, PMs, and engineers.&nbsp;&nbsp;

You want to align teams around a clear vision&nbsp;– Break down silos and ensure your work drives real change.&nbsp;&nbsp;

You want to overcome resistance and push bold ideas forward&nbsp;– Use storytelling to turn skeptics into champions.&nbsp;&nbsp;

Who is this course for

<ul><li>Develop:&nbsp;A personal storytelling template to turn raw concepts into compelling narratives.</li><li>Apply: Reuse this framework for multiple projects, ensuring consistent, impactful messaging.</li></ul>

Craft a Reusable Narrative Framework


<ul><li>Identify: Map key players and understand their motivations so you can tailor your narrative effectively.</li><li>Adapt: Adjust your story based on your audiences' concerns, ensuring that each group sees the value in your proposal.</li></ul>

Tailor Your Vision to Diverse Stakeholders


<ul><li>Process: Use a low-fidelity storyboard to arrange your ideas and structure your presentation.</li><li>Refine: Build a framework that ensures every idea flows logically, and your message is clear before you start working on high-fidelity visuals.</li></ul>

Build a Cohesive Storyboard for Structural Clarity


<ul><li>Text &amp; Structure First: Focus on content and structure before jumping to visuals, ensuring your narrative becomes clear through an iterative process.</li><li>Visual Refinement: Start integrating simple graphics that support your story rather than overwhelm it, based on your storyboard.</li></ul>

Adopt a Proven Workflow for Story-Based Presentations


<ul><li>Strategize: Anticipate objections and plan responses.</li><li>Implement: Unite cross-functional teams around a shared vision using your newly developed assets and storytelling approach.</li></ul>

Overcome Organizational Resistance


Learn to create story-driven presentations that persuade stakeholders and unify teams. Adopt a proven workflow to shape your vision.


Lightning Lessons

The Art of Typography