MY ROLE

Product Designer

TEAM

Ankit J. (CEO), Siwen L. (Design Lead), Nirali M. (Business Analyst), Nathan W. (Business Analyst)

TOOLS

Figma, Whimsical, Notion

Took ownership of 2 projects

Pathloom Web App

Designed the Onboarding experience, leading to +3.5% new user registration

Pathloom Mobile App

Redesigned Search modality, leading to search completion rates +3.1%

Onboarding Web App

Problem

Design Goal

Pathloom web app has an extensive feature list, including heavy interactions with maps. Therefore, it’s difficult for users to become familiar with the features quickly on their own.

Create an onboarding experience for new users that help them familiarize with the features quickly and comprehensively. A business goal is included to encourage new user registration.

Step 1: coming up with a core feature flow

I worked closely with the business analyst on this part to discuss core features that need to be included in the onboarding guidance, based on her business analysis and my user journey analysis.

This list we came up with include landing page introduction, comprehensive map exploration, and secondary features like place description and layering. To meet the business object, an end pointer was added to the registration action.

Step 2: exploring instructions formats

Option A

To explore the best format of providing feature explanations, I conducted competitive analysis on tooltip variations, and came up with 3 options.

Final Version

Option B

Option C

Considering the highly distinctness of each feature, I decided to use option B to highlight the location of each feature. Because of the large number of features, I grouped them into larger sections connected by progress dots (from option A).

Step 3: implementing visual styles and design components

I created new tooltips components following an existing design system.

Final Outcome: 12 interactive prototypes shipped

Redesigning Mobile Search

Problem

Design Goal

The Search modality in Pathloom mobile app was designed without UX perspectives. Therefore, there are gaps in user needs and usability evaluations.

Redesign the search modality to fill in user gaps and improve usability.

Step 1: analyzing user gaps

1

Users can only search for places they already know the name of

2

Overwhelming information with low discoverability and high cognitive load

3

User friction occurs when users want to relocate and have to exit the page

Step 2: exploring layouts to improve discoverability and accessibility

Posing open ended questions and allowing flexible location input to allow more freedom and discoverability with destination search

Step 3: implementing the changes in mockups

The search flexibility is highly expanded by allowing users to search with or without criteria attached and get inspired.

The Navigation vs. Search rates increased by 3.1%.

Regrouping of tags increased option discoverability.

Usability increased because users can now select features at anytime instead of having to input in the start.

Usability increased because users can relocate easily on the same page without exiting.

More information about the location is provided by the information card in the bottom.