Skip to main content

Smart Interface Design Patterns, 2021 Edition

Workshop, 5×2.5h + Q&A • Thu & Fri, April 22 – May 6
09:00 – 11:30 AM PT (Pacific, US) 18:00 – 20:30 CET (Europe)

Are you ready for a design challenge? In this series of online workshops, Vitaly Friedman, creative lead behind Smashing Magazine, will be taking a microscopic examination of common components and design patterns in modern interfaces — on desktop and on mobile.

We’ll study 100s of hand-picked examples and we’ll be designing interfaces together, starting from accordions, to mega-drop-downs, sliders, feature comparisons, car configurators — all the way to timelines and onboarding. And: We’ll be reviewing and providing feedback to each other’s work.


Video Message From Vitaly (1 min)

A short 1-min introduction to the workshop by Vitaly himself.

The workshop includes:

  • 1500+ workshop slides with practical examples and action points
  • 100 checklist cards on everything from carousels to web forms
  • Editable text file to adjust for your needs
  • Access to the evergreen deck, updated regularly
  • Live, interactive sessions
  • Hands-on exercises and reviews
  • All workshop recordings
  • Dedicated Q&A time for all your questions
  • A Smashing Certificate

$450.00 Register for this workshop → Five 2.5h live sessions + Q&A. Five.
With all video recordings & slides. Get a ticket.

🎪  Save up to 25% on this workshop with Smashing Membership.

Who is this workshop for?

This workshop is for interface designers, front-end designers and developers who’d love to be prepared for complex and time-consuming design challenges.

You’ll walk away with a toolbox of techniques and examples of doing things well — in your product, website, desktop app or a mobile app.

In this workshop, we’ll explore:

  • How people use mobile interfaces and how we can optimize for thumbs,
  • Navigation, with accordions, mega-drop-downs, hamburger icons, breadcrumbs, carousels, filters and search,
  • Advanced configurators, wizards and customizers, diving into details of a car configurator,
  • Complex tables, with a feature comparison table, currency exchange calculator, pricing plans,
  • Date pickers, date range picker and a time picker, incl. booking an appointment and booking an airline ticket,
  • Calendars, with a multi-track schedule, TV Guide schedule, music festival schedule, exhibition calendar, spreadsheets and dashboard,
  • Forms, with email verification, password input, country selector, sliders, error validation, incl. public transportation and a banking transaction UI,
  • Sliders, with insurance calculators, timelines, historical family tree, soccer game signature and live leaderboard and standings,
  • Maps and Data Visualization, with a shopping mall map, election map, smart region input.
  • Onboarding and offboarding UX for higher conversion/retention,
  • Authentication patterns, permissions UX, GDPR/CCPA, CAPTCHA and 2-factor-auth,
  • Seat selection, for a concert, theatre or exhibition and a perfect Formula 1 seat selection,
  • Design anti-patterns to avoid to prevent running into maintenance issues and “slow UX decay”.

Register for this workshop →

About Vitaly Friedman

Vitaly Friedman loves beautiful content and doesn’t like to give in easily. When he is not writing or speaking at a conference, he’s most probably running front-end/UX workshops and webinars. He loves solving complex UX, front-end and performance problems.

Time & Schedule

This workshop is split over five days. Our virtual doors open at 8:45, we start at 9 AM PT.

The workshop sessions will run on the following days:

  • Thu, April 22, 09:00 – 11:30 AM PT
  • Fri, April 23, 09:00 – 11:30 AM PT
  • Thu, April 29, 09:00 – 11:30 AM PT
  • Fri, April 30, 09:00 – 11:30 AM PT
  • Thu, May 6, 09:00 – 11:30 AM PT

You can always re-watch the sessions at a more convenient time and follow the webinar at your own pace.

Thu, April 22: Navigation

8:45 AM PT
Virtual doors open, registration, chat and introductions.

9:00 AM – 11:00 AM
Designing in 2021, navigation, mega-drop-downs, hamburger, accordions, carousels, filters. Advanced configurators, wizards and customizers.

11:00 AM – 11:30 AM
Q&A with Vitaly on the day’s material. Networking!

Fri, April 23: Tables

8:45 AM PT
Virtual doors open, registration, chat and introductions.

9:00 AM – 11:00 AM
Complex tables, with a feature comparison table, currency exchange calculator, pricing plans.

11:00 AM – 11:30 AM
Q&A with Vitaly on the day’s material. Networking!

Thu, April 29: Timelines & Calendars

8:45 AM PT
Virtual doors open, registration, chat and introductions.

9:00 AM – 11:00 AM
Historical timelines, multi-track schedule, TV Guide schedule, music festival schedule, exhibition calendar, spreadsheets and dashboard.

11:00 AM – 11:30 AM
Q&A with Vitaly on the day’s material. Networking!

Fri, April 30: Sliders and Maps

8:45 AM PT
Virtual doors open, registration, chat and introductions.

9:00 AM – 11:00 AM
Data visualization, common issues with sliders, insurance plans, shopping mall maps, election map, opera/theatre seating plans, Formula 1 seat selection.

11:00 AM – 11:30 AM
Q&A with Vitaly on the day’s material. Networking!

Thu, May 6: Forms, Authentication

8:45 AM PT
Virtual doors open, registration, chat and introductions.

9:00 AM – 11:00 AM
Privacy issues, forms, permissions UX, push notifications, authentication patterns, CAPTCHA, onboarding. Wrapping up.

11:00 AM – 11:30 AM
Q&A with Vitaly on the day’s material. Networking!

What hardware/software do you need?

To view the webinars, please install the Zoom client for Meetings, which is available for all the main OSs. It may take a little time to download and install, so please grab it ahead of time if you can.

You’ll need a lot of sleep reserves since it’s going to be a couple of packed sessions! Bring a lot of attention to detail and non-standard thinking to this one! ;-)

Register for this workshop →