UX Design

UX Design

ExpertApp
App

An app providing trustworthy answers from any field respecting and improving user’s time capacity.

Expertapp_Full-width image@2x

PROJECT: Application for everyone who asks questions

Kind: Mobile app

Role: UX Design

This case study concerns one of my projects that I had a pleasure to work on. The project showed me that power of UX is in the process, process, that takes time and only the taken time can give a great result.

My process:

1. Empathize & Define

  • Research — competitors

  • Double diamond

  • Interviews & Persona

2. Ideate & Prototype

  • User Flow

  • Low & mid-fid Wireframing

  • High-fidelity Prototyping

3. Test

  • Usability testing

  • Improvements

4. High-fid Prototyping & UI

4. Hi-fi Prototyping & UI

Empathize & Define

Empathize & Define

Research

I started with hypothesis that users struggle with a lack of tool helping them solve problems, answer questions just in time and being sure at the same time that it's a trustworthy source.

Then I googled, googled and once again googled. I was looking for an answer . I found a few platforms such as Reddit, Quora and StackExchange. I checked what is that people ask for, what are the problems, I also checked what people think about such platforms. If they are satisfied with what they get, if the platforms fulfil their needs. What I had found out resulted in:

📃 PROBLEM STATEMENT

There is a need to solve everyday issues, answer variety of questions. Everyday life questions and much more complex questions as well.

The information searched by user have to be delivered as quickly as possible and must be credible and trustworthy.

Google search provides indeed lots of information and possible solutions, nevertheless, there is no guarantee that the results are credible. Searching for a credible and trustworthy information is on the other hand very time-consuming.

💡 POTENTIAL SOLUTIONS

The App should provide users lengthy expert description, certificates that prove the expert's knowledge and also comments & recommendations given by those who already took advantage of the service.

Another very useful and helpful feature will be estimated response time for each expert profile.

Tell A Friend system will be a helpful feature to grow the community and groups inside the app.

😟 POSsIBLE PROBLEMS

Credibility and professionalism of experts. Their knowledge and experience has to be proven and certified. Given answers have to be controlled and approved.

Written questions could be specific, detailed or on the other hand not specific enough so the system may have issues to successfully ascribe them to an expert.

Time for a reply - it may take too much time until user receives an answer. Meanwhile answer might be found somewhere else.

Expertapp-hero4

Interviews & Personas

Interviews & Personas

After quick online research and defining the problem statement I moved to more qualitative activities - interviews with people who might be potential users of the ExpertApp.

Four people in total were interviewed. All of them with different professional background and in different age. All of them were asked about the process they currently use while having issues to solve and about the tools they prefer or do not like at all. For all of you who would like to read the detailed interviews here is the link to GDrive: Interviews

To cluster the insights from interviews I used affinity mapping - the best way to get organised. I found some patterns in answers and clustered it into:

Functionality / Interface

  • the app needs to provide answers quickly, no time to wait
  • no redirecting to other platforms
  • the app needs to be easy and simple to use - no time to think how to use it

What do I search for online?

  • for answers
  • to find out like others do things we don't know
  • to be aware of changes on the market and how process of doing something has changes

Quality of service

  • reliability
  • fast & high quality information
  • trustworthy feedback, not necessarily from one person, expert, however, still approved information
Jane-persona
aga-persona
Matt-persona

Ideate & Prototype

User Flows

Low-fi wireframes

Who loves pen & paper? Hands up! I do love and I believe in its power so this time I also started with sketching first ideas on paper. Based on the gathered information: competitor analysis, interviews, personas and user flows I made a few wireframing sessions with different levels of fidelity to give the App the first visual form and find out the challenges awaiting for me.

However, before I started sketching I had made a few thoughts on Mobile-first Design. I clustered functions that should appear in the app in different breakpoints, asked myself what would be the difference in achieving goals on multiple breakpoints and finally I made the decision to mainly focus on mobile but still consider the desktop. Why mainly mobile? First of all, because research showed it would be mostly preferred by people, second of all it's always easier to design for a bigger device while having small done, than other way round.

Back to wireframing! Here is the result...

1_wiDtb98cRWYN3pUEXmhYjw

Mid-fi Wireframes

Before I had moved to mid-fidelity wireframing I did a few sessions of rapid prototyping - it helps to nail down ideas and...it's fun!

Wireframe@2x

Hi-fi Wireframes & Prototype

