Skip to main content

Form Design Masterclass

Adam Silver
On the web
adamsilver.io/
On Twitter
@adambsilver
Tickets
Get a ticket

Workshop includes:
  • Working examples to take away
  • Interactive sessions
  • Workshop recordings
  • Dedicated Q&A time
  • Smashing Certificate

Workshop, 4×2h + Q&A • Tue & Wed, January 19–27
09:00 – 11:30 AM PDT (Pacific Daylight Time)

At first glance forms seem easy but look around the web for 30 seconds and you’ll find a million and one usability issues that stop users from doing the very thing the form was designed to help them do.

After this workshop, you’ll be able to design forms that avoid these problems because you’ll have the mindset, principles and techniques to make user-friendly forms that people can complete quickly and easily.


Who is this for?

This workshop is for anyone involved in the design of products and services that use forms including but not limited to designers and front-end developers.

Knowing some code would be useful, but it’s not essential.

You’ll learn how to:

  • Design forms using efficient, robust, accessible and mobile-friendly form components and patterns
  • Analyse existing forms and fix the problem areas
  • Get you and your team to justify the questions you ask for and come up with the best ways of eliciting answers from users
  • Help users recover from errors using well thought out validation patterns
  • Use shorthand syntax to design forms in a quick and collaborative way no matter your level of technical knowledge
  • Write clear, concise microcopy for labels, hints and error messages so that users know exactly what they need to do

What you’ll need:

  • Google Docs (sub for another word processor)
  • Google Sheets (sub for another spreadsheet)
  • Google Chrome (sub for Firefox)

About Adam Silver

Author of the Smashing book Form Design Patterns and interaction designer focused on design systems and inclusive design. Adam has plentiful experience in design systems, accessibility and form design.

He also runs his newsletter, Good Design where he writes articles on nailing the basics, avoiding complexity and making things that work for everyone. He regularly shares his insights at @adambsilver.

Register for this workshop →

Time & Schedule

This workshop is split over four days. Our virtual doors open at 8:45, we start at 9 AM PDT. There will be several breaks every day.

The workshop sessions will run on the following days:

  • Tue, January 19, 09:00 – 11:30 AM PDT
  • Wed, January 20, 09:00 – 11:30 AM PDT
  • Tue, January 26, 09:00 – 11:30 AM PDT
  • Wed, January 27, 09:00 – 11:30 AM PDT

Day 1

8:45 AM PDT
Virtual doors open, registration, chat and introduce yourself.

9:00 AM
We’ll start with a basic sign up form and take a look at all of the foundational parts of a well-designed form and how to think about them. We’ll do some question protocol mapping to make sure our forms are as lean as possible.

  • Float labels or static labels?
  • Placeholder, tooltips or something else?
  • When is ARIA useful?
  • Bordered inputs or just underlines?
  • Which input type to use?

All of this and so much more.

11:00 AM – 11:30 AM
Q&A with Adam on the day’s material. Chat with each other.

Day 2

8:45 AM PDT
Virtual doors open, registration, chat and introduce yourself.

9:00 AM PDT
We’ll look at the best way to validate forms and help users recover from errors. This is crucial because no matter how good our forms are, some users will make a mistake. It’s our job to get them out of this low point as quickly as possible.

  • Do you give feedback as the user types or when they submit?
  • Can disabling the submit button until the user’s input is valid work?
  • How do you write a clear and concise error message?
  • Where do error messages go?

All of this and so much more.

11:00 AM – 11:30 AM
Q&A with Adam on the day’s material. Chat with each other.

Day 3

8:45 AM PDT
Virtual doors open, registration, chat and introduce yourself.

9:00 AM PDT
We’ll look at how to design longer, more complex forms but this time by analysing and redesigning a real life checkout form for both new users and repeat users.

  • Multi-page or single page checkout?
  • Are progress bars useful?
  • Handling optional form fields?
  • Should you use select boxes, radio buttons or something else?
  • How do you design and code custom radio buttons?
  • Where does the back button go?

All of this and so much more.

11:00 AM – 11:30 AM
Q&A with Adam on the day’s material. Chat with each other.

Day 4

8:45 AM PDT
Virtual doors open, registration, chat and introduce yourself.

9:00 AM PDT
We’ll look at patterns that help users fill out very complex and long forms. After that we’ll look at tools to help design forms rapidly and collaboratively with an emphasis on the most important details.

There will be plenty of time at the end to cover off any gaps and topics not addressed in the previous 3 days. So please come with questions.

11:00 AM – 11:30 AM
Q&A with Adam on the day’s material. Chat with each other.

Register for this workshop →