OKCompass is a travel organizing startup. This company organizes tours in various countries across Asia and Europe.
UX Researcher and Designer
I worked on this independent project where I was solely responsible for UX research and design. I performed heuristic evaluations of the existing design to evaluate its usability, designed surveys, developed low fidelity prototypes on Pop and high-fidelity interactive prototypes using Sketch and InVision. I designed the UI by following Gestalt Principles.
1. Requirement Gathering
To understand user needs and pain points, validate and/or discard assumptions about the product, and use quantitative + qualitative data to get insights on user behavior.
a. Stakeholder Interview
Understood the requirements from stakeholders, scope of the website, their travel philosophy and the target audience they wanted to cater to.
I designed surveys to gather quantitative data about user needs and current behavior. The survey was sent to 50 respondents in the United States of America, India and United Kingdom. I analyzed the responses to understand our target audience in terms of important factors one considers while planning a trip.
Interviewees discussed how they organized their travels, what aspects of travel planning they like and don't like. This led to collection of valuable qualitative data.
This phase was essential in gathering quantitative and qualitative data in order to understand the needs of the user as well as the stakeholders.
2. Design Alternative/Competitive Analysis
To ideate the creation of a useful and usable product by understanding the user's explicit and implicit needs.
I used findings from the requirement gathering to brainstorm and come up with a novel solution that meets the user needs.
b. Competitive Analysis
I performed competitive analysis on other travel organizing websites like Abercrombie and Kent, Busabout, Priceline and Booking. The products were evaluated on usability, market reach and type of travel offered.
Based on the analysis, I decided to segregate travel destinations based on travel type (adventure, cultural, luxury, etc) and emphasize the selling point of the company as helping individuals explore a place through the eyes of the locals. Recommended restaurants, hidden gems and local festivals were included in the website.
To translate ideas to physical models in order to evaluate their strengths, and most importantly weaknesses to create a usable product by using a iterative process.
a. Low Fidelity Prototype
I created low fidelity prototypes on paper and converted them into interactive prototypes using POP by Marvel. I ran usability tests on 5 customers to assess the usability of the suggested design and made changes based on the feedback received from users.
b. High Fidelity Prototype
I created high fidelity prototypes using Sketch and Invision. I tested the product on my friends and incorporated their feedback to create Version 1 of the High Fidelity Designs which is shown below:
Version 1 of the High Fidelity Prototype was showcased to the stakeholder. Taking their feedback into consideration, a few changes were made to the design - e.g. changing the background color from black to white. Version 2 of the High Fidelity Prototype was as shown below:
4. Product Evaluation
To assess the product based on learnability, efficiency, memorability, errors and user satisfaction.
a. Usability Testing
I performed a final round of usability testing with 5 users who were representative of the target audience. No failures were encountered, however the users encountered a total of 3 errors. These errors were fixed.
b. A/B Testing
I performed A/B Testing with the two versions of the high fidelity prototypes (i.black background and ii. white background) on approximately 5-6 users. Majority of the users favored the second version of the design with white background.
Some of the comments received from the users were:
" Black looks really dull."
"This background(white) makes the website look fresh as compared to the previous version(black). "
"I love the black background. Reminds me of Spotify."
b. Heuristic Evaluation
I performed Heuristic Evaluation based on Nielsen-Molich Principles. The following enhancements were made in the design.
● Consistency: Maintaining the same size and placement of images and icons
● Aesthetic and minimalist design: Keeping the design simple by avoiding too many colors.
● Visibility of system status: Keeping users informed about what is going on, through appropriate feedback within reasonable time.
A/B Testing helped choose the version of the design with the white background. This was in agreement with the stakeholder's opinion. Heuristic evaluation helped us identify lack of homogeneity in the UI and gave us the opportunity to optimize the visual structure of the app. A total of 3 unique issues were identified in this process and were immediately fixed.