User journey map
Persona
User Research
Mobile
Apr - Sep 2022

Optimisation: Streamlining the daily flow and reskinning design system

Company
GWI
Role
Product Designer
Tools
Figma, Figjam, Jira, Slack
Duration
5 months

Overview

1 | Objective

  • Gather and analyse user feedback to drive iterative design improvements
  • Apply the reskinned design system to our existing product for consistent brand identity

2 | Responsibilities

  • End-to end design process, mainly collaborate with PMs, product designer and engineers
  • Collaborated with designers from other teams to reskin the design system and find out a method to work with other two design systems

3 | Challenge

  • Absence of comprehensive UX documentation, making it challenging to gain insights into past UX activities and the context of prior product development
  • Establish and maintain a unified design system for three internal products

4 | Outcome

  • Reduced steps by up to 42% by streamlining user journey
  • Optimised design system for 23% better alignment and manageability.
  • More positive feedback at the usability test stage

Product background

Pollpass is a chatbot survey platform which collects data from respondents in order to quickly gain market insights. Pollpass is divided into two parts:

01| Dash

Survey-creation backend platform for researchers and operators.

02| Messenger

A mobile-first chatbot interface allowing outside respondents to answer survey questions.

Design process

This iterative cycle enables us to consistently enhance our design. We often find ourselves cycling through these three stages multiple times based on our ongoing insights.

This process is not always strictly linear. Depending on the project's unique context and the information we had, we decided on the design stages and methods and rapidly iterated through experimentation and adjustment

User research
(Quick survey)

Quick survey to understand the latest user feedback in certain amount to determine the following direction

Created a survey with 10 questions and received 27 responses in 3 days. Questions sample in the survey:
  • How often do you use Dash?
  • How long would you spend time on Dash to create a survey?
  • Are there any elements that you believe could be improved for better usability?
  • How easy to use Messenger to complete a survey? And why? (5 point)

Messenger - Over 80% users satisfied with it

More than 80% of contributors rated it 4 out of 5 points to Messenger and over 20% of them gave it 5 points
"It was dead easy to understand, just like using WhatsApp with friends!"
"I'm really loving this modern survey format. It's quick to complete, and it makes me more inclined to participate"

Dash - Users encounter a convoluted and time-consuming process when trying to create even the most basic questions

Over 50% of contributors gave it 2 out of 5, and around 10% gave it 1.

The result showed users were dissatisfied with the survey-creation process in Dash, they spent more time inputting the survey than designing the survey structure and content, which was non-sense for them.

Key insights

"The time spent designing a survey shouldn't equate to inputting questions into a survey platform, the latter should be straightforward."
“I have tried other survey creation tool and I prefer that one, I can complete a task faster in Dash”

How might we we speed up the survey-creating process?

Although our users can complete the scripting in the Dash and send out a survey, the process was taken longer than we expected. We identified an opportunity to speed up and clarify the process to enhance usability.

User research
(Interview)

Focus on optimising Dash - Conducted user interviews for in-deep understanding the scenario, needs and pain points

Since most of the contributors were satisfied with Messenger our team agreed we should focus on improving the experience in Dash.  So, I conducted a moderated interview with 4 internal users via Google Meet. Main questions I had asked:
  • On average, how many questions do you create on the Dash?
  • What kind of questions you created the most? Can you show it to me?
  • Please created these two prepared questions to the Dash. (Behaviour observation)
  • How could we improve our product to better meet your needs?
  • How would you compare our products to our competitors’?
Then I transcribed the content and the grouping as below to find the main insights
💡 Insight
According to the survey sample provided by users, we found that:
- The number of questions they built is often between 50 - 120
- Around 70% of questions are simple question without any coding

Problem

01 | Users keep switching between pages

Users have to pop in and out repeatedly just to complete a simple task.
“It's very very time-consuming very inefficient, and we have to check the surveys after created it which means we have to go through all the things twice, the flow is too complicated”
“It’s hard for me to teach junior people how to use it, it's hard to memorise and explain because it doesn’t make sense”

Survey creation flow in Dash

02| Manual input of answer codes is time-consuming and tedious

Users have to add answer codes manually on every single question.  In some complex project, they have to add 1000+ answer codes for one survey.
“This is something could be automated that would make our life easier”
“I hate it so much, really manual one by one”

03| Users prefer use competitor's tool to create survey

Users have mentioned a competitor called Qualtrics, which giving them a good experience, so then I conducted a competitive analysis, mainly to understand their user flow.

Competitive
analysis

Qualtrics simplifies question creation with an auto-input function

I identified the differences between two products to understand their approach to improving our competitive advantage. The table and user flow shows that their steps were less than us.

How might we shorten the process of scripting a simple question?

I revised my original HMW statement after I gained more insight from the different research I have done. This helps us with ideation and focusing on the right problem to solve.

Hypothesis

01 | Assuming that streamlining the process of creating simple questions can help users save time

To streamline the process and quickly create value for users, I invested time in categorising questions in Dash into two types: those with conditions and those without.

After discussion with the team, we decided to focus on streamlining those questions without conditions, reasons below:
  • Most of the surveys with at least 50% questions without conditions setting
  • Optimising efficiency by having junior researchers handle simple surveys, allowing senior researchers to focus on high-level tasks

02| Assuming streamlining the structure can help enhance user understanding and reduce duplication efforts

Through my review and analysis of the IA to identify pain points, I streamlined the question creation process, reducing it from three pages to just two.

Design system

While working on this project I also re-skin and making sure that the new designs followed GWI’s new design system.

Why do we reskin the current design system?

There are three products under GWI, but Pollpass's design system is totally not coordinated with another two, hence, enhancing the consistency was necessary and will be more manageable in further projects.

What did we do before starting to redesign the system?

I have reviewed the current one then compared 3 products of GWI and find out the inconsistency.

Key findings in the current design system:

45%
of colours are actually used in Pollpass
24%
of colour name mismatch: DS vs. GitHub
16%
16% elements are not consistence

Usability
testing

Ease the user pain points, user satisfaction increase 25%

I conducted moderated usability tests with interviewees, and most of them rated 3 out 5 to the new design. On average, they spent 35% less time on creating and checking survey questions compared to before.  

And some sights were found during the testing as below.

Takeaway

Enhancing documentation practices

When I first joined GWI, I encountered a substantial number of visual artifacts, primarily mockups. Initially, comprehending these in the context of the complex system posed a significant challenge. For example, I struggled to understand the rationale behind design decisions based on these mockups and the insights they conveyed. To address this, I initiated the following steps:

Creating an organised repository:
I established a dedicated folder to systematically manage research findings, improving my comprehension of the overall picture.

Constructing user Flows and information architecture:
I initiated the creation of user flows and information architecture. These practices substantially augmented my understanding of UX activities and the system's structure, while also fostering a deeper familiarity with the product. Furthermore, they became instrumental in ideation processes.
👇 Get in touch for opportunities or just say 👋
OverviewResearchProblemHypothesisDesign SystemDeliverableTakeaway