My time in General Assembly — Project 3 : Reconstructing EzBuy Mobile App

Case Study by a group of 2, Amanda Tan and myself.

We were tasked to reconstruct the EzBuy app — a 3rd party platform which allows Singaporeans to purchase products from Tao Bao. Tao Bao is a huge online marketplace containing products sold by users from China/USA/Taiwan/Korea in Mandarin.

Both of us had known of this application but had never made purchase on it. We went ahead to download the application and started on our heuristic evaluation. Amanda and myself placed an order individually to experience the check out and delivery process.

Heuristic Evaluation

One-time onboarding Screen after download

These were the first few screens that users would see after download. We evaluated that the content involved the EzBuy’s selling points but not instructional — how to use EzBuy. We took note of this and tested if it was a pain point for user and indeed this function could have been further utilised.

Our Process
  1. Evaluation & Analysis
  • The site was messy, cluttered
  • Different colours, buttons and layout
  • Various style guide used in different pages
  • EzBuy uses Google translate, posters of items for sale are the users too hence, quality and language control over the text are flawed resulting in an inaccurate translation
  • Generally the site navigation can be navigated with patience
  • Biggest impact of the poor translation is the colour options as it deters checkouts
  • Users are not given a back button after moving 2 buttons deep into EzBuy’s app
  • In E-commerce, it is common that users dive deep into the app searching via ‘styles’,’ size’, ‘colour’ and even ‘similar products’

Above are points noted in regards to the interface.

2. Identifying themes and defining personas

After conducting 8 user interviews, we came up with four personas to represent our four common users.

  1. Dennis Wee — A university student, Chinese
  2. Grace Sim — Mother of 2, Housewife, Chinese
  3. Amirah —9–5 office lady, Muslim
  4. John Koh — Semi- retiree, Chinese
Personas

We moved forward by synthesizing our affinity map into paint points according to each personas. (Also found in blue bubbles in the previous image)

We interviewed 8 ezBuy users to gather insights. Interviewees were from the ages of 19–65, of different backgrounds and varied in spending power.

“ezBuy is very messy”

We realised that users found it to be a cognitive overload. The endless scrolling contributed to fatigue & information overload as there were too many things on-screen for users to take note.

Problem Statement : Users want an app that is less cluttered and easier to navigate

After which, we compared our site and mobile interface with their competitors and below shows some insights that we would like to highlight.

Here at General Assembly (GA), by this project ( week 4 ) we were introduced to feature prioritisation. Feature prioritisation is a process in which we find out which pain points on the interface (evaluations by the team + insights from our users) should be of utmost concern and which has a slightly lower priority.

Feature prioritisation proccesses

If users’ pain-points are not being addressed by existing features, we resolve them by refining & developing features in our solution.

In conclusion, these were the our proposed features to improve on EzBuy:

  1. “Similar items” for the purpose of price comparison
  2. Specific notifications for sales, free agent/shipping fees
  3. Filters to refine items viewed (to view only halal products/sfw items)
  4. Image search to help refine searching
  5. “Show translation”, change language features to improve translation options
  6. Chat bot to improve on current customer service

3. Testing and retesting

Sketches :

Sketches and wireframes

The top bar was created aside from the original menu to allow users to access settings and features shortcuts e.g general filters, font size and language. The features showcase on our shortcuts were decided through our feature prioritisation.

Lo-fi Prototype

My team curated a series of usability questions to test this prototype. We found out :

Users agreed

  • that notifications were easily located under ‘Bell’ icons
  • font size could be easily found under ‘Aa’
  • language can be found under ‘Aa’
  • filters can be found in the ‘filter’ icon

Users disagreed

  • that the chat bot that was within the ‘bell’ icon.
Mid-fi prototype

Mid-fi prototype

We refined design issues we found during lo-fi testing & tested them to see if they worked.

66% of users accomplished the same tasks we set out for them.

We continued to refine the problems as well as create pages for the body of the application. By doing so we made our Hi-fi prototype.

We conducted 3 separate tests this time :

1. Top Menu Bar Features

  • to test design reiterations after lo-fi & mid-fi prototype testing

2. Checkout Process

  • to test our improved colour/pattern selection on listings

3. Comparison of new & old landing pages

  • to see how people would react to the redesign

WE FOUND OUT THAT…

  • Users were able to evenly split about the location of text/language options and filters
  • Users did not immediately notice “Color/Size/Quantity” tab
  • Users did not enjoy seeing the marketplace categories high up on the landing page

PROPOSED CHANGES/CHANGES MADE:

  • On-boarding tutorials to introduce new & existing users to them
  • Changing the colour of the text to make it more prominent
  • We changed the order of categories on the landing page

What did we alter?

Boarding page

Boarding page where we took the opportunity to educate users about the shortcut menu bar. This is because the shortcut bar may not be that common and we have to assume user would not automatically navigate their way around it despite success on our usability test, we wanted an error prevention.

Screen 1 : The homepage. Inhibits the search bar and the search by camera feature. This is a well-liked feature Tao Bao itself has but EzBuy (their 3rd party app) lacks

Screen 2 : Chat bot. Chat bot automatically sends at text with various FAQ for users to click at first glance. For queries not shown, user may type in their requests

Screen 3 : Filters. EzBuy has a lot of sensitive items that should be censored when scrolling amongst family and work environment e.g sexual objects. Halal filters clothing safe for muslims (Amirah) to wear.

Screen 4 : Font/Language. Placed first, our studies shows that this would be the most frequently engaged button. We wanted to extract the current language setting by bringing it forward to the homepage. This was due to the understanding that if one were to not understand a language, one would not be able to navigate into the settings of the app to choose another language.

We realised as UX designers, we would not be able to design an improvement in Google translate. My team understood that even after switching to English, some contents would still remain in Mandarin as they were not translated due to content written by any man of any age.

We suggest to add a feature where the application would offer translation services for the description box.

We understood from our users that it would be the 2nd biggest deterrence due to poor translation. Users felt like if they did not understand the product, they would not purchase.