Booklyng's "Wizard" Manager

The Problem

This Wizard hasn't been “designed” at all, but it grew up day by day, month by month in the hands of the developers.

This is how it goes in a startup!

Even if the developers had done a quite good job considering all the limitations it was obvious that we needed to find time to work on it, and find new solutions from a user experience point of view.

Booklyng’s major asset is their exclusive tool board, called: “Wizard”, that gives you the ability to create a campaign, an offer and customer journeys with just a few clicks.

Everything was layed down and structured in nested tabs. And that was making the interface quite difficult to navigate, also the more important tools and elements were hidden. On top of that the preview was below everything. In a normal editing situation the user was scrolling down all the time to see the results.

Strategy/metodology

We were trying to follow what I consider the essential path for any correct design process: User research, mockups, wireframing, prototyping, testing, final design, implementation.

The team was using Lean UX methodology.

Based on Lean-Agile methodologies this is a process that identifies a problem that should lead to some assumptions that create hypothesis, so you can quickly develop real solutions and/or amend them, ditch them or add new ones. An idea based work in progress process, more on this here.

Research and analysis

We made 35 interviews with some of our customers and asked them to highlight their pain points.

We tested for:

• Navigation
• User interactions and workflow
• Design element interactions
• Product page behavior
• Whole process time (create a product)

What became clear was that overall the Wizard was quite difficult to use for someone that didn’t have design and/or coding knowledge.

For a hotelier that only wanted to create an offer for his/her hotel the Wizard was just too much, they didn’t have neither the time nor the capabilities or the desire to dive into all the Wizard’s possibilities.

Solution

• Concentrate on ready made, reusable products.

We started to create different themed sets of offers, consisting in a sub product for each step in the customer journey. We also created custom user journeys based both on our past experience and on specific suggestions, ready to be used by our clients.

• Create two different intervention layers in the Wizard: simple/advanced.

We decided to temporarily hide the advanced functionalities for default and to present only the basic ones to the normal users. This way you could really create a basic, still effective product/offer in nearly no time in the “simple” mode but still had the chance to develop a more complex product if switching to the “advanced” mode.

• Reorganise the main Hotel Configuration.

• Make the Theme section easier to use.

Design & Implementation

We went back to interviewing our users, new feedback was collected and smaller changes were made.

We also used Browserstack to test more technical details and being sure that the Wizard’s layout was working fine on most devices.

Results

After just one months of our new release the Wizard Manager lifted its usability by 62%.

+62%

SUS (System Usability Scale)

Its now characteristic double layers nature became an essential element to present to new customers and attract them.

Tools used