I improved the sign up process at Utopicode
A South American tech recruiter was in need of a smoother onboarding experience on their website.
TYPE OF PROJECT: Web and mobile onboarding, Tech recruitment
MY RESPONSIBILITIES: Research, Writing, Product Design, UI Design, Testing
TOOLBOX: Figma, Adobe Illustrator, Adobe Photoshop, Trint, Maze
PRODUCT DESIGN FRAMEWORKS: Moscow method, Iceberg method, Decision matrix
UX METHODS: Surveys, User and stakeholder interviews, Competitive analysis, Persona building, Task analysis, Journey mapping, Userflow, User stories, Prototype feedback session, Quantitative and qualitative testing
Utopicode, a South American recruitment platform, offers an innovative approach to linking software engineers and UX designers to local job openings on their website. See how my colleague and I implemented new strategies to create a better funnel for collecting necessary data from the new members.
Coders are in demand, so what’s the problem?
Client’s analytics indicated an increasingly high bounce rate among novice users asked to set up a profile on the recruiter’s website. Approaching a risky threshold of 60% of the new joiners not completing the process, the Utopicode UX team requested a full overhaul of their current onboarding flow. My colleague, Agata, and I were tasked with reducing the cognitive load of the sign up experience. Our objective was to facilitate the gathering of essential data without compromising on user satisfaction.
First impressions matter
We hit the ground running with contextual enquiries. The unmoderated rounds were a great source of feedback. I asked the users to open the Utopicode website and assume they wanted to join the platform. I asked them to share their observations with me. The key takeaway was that the site offered little incentive to sign up, leaving a lot to be desired in terms of the transparency of the process and the time required from the user to complete the profile.
Unlike the Titanic story, the iceberg was our ally
In preparation for the research stage, we adopted an iceberg model to uncover the motivations behind newcomers’ hesitancy to complete the sign up. We brainstormed a range of reasons as to why users might find the onboarding troublesome. Our intention was to dig deep into the feedback loops from our interviewees and find the root of the problem beyond our initial assumptions.
Data galore
In the first stage, I was responsible for conducting a series of user interviews and gathering insights on the current onboarding process with two custom-made Typeform UX surveys.
During our first meeting, Utopicode shared with us that senior developers are their primary focus group. So to align with our client’s business model, we selected 12 tech professionals with mid to high level of seniority for the interviews, including current Utopicode members.
The insights from the interviews could be summarised by the following recurring themes: firstly, Effort, or better the lack of it. Our users enjoy a platform that will offer quick solutions, such as a one-click feature or autofill. Secondly, a good product will allow for a degree of adaptability according to our users. They want to feel in charge when sharing their data on job searching websites. Or, as one interviewee put it, signing up should mean they are required to put in extra information only if need be. And finally, transparency. The users have repeatedly mentioned that understanding what the benefits of signing up are before they decide to use the product is of the utmost importance to them.
Two surveys helped build two personas
Concurrently, we ran two surveys. Survey no. 1 helped us build a better understanding of users’ perception of the current sign up process at Utopicode. We also gathered some first-hand insights into using online job platforms with Survey 2. This time, to avoid any blind spots in our research, we decide to expand our sample to include junior tech professionals as well.
We collected both qualitative and quantitive data. With Survey 2, we were able to notice that depending on the level of experience, tech professionals might use a product such as the Utopicode website for different needs.
Juniors enjoy the networking aspect and want to showcase their work.
In turn, seniors enjoy products that could speed up the job search process and will put them in touch with employers with as little effort as possible. Later on, this divergence inspired us to create two personas which I will introduce in a second.
Coming back to the surveys, we also managed to get the first glimpse of quantitive data, with the signup page rated by our users at 3.6 /5.
“The sign up process is super cumbersome, I would abandon it immediately if I didn’t know what the perks were.”
— Typeform User no. 9
Peeking over the shoulders of our competitors
To supplement the findings of the primary research, I ran competitive and task analyses of our client’s competitors. The compared companies were a mix of the websites mentioned by our users during their interviews and the platforms our client suggested as their market competitors.
Rather than focusing on the specificities here, I want to draw your attention to the fact that although setting up the Utopicode profile arrived very early in the process, it did take many steps before the user was given the sense that their profile was completed. On the contrary, other competitors preferred the user to take some extra steps prior to the profile being set up and in doing so, they bridged the gap between the moment when the profile is created and when the user actually feels they can now use it to find a job.
Meet Pablo and Maria
By mapping the main points the users shared with us about the product, we constructed two personas. I wrote a user story and constructed userflows for each of them. Based on these deliverables, we clarified the scope of our task.
To address the problem, we needed to create an onboarding experience that was effortless, adaptable and transparent.
At the drawing board with our client
We ran a design studio with our client that allowed us to brainstorm solutions for a better sign-up experience. The result was an iteration of lo-fi sketches followed by mid-fi and hi-fi wireframes.
With the feedback we had gathered, we were able to come up with a series of screens that alleviated the load of the process through the principle of chunking and process customisation.
Chunking and Mr Miller
To make the process less cumbersome for the user while still collecting the needed information, we turned to cognitive psychology. According to the principle of chunking, the limited capacity of working memory can often affect people’s motivation to finish a long-term task.
The importance of knowing that users’ working memory is not limitless has been ascertained back in the 1950s by the psychologist, George Miller. The law named after him has been a staple in UX psychology and instructs the designer to organize content into smaller chunks to help users process, understand, and memorize easily.
By signposting the experience in regular intervals, the flow we proposed to our client improves the retention of the user. By setting small “milestones” when one section of the flow is finished, the user feels encouraged to keep going till the profile completion.
Onboarding reimagined
The new Figma hi-fidelity flow put forward the case for a new onboarding experience. By adding selection controls and a progress bar, the new sign up journey fosters a sense of effortless continuity. The ability to save the progress or skip the questions underscores the full customisation. Finally, showcasing privacy notices addresses the issue of transparency and how the input data is being handled.
The client appreciated the easiness of the new flow stating that it “created a sense of fast-tracked funnel” that still managed to collect the needed information from the new joiners.
After the sprint has ended, as part of my freelance practice, I took up the additional task of creating a dark mode as well as the mobile version of the onboarding flow.
● See how this product works on adamwieclawski.com
Testing the new flow
The hi-fi prototype was tested on 10 users via Maze. The first insights showed no signs of dropping out during the process. The users praised the clarity and easiness of the sign up process. Compared to the sign up process from before, the overall user satisfaction rate went up from 3.6 to 4.7 out of 5.
“The new solution facilitates smoother data collection that doesn’t overwhelm the user. It is a great funnel from both the candidate’s and the recruiter’s perspectives. I also appreciate the explanations included in the flow about what Utopicode does. This helps to instil trust in our mission.”
— Fernando Poli, UX / UI Designer at Utopicode
This was easily the most comprehensive sprint I have gone through
From writing up interview plans to implementing user feedback to the hi-fi prototype; my work for the Utopicode team was an opportunity to apply my skills to a real-life scenario in a quick and intuitive way. Meeting with the client during the design studio sessions helped me better articulate my design decisions. I also learned how to deliver on the objectives of the project within the agile framework and rely on lean UX methods to manufacture a product that is more digestible to use.
Resources that helped me
I must have spent hours scrolling through my phone apps only to sign out and see what setting up a new account looked like. I took note of some great examples.
Duolingo is great at condensing the information on the perks of using the product on a few skippable screens. Slack promotes the functionalities of their product with a couple of tip boxes that highlight how each section can be used directly on the welcome screen. And then there is Netflix. I know, much can be said about their dwindling audience numbers. However, there is no point in denying that 220 million subscribers wouldn’t put up with a horrible sign up. I found that before the new user is asked to give out their details, they are already informed of what films or series they will be able to watch as soon as they put the credit card details in.
Apart from my private investigation, I found this Appuces article to be very helpful in pointing out the key aspects of a good onboarding experience. My key takeaway from it was to introduce the big Aha moment, i.e. the perks of connecting to top employers, at the start of the flow, before the user even begins to put in their details.
Finally, since our objective was to reduce the cognitive load for the novice user, I reach for Steve Krug’s “Don’t Make Me Think”. His chapter on the Big Bang Theory of Web Design and how to get people off on the right foot helped me stick to some key criteria that my flow had to accommodate, such as telling the user where to start, establishing trust and keeping the user informed about the duration of the process.