My next move was high-fidelity wireframe and building from it a prototype. It's a greyscale wireframe. I did it on purpose. Content, spacing & structure are high fidelity, however, no colour scheme. I did it to not defocus testers from the main purpose of the app. I wanted to test solutions inside the app and not create aesthetic distractions.

Project #1

Test

Usability Testing

BIG DAY! Usability testing day. I have conducted usability testing with six participants with very different professional backgrounds and in different age. Exactly like created by me personas. Four usability tests were in-person and two remote. Tested mid-fidelity prototype was done in InVision. Usability tests gave, as always, a big learning about users and that UX designers need to go out with the project as soon as possible to challenge every idea they have. This time I used again the affinity mapping to cluster the feedback:

🧐 Observations

  • bottom menu was very clear & intuitive
  • paying attention to the estimated reply time even if not asked
  • Agata was thinking if the search results are for the typed word
  • Agata was very lost when she opened a Cook masters group
  • Sabina was shocked when the fidelity of the prototype limited her
  • Moves and decisions very showing that the participant is a iOS user

😞 Errors

  • Group settings are not available under SETTINGS or MY PROFILE
  • No separate SEARCH button
  • Plus icon not visible
  • After tapping on the plus icon next step not clear enough
  • My groups and experts + my chats
  • JOIN button not active in detailed group view
  • Could not find the plus icon at all
  • Sequence of fields inside the Cook Masters group
  • Expert Lara Jack could not be found via search field

➕ Positive Quotes

  • Oh this one has really long estimated time of the reply...
  • Ok, so I am going to Groups and Experts and here is the Cook Masters group, that was very easy
  • I enjoyed the task a lot, please remember about me for the next time.
  • I have never seen such thing, almost looking like an App, I am really curious what will be inside.
  • I found the Bikers groups easily, everything was pretty clear to me.
  • I like what you did in general, everything is very clear and structured even though it is still in a greyscale and without real content.

➖ Negative Quotes

  • Why on the login screen the Facebook and Google logins are clearly more visible? It feels a bit pushy in my opinion. Like it would be recommended.
  • yeah, true, sometime you use it as a search but I treat it more like an ENTER when you want to send a message or jump to a new text line
  • I don’t like the plus, I don’t see it...I don’t like the solution at all. You should change it!
  • Okay, so probably I should go to Groups and Experts but you should thing of naming it as MY Experts...it is not clear at all for me
  • First the telephone icon that would mean that she can call a group - conference call? Stupid in my opinion.
    Can I call her now just like this?!

Improvements

Testing and clustering feedback is one thing. Making right assumptions and decisions is another one. Nevertheless, I do believe that moving forward is way more important than being right, so I tried to make decision about improvements as fast as possible and move the project to another stage and test it again.

These are the major points I found to be necessary to change:

  • Wording on buttons and input fields need to be as simple and as clear as possible.
  • Information architecture needs to be restructured.
  • Social login buttons might be for some people misleading.
  • Search field is used by many users as a global search for everything inside the app.

High-fidelity Prototyping & UI

Hi-fi prototype & UI

When my first version of high-fidelity, not anymore greyscale, prototype was ready, I had asked online a few people for feedback and after the iteration I made changes again that resulted in the following version of the ExpertApp.

UI style guide

While working on pixel perfect components of the app, I tried to keep all components organised and consistent what was a great way to build a style guide. Style guide is extremely important, especially when the app is in process of development. Helps stay in consistency.

Text Styles

SF Pro text@2x

Color palette

Color palette@2x
UI Elements@2x

Illustrations

Illustrations

Propertly – illustration@2x

Conclusions

Sketch icon

Test any idea as fast as possible, if it really considers an idea: pen & paper wireframe is enough.

Mobile icon

I can't underestimate user tech saviness. Even the elderly users recognize patterns or where the patterns are broken. Focus on distiquishing features and ideas while testing is the key.

This project portfolio is a consolidated document that aims to give you an understanding of the project objectives, goals and methods used to develop it. The process was much more extended and included e.g. A/B testing which was not mentioned here. While working on UI I also paid attention to accessibility and general improvements that would make the app accessible to as many people as possible.

Other Projects

tes2UU

TestUX Design

ExpertAppUX Design

PropertLyUI /UX Design

Got a project?
Let’s get in touch!

Got a project?
Let’s get in touch!

© Copyright Ewa Mieżwińska 2020. All rights reserved.

© Copyright Ewa Mieżwińska 2020. All rights reserved.