Inês Duvergé
AboutBlog
Increasing conversion on Sign-up

Prototype

A redesign of Appear Here's sign up to create a frictionless user experience and solve the high drop off at this stage. The experiment resulted in a successful increase of 45% in conversion and therefore our amazing community of brands and landlords has increased, taking us closer to our end goal – Making ideas happen.
Role
Sole UI/UX designer
Research, strategy, prototyping, visual design
Timeline
2 weeks
Fev 2019
Type
Sketch
Amplitude, Fullstory
Context
Design
Conclusion

Problem

At the time of this project, one of the overall company OKRs was to double space requests. Surely this was a very broad goal and needed some breaking down to find tangible projects that could impact it.

Finding the issue

In collaboration with the product manager, we've searched for bottlenecks in our funnels by analyzing the data, to see where issues were blocking our users from continuing their journey smoothly. 



One of our finds was that the bounce rate on the signup page was quite high, especially for users coming from specific 'lower intent' entry points, like asking for help to find a space. What could this mean?
The vast majority of signups were users which already wanted to book a shop immediately. We were losing the ones which were just exploring and not ready to fully convert yet. This was potentially a big loss since without their signups our marketing team could not re-target those users that needed a bit more convincing.
So improving this experience became one of our projects for the quarter.

Reframing the question

How do we help brands, that are not yet ready to book, effortlessly sign up?

Project constraints

‍1.  All input fields are essential to a complete profile and can't be removed.
‍2.  Developing time was limited. On that date, Appear Here had limited developer resources, as we had a major project happening in parallel. So designs needed to be considerate of that.

Validating assumptions

Me and my colleagues had some suspicions on what was causing the numbers to be lower than expected, so we used this as our starting point before the research.

Assumptions

‍1.  The form was too long for a user in 'dream' phase

Brands just wanted to continue with their search and look at spaces to see what's on offer, they were not necessarily ready to book a shop. Since most of our users are independent brands, at this phase, they are most likely to be exploring the idea of booking a shop without being ready to commit, making them less likely to fill in a long form.
2. It's difficult to go back to the previous page so it's easier to just leave the website completely

3. Text-heavy and no one is reading it
On desktop, the background image with text on top was difficult to read and text-heavy. This could result in most people skipping it altogether.

Validating assumptions and discovery

We've done some research first using Fullstory, a session recording tool, and then in person with a series of users to better understand their thoughts while navigating the signup flow.
1. In the in-person interviews, we've confirmed that most users felt overwhelmed by the long signup 😩 when they just wanted to ask for help to choose a space (lower intent users).  
2. It took time to understand what the page was about because the title of the page wasn't obvious on desktop. There was a lot of text to read as well as a lot of fields to fill, it looked complex.
3. We continuously saw users closing the browser window when they just wanted to go back to where they were before 😶  Some of them opened the website again, some don’t.

So, how did we solve these?

Blue area represents dismissible area

A less interruptive experience

Using a modal made it so that a user can easily dismiss the signup and continue their search if they are not yet ready to continue. 



This also prevents users from closing the website by mistake or because it’s a pain to go back which is something we’ve observed during our research.
Blue area represents dismissible area

One click upfront, the introduction of social signup

Including a social signup is a way of reducing the perceived effort by making it a one click choice – a no brainer. 

‍
We've opted to start with offering just Google to test out its performance before going further and integrating with more options. Google was our first choice as Appear Here is mostly a B2B platform. Facebook and other personal accounts are less relevant for our users.
Flow chart of signing up with email

Request only the essential upfront

We've also reduced the number of upfront input fields for the normal email signup by requesting the user to fill in just 4 essential fields to create an account. This made the signup look much quicker and easy. 

Hick’s law: The time it takes to make a decision increases with the number and complexity of choices.
The remaining questions are now asked in a second step. From a marketing perspective, this enables us to retarget these lower-intent users that signed up but did not complete their request.
All different copy messages depending on where they clicked from

Contextual messaging

Any signup form is always an interruption of the previous task. Because of the additional cognitive load imposed, people may forget what they were doing initially and why they are there.

To tackle this issue, it's important to recover the context of the original task and reinforce why they are there. This was achieved by introducing contextual titles dependent on the previous task.

Other design decisions taken into account

‍1.  Easily switch and distinguish from a Login and Signup page
Giving the user a clear understanding of what the page is about is essential to avoid any frustrations while submitting information. To achieve this:
‍
- Use concise titles that feature the current task
- Visually different modals by displaying different images
- Links to switch between Login and Signup located in the same place
- Use of words 'Log in' and 'Sign up' instead of 'Sign in' and 'Sign up' to avoid confusion
2. Allow space for mistakes
This can quickly be overlooked but it's essential for a frictionless experience. For example, when the user chooses to signup with email we should allow them to still change their mind and signup through Google instead.
3. Include a non-modal version
This was something I've found out while discussing the designs with my team. The developers brought to my attention that we still needed a version of the same modal but in a page format so we could link to it externally.

New signup page

Interactive desktop prototype

The results

The new signup was rolled out first through an A/B test starting with a split of 50/50 users and finally to all our users when our data gave us confidence on the positive impact of this test.

Some of the key points:
Dot
45% increase in conversion using the new signup
Dot
To my surprise, 2 out of 3 users still picked the signup with email option and not the Google one, which meant the increase in conversion was not just due to adding a social signup option but also from all the other design changes 🎉

Dot
The overall booking conversion and other general KPI's slightly increased as a secondary consequence of the change

Key takeaways

What I learned from this project is that no matter how small the project might look, there is always room for an impactful change. This project started off with an allocation of just two weeks of design work and turned out to have a very positive impact in our metrics.

As for next steps, with a bit more time I would improve the input fields' error handling by making them more reactive to the user's information. We could make it much smoother for the user with some more thought and time put into it. 



Thank you for reading this far!

Update (2020)

We've continued improving the onboarding experience at Appear Here, with  different goals in mind. I've worked on including an optional dynamic onboarding experience to be able to show tailored content to users afterwards. This improved engagement massively and it helped our overall booking metrics increase.

Previous

Arrow left

Next

If you liked what you’ve seen, email me to say Hi!
Explore
HomeAboutBlog
Email
inesduverge@gmail.com
@2024 Privacy rights
Ines's Portfolio