Expert | Mobile App
Connecting people to an expert in the technology field within minutes.
I designed a concept mobile application that would enable anyone, anywhere to connect with an expert in the technology field. The app gives people a simple and intuitive way to connect with an expert quickly so they can get the answers, information and advice that they need. This project was completed as part of the CareerFoundry UX Design course.
The result is a clickable prototype of a mobile application that allows people to connect with experts in the technology field for their professional and personal development and goals.
Duration: October 2017 — March 2018
Sitemap and Card Sort (OptimalSort)
Mid-fidelity Wireframes (Balsamiq)
High fidelity Wireframes (Adobe XD)
Clickable Prototype (Invision)
Design documentation: Style guide & pattern library
I sat down and learnt about the design brief and requirements. The problem that I was trying to tackle was:
People aren’t always able to find helpful advice or expertise that they need from their friends or family. A search online for answers and how-to videos don’t always provide the specific answers that people are looking for.
Based on this problem, I came up with some assumptions that I wanted to validate:
• Finding the right expert to get advice from is either difficult, time-consuming or too expensive
• Searching for expert advice online is overwhelming and confusing - with so many results it is difficult to pick the right one
• Searching for experts online may bring up inaccurate, irrelevant or misleading information/advertisements
• Apps that are not intuitive nor easy to use makes for poor user experience
• Apps that have poor user interface make them visually unappealing and off-putting to use
Our Expert app users need a simple and quick way to find experts and to pay for affordable expertise because they want expert advice for their questions and problems. Our users want to be able to search for the relevant experts accurately and connect with them in a timely way. Our users also want to use apps are user friendly and pleasing to use.
I researched and carried out a competitive analysis of Expert’s competitors Expert Impact and Slack. Through analysis, I gained a deeper understand of how these platforms connected users with businesses or experts. I was also able to gain a better understanding of the needs of Expert’s potential users.
I also conducted a heuristic evaluation of Slack’s mobile app on Android to understand the strengths and weaknesses of its user experience. I drew inspiration and learnt from the strengths and used the weaknesses to understand how I could create a better user experience for Expert.
- Bold and visual information
- Clear affordances
- Neat layout and navigation
- Hidden menu
- Clumsy content order
- Confusing call to action
I conducted three user interviews with potential users of Expert. These were people whose professional work or studies directly or indirectly involved the technology sector and people who are heavy users of mobile applications. I conducted user interviews in order to understand user’s experiences of:
a) using mobile applications
b) searching for expert advice and technology related information.
Through user interviews, I was able to uncover user’s needs, pain points and challenges. I synthesized them into high level themes:
- Users like features that make apps accessible, personalized & easy to use.
- Users want simple, intuitive and visually pleasing user interfaces and navigation.
- Apps with poor functionality are frustrating or difficult to use.
- Users seek expert help by using Google, social media platforms or forums. Users also use their professional network and social circle.
- Seeking expertise and expert help is frustrating due to delayed responses, irrelevant information and the time-consuming task of finding qualified information.
It was clear that the research validated the assumptions made earlier during the discovery phase.
By using affinity mapping to sort through and organize the information collected the user research, I was able to identify patterns in user’s needs, behaviours and pain points.
Key findings from the research:
Behavioural patterns of website and app usage:
a) Habitual: Users frequent technology specific websites almost if not everyday. Users want ‘go-to’ apps and websites that provide experiences so that usage becomes habitual.
b) Purposeful: Users use apps and websites for specific purposes and tasks, such as Google Maps for journey mapping, Quora for quality answers and Wunderlist for productivity. Social media platforms such as Facebook, Twitter and YouTube are also used heavily.
c) Enjoyable: Users enjoy using services that are easy to use, seamless and highly optimised. They want experiences that are intuitive and have customizable features and options. Slack was commended to be very simple to use and intuitive.
a) Apps that are not intuitive or don’t work as expected
“I found Snapchat confusing at first — I didn’t intuitively understand how it worked.”
Apps that are not immediately intuitive and difficult to understand causes the user confusion. Users are frustrated when apps don’t work the way they expect them to. For instance, two of the three users interviewed found Skype to be particularly frustrating, stating instability of the service as the reason.
b) Not being able to find relevant help or information
“There were times when I wish there was a reliable person who could give me feedback or helped me out when I was stuck.”
Users wanted personalised and specific help on their work but were unable to find that. When users searched online for information, they were frustrated when they found irrelevant or out of date information.
c) Frustrations around waiting
“I’m frustrated when people don’t get back to me in a quick enough timeframe.”
Users are frustrated when they have to deal with slow or a lack of response from people they try to connect with online for professional purposes. Time-consuming tasks such as filtering people on the internet based on credentials or apps that take too long to load are also sources of frustration for users.
User’s thoughts on Expert app:
On searching for experts, users want to be able to do quickly and easily. Users would use Expert app provided the app has a quick response rate from experts. Users want the first point of contact between themselves and the experts to be through text-based messaging.
Once I had synthesized the research using affinity maps, I created three user personas based on their needs, behaviours, motivations and pain points.
To ensure that I designed for my user’s needs, my design process was guided by the three personas I created. I then created user journeys to map out user’s thoughts, emotional states and the opportunities for design along the journeys.
With the user personas, journeys and flows now mapped out, I began ideating solutions. Referring back to the requirements of the design brief, I made sure to focus on designing an app that is intuitive, easy to use and responsive to the user’s needs. I mapped out the functionality and features of the app, including: a search function, reviews and ratings of experts, an easy way for one to one communication and a standardized method of payment for calls.
Sitemap and Card Sort
I created items representing Expert app’s pages and conducted an open card sort using OptimalSort to understand how participants might organize the app’s information architecture in a way that would be logical and intuitive to them. 6 participants participated and completed the card sort. Conducting the card sort allowed me to compare how participants organized the items to how I organized the items.
The results showed that no two items were sorted into the same category by all the participants. Furthermore, the overall result of the card sort showed variability in how participants categorized items that fit into Settings or Profile. In hindsight, I might have conducted the card sort with more participants in order to get a clearer result. Nonetheless, the card sort helped me refine my sitemap.
The result is a sitemap that is clear, organized and informed by user’s needs. The sitemap would be the foundation from which my prototype would be built from.
Sketches and wireframes
I sketched out low fidelity sketches on paper, focusing on just the core functionality and key features. Even at this stage of prototyping, I thought in terms of simplicity, intuitiveness and practicality. Anything extra would be unnecessary and would not serve the purpose of delivering an intuitive and seamless user experience.
I conducted usability tests with 6 participants in order to test the prototype’s functionality, usability and desirability. The goal was to gather insights into how the design of the prototype could be improved in further stages of refinement. I asked participants to complete a series of tasks, with the objective to:
- Determine the ease of navigation between screens and sections of the app
- Discover potential blind spots in the design
- Discover participants’ pain points and pleasure points
All but one usability test was conducted remotely via Skype across three different time zones. Much preparation was involved to ensure that the usability tests ran according to the right times and schedules in order to obtain the best possible results.
Once usability tests were completed, I sort through and analyzed the results using the rainbow spreadsheet to organize the data collected.
I prioritised the changes I would make to the prototype based on the severity of usability issues. This was measured by the frequency such issues came up during usability tests.
The key learnings were:
a) Drop down search filters on the search results page was confusing users.
b) Users expected to be able to search for experts from the home page but weren’t able to.
c) Users wanted to search and see filters at the same time.
d) The lack of call rate displayed on expert’s profiles created uncertainty.
e) Users expected to see a confirmation after successfully booking a call.
I conducted a preference test on the sign up page to understand which version users preferred and why they preferred one design over the other.
Version #2 was chosen 8 times compared to version #1 which was chosen 4 times.
Feedback for version #1:
- “Easier to read. Less lines to read.”
- “It is the simpler option.”
Feedback for version #2:
- “The login and sign up were prevalent.”
- “You have the icons for Facebook and Twitter so it makes it look clean and easy to recognise the different options for signing up.”
- “More user friendly and takes up the whole page.”
I made iterations to the designs following the feedback I received from rounds of usability testing.
Here are the key iterations:
a) Search filters
I changed the area of expertise filter from ‘Machine Learning’, to ‘Choose an area of expertise’. This replaced a singular area of expertise to a call to action. I changed the wording for search filters from ‘All filters’ to ‘Select filter’ and removed ‘Relevance’ and replaced it with the ‘Sort by’ filter.
b) Search function on the main screen
I linked the expert profiles on the main screen to the search results page so that users can quickly and easily search for experts from the get go.
c) See filters and be able to search simultaneously
I integrated the search bar into the search results page, giving users the option to directly search by name or area of expertise as well as filtering their search.
d) Display call rate on expert’s profiles.
Users were unsure if there were different rates for different experts or if there was a fixed rate. To remove the uncertainty from users, I included the call rate on expert’s profiles so that users can make an informed decision about booking a call.
e) Confirmation of a successful booking of a call.
Users expected to see some form of feedback to know that they had successfully booked a call. To make this clear for users, I changed ‘Confirm call’ to ‘Confirm booking’. I also created a confirmation message immediately after they had booked a call and included a call to action ‘return to home’ to direct them back to the main screen once users had seen the confirmation.
Further usability testings were conducted to uncover remaining usability issues. Subsequent iterations were made.
Design Documentation: Style guide and pattern library
The elements of the design documentation adheres to the Material Design Guidelines. The purpose of Expert app is to quickly and easily connect users to experts in the field of technology. As such, the tone is personable, proper yet unpretentious. It reflects the overall design of the app - intuitive and simple.
The use of colour throughout the app is kept at a minimum and serves to highlight information. Navy blue was chosen as the primary colour for its associations with expertise, trust and professionalism.
Interactive and Clickable Prototype
Link to InVision prototype: https://invis.io/ZQFTHRDTPJ6