Solar_Opener_B_1000x1600@2x.png

Solar

Working with a core design team to iterate, innovate, and reimagine Agoda’s mobile product and user experience.

DESIGN LEAD, UX, PRODUCT STRATEGY

Solar-Opener_2000x1124 copy@2x.png

ABOUT

A group of six designers was given the task to reimagine what the future of Agoda’s mobile app could be. The project was purely exploratory, but structured with the intention to scale any findings that could increase brand recognition with the viability of actually being incorporated into the product. We embarked on a four week journey in a project internally known as Solar, and came up with three radical directions and a world of possibilities to enhance the travel experience.

 
Solar-Pullquote_2000x900@2x.png
 
 

Process

Working within limited timelines has substantial effects in tangible results. With design sprints set in place and frequent check ins, we were able to establish three unique approaches when redesigning our product: near, mid, and long-term. Each of these also corresponded to the degree of closeness to the current existing product, with Earth being as close to the product as it was, Mars representing a mid-deviation from the existing product, and Jupiter being the furthest possible relation to the mobile app. To begin, we assessed multiple references into the current state of product.

Chart showing least to most desirable qualities as corresponding to level of importance for an integral user experience  (representative of internal survey) .

Chart showing least to most desirable qualities as corresponding to level of importance for an integral user experience (representative of internal survey).

 

1st Approach: Earth

The first team focused on a clean design, with a receding UI that enhanced useful information for the user, while prominently portraying depictions of property options. This direction most closely retained existing Agoda brand elements, typography, and content (messaging, ratings, etc).

Redefining MVP

Product Consistency

Product screens depicting different steps of the booking experience.

Product screens depicting different steps of the booking experience.

 

2nd Approach: Mars

Loading results, search box, and bottom nav.

Loading results, search box, and bottom nav.

Infusing Brand Elements Through Microanimations

solar-mars-microinteractions.gif

The second team, Mars, focused on enhancing user interactivity as reinforced through microanimations. One challenging component of designing for the Agoda brand in a mobile context, was to resolve brand presence (the five dots) with a clean, aesthetically user-friendly UI. These animations, transitions, and subtle affirmations of user actions yielded results which were implemented into the mobile product upon the conclusion of this experiment.

 

3rd Approach: Jupiter

The third and final direction in the experiment consisted in providing the most immersive, linear discovery experience for the user. It incorporated video, a card-based system, and a nature inspired color palette to switch an often stressful UX to more of a discovery experience as led by the following tenets.

Define basic principles to enhance the travel experience in subtle ways.

Product Tenets / KPIs

Solar_Jupiter_KPI_2000x1124 copy@2x.png
 

Visual research, color palette derived from natural hues.

Solar_Jupiter_Basis_2000x800@2x.png
 
Mobile Demo Gif 792 x 1080_2.gif
 

Immersive Experience From Landing

By incorporating dynamic elements from the first screen, the user engages in a more immersive and discovery-driven experience representative of physical travel.

 

Product Demo

Product Funnel

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis gravida urna a arcu eleifend mollis. Aenean nisl nibh, lobortis sit amet vestibulum in, blandit id ex. Aliquam id diam at sem feugiat elementum non vitae tellus. Aenean iaculis metus mattis lacus gravida dictum sit amet sed ante. Sed sit amet arcu eget mi pretium viverra. Sed rhoncus congue massa, a feugiat velit efficitur ut. Mauris imperdiet risus augue, ut imperdiet leo tincidunt eget. Mauris luctus id leo ac ullamcorper. Nulla id.

The approach made use of existing brand elements by pushing them as much as possible within a usable user interface. An expandable card based system also allowed for a linear exploration of accommodation options.

 

Credits: Ali Lee, UX / Siwat Vatatiyaporn, Designer / Nanmulti, Animation / Lynn Chen, Animation / Tintin, Designer / Haeji An, UI / Fendy Ibrahim, UX / Muhhamad Athar, Creative Technologist

 

RELATED

Lulu

Design Systems

Agoda