To wizard, or not to wizard: designing forms that work

“Dear Optimal Workshop

We’re designing a membership application. Some people think it’s best to bring the customer to a landing page and let them self navigate to add the features they want and complete their membership. Yet others think that the customer should be guided through a linear process. Are there any best practice principles that we should adhere to?”

— Mary

Dear Mary

I believe there are merits to both so I’m going to jump right in with a classic compare and contrast, and I’ll follow that up with my top six tips for designing forms.

Team Wizard — The yellow brick road tour guide

Team Wizard definitely have it’s benefits. The must-read book Designing Interfaces describes a wizard as leading the user through the interface step by step to do tasks in prescribed order. It’s quite possibly the more idiot-proof solution of the two, and improves the chances of people filling out every last little thing. It does have the potential to fall flat on its face and never quite make it to the Emerald City though, so keep the following things in mind if you go with this option.

Your users need to know where they are in the process the whole time, so a progress indicator is a must (otherwise you may get users shouting the common refrain ‘Are we there yet?!’). The best progress indicators give people a clear understanding of how long something will take, and give the impression of ease.

I’m thinking you may want to stick with 5 or 6 steps at the most — I know if I went to fill out a form and saw I had to get through 10 steps or more, I might be tempted to give up and start browsing online shoe stores. For a truly comprehensive grab bag of ideas, check out this great resource — it collates 50+ ideas for progress indicators from around the web (if you’re meant to be doing something else right now, just be aware that it’ll be hard to turn your eyes away!)

In terms of content, keep a no surprises policy in mind, and give people an easy way for people to see if they’ve missed something — there’s nothing worse than getting to the end and finding you’ve made a mistake on step one and have to go all the way back to the beginning (workplace travel provider that shall not be named, I’m looking at you!).

Team DIY — The independent self server

There are two types of shoppers in this world: those who use self serve checkouts and those who don’t. Some of us just want to get in, get what we need, and get out. And some of us prefer a service experience. Team DIY fulfils the former…provided the IA, content, visual design and much more supports it! If not, it could very well end up like that self serve checkout at my local supermarket that hides the watermelon under ‘M for Melon’!

You mention the idea of letting customers ‘self navigate to add the features they want and complete their membership’. Sounds wonderful, this idea of ‘self navigation’, and ultimately I’m sure that’s what we want our websites and products to enable people to do. So in order for people to do that, they’ll need the form to have a water-tight structure, with distinct sections, informative headings, clear-as-day instructions, a guide to progress (like numbered steps), and probably short descriptions of what each element of the form is asking for (which may pop up when they hover, for example).

When Team Wizard met Team DIY

Why not offer your customers the option! You could combine elements of both into one union of guidance and self direction, that allows the customer to customize their experience. There are a few ways you could do this — you could plonk them on a landing page with a clear starting point and provide interactive help options that the customer could switch off if they wants, or you could start with the wizard and give them the option to opt out and go DIY.

Either way, it almost goes without saying but I’ll say it anyway: test it, test it, test it. You could A/B test Team Wizard and Team DIY or you could run an A/B/C test and invite their merger to the party and see what happens. You’re not really going to know for sure what your customers prefer until you test it.

Resources + my top six tips

I found a few interesting articles on this subject that I think you’ll get a lot out of. This article by Samantha Mykyte discusses best practices and this article by Deborah Kim looks at some things you should avoid doing. Also, keep in mind that, in a way, all the people who use your form are first-time users.

Now, before I leave you, there’s one more thing that I’d like to touch on briefly. Have you ever signed up for a membership more than once? You might have some that you renew annually but beyond that this really is something most people do just once. Krystal Higgins writes a blog that looks at designing fantastic first time user experiences that’s well worth a read. I also found this great article on the bipsync blog that discusses some of my suggestions and much more in detail that I’m sure you’ll find interesting!

To finish, here’s my top six tips for forms, both wizards and otherwise:

1. Give your users a clear starting point
2. Make it easy for your users to get help if they need it
3. Keep your content clear and concise
4. Provide specific hints and examples about the information the user has to enter
5. Chunk similar questions together
6. Short and sweet is the name of the game

Thanks for the question Mary 🙂