Market Guide

Overview

Market Guide, the only Thailand marketplace guide application, is friendly for all kind travelers that connects online-to-offline and turn visitors into the local one. The prominent point of the app is we use indoor navigation on the live map feature. We also highlight deals and promotions to bring more traffic to small merchants.

Directory Mobile Application

Project Type

Digital Ventures Co., Ltd.,

Intellectual Rights

May - July 2018

Time

UX, Interaction, UI Designer

Role

Challenge

Digital Ventures launched three market guide applications: Chatuchak Guide, Rattanakosin Guide, and Platinum Guide. All the guides help travelers find stores, restaurants, accommodations, and others in the respective area. We decided to merge all the apps into one, so users can search for shops and restaurants around Thailand easily. It's also more convenient to maintain for the business. In case we want to add more markets, we don't have to spend time and effort to build another application.

For this new version, we wanted to enhance and add more features. We spent numerous hours brainstorming what we should add, and we came up with plenty of features. The topics we discussed were about the possibility, effort, and resource of creating all of those features compare to the deadline. We couldn't agree on what features we should add and prioritize which functions we should build first, so I suggested we step back and run a few workshops to find user persona and learn more about what our user's need.

Process

Define

Problem Statement

Persona

Empathy Map

Ideate

Feature Narrative

Information Architecture

Prototype

Low-fidelity Wireframes

High-fidelity Wireframes

Testing

Designer Critiques

Stakeholder Reviews

Iterations &
Deliver

Detail Editing

Deliver Elements

Define

Though the primary purpose of creating this application is to increase awareness and revenue for small business, the end-user of this app are the customers of those businesses. I moderated the brainstorming sessions with other business departments to identify the character of our user. And it came to the result.

The ideal customer that contributes to the shops and restaurants in our app should be a person who loves to shop in the market and enjoy eating street food.

Mew Panwisa

Mew Panwisa

Age: 27

Occupation: Employee

Status: Single

Location: Bangkok, Thailand

About

Mew is an employee. Eating delicious food and hanging out after work or on weekend are the way she release the stress from work. On her free time, she uaually surf on the Internet, reading reviews, watching, and following vloger on youtube. She always leaves her review wherever she goes.

Goal

  • Search where to go and eat delicious food.
  • Read the review of the restaurant.
  • Take photo of where she goes and post on social media.
  • Plan her trip before the weekends with her friends.

Frustrations

  • Cannot find place she wants to go in the map.
  • Go all the way to the place she wants to visit to find that it is closed.
  • Get stuck in the trafic.
  • The restaurant's atmosphere is not good for shooting photo.

We discussed the problems that might occur with our user since the trip planning process through traveling, shopping, and until she gets home. We put ourselves in the user's shoes, thinking about how we would feel and react to the situations. We used the empathy map technique as a tool to get more insights into the way our user thinks, acts, and feels.

Scenario: On Sunday morning, I want to go shopping and grab something to eat in a local place.

After we got the user’s insights, we picked the critical problems to fix first. You can see them on the green post-it. We could frame new features according to the solutions to those problems.

Ideation

Based on the needs of our users, we finalised the features we would like to build first.

Key Features

Phase 1

Holding

I studied the structure of the existing apps and how they navigate, then analyzed and created new practical navigation for a more complex structure of Market Guide.

Prototype

Next step, I created paper prototypes based on the insights and business strategy. After discussing the design with my team, I created low-fidelity wireframe using Sketch. I used cards to design this application. They help contain the related group of information in order to make the data more digestible. After getting approved from stakeholder, I create high-fidelity prototype.

Home Screen

On the homepage, the user can change the destination by selecting a province in Thailand. Then the page will reload and display recommended markets, shops, restaurants, etc.

There are nine categories: restaurants, points of interest, shops, accommodations, banks, commercial areas, government offices, services, and facilities.

If there is a shop that offers promotions or flash sales, it would be displayed on the homepage.

Search and Filters

The structure of Market Guide is more complicated than a single market guide application. Search and filter became the most important features in this app.

User can search by inputing a keyword then filter by selecting province, market’s name, and category.

Market Guide Search UI
Market Guide Search UI
Market Guide Search UI
Market Guide Search UI

Market and Store Screens

If users tap on a market or a shop thumbnails, it leads them to a detail page. We divided the information into four tabs; shops, contact details, live map, and reviews. On this screen, the user can save the place to favorite or add to their trip.

Save to Favorite

Saved locations will be collected in the favorites menu, grouped by categories. Only five items of each type would be displayed on this page. Users can tap "See All" to see all the places that they saved. When they want to remove an item, they can tap on the heart icon. There is a confirmation modal show up to ask for permission to delete a saved item.

My Trip

Users can use our app to plan their trips by adding and sorting the locations. There are two views on this feature. The users start creating a trip on the list view. We allow them to add up to five days on a trip. They can make a note if they want to. On the map view, the system will display the shortest route connecting to each point. It also shows the user's current location and distance from your spot to each destination.

Market Guide Trip UI
My Trip Screen
Market Guide Trip UI
Create and name new trip
Market Guide Trip UI
Empty state of new trip screen
Market Guide Trip UI
Trip editing screen
Market Guide Trip UI
Add place to trip on list view screen
Market Guide Trip UI
Search and select place
Market Guide Trip UI
View details and add place to trip
Market Guide Trip UI
Map view of the trip

Reflection

It’s kinda suffer for me at the beginning of doing this project. I have been assigned to think of features that are potentially being added to this app as much as possible. As it was tight timeline, the team wanted to jump to the solution. We came up with too many features and couldn’t made up our mind what to do first. At the end, we needed to get back to concider our business goal and learn more about what user needs. After since, we could work with the clear purpose of what we were doing and what we do it for. Having the same goal made us to be on the same page.

Collaboration and communication amoung team memers are very important. Only talking couldn’t help us get the right decision. Choosing the suitable workshop to run helped develop effective solution and push the process forward.

If I had more time, I would do more research for this project. We could learn on what problems that users are facing with the existing guides. This data could lead to better informed design decisions.