Singapore Changi Airport

iShopChangi eCommerce UX Revamp

01 The Brief

Singapore Changi Airport has a website that allows passengers to buy duty-free items and collecting them before their flights, saving them time and giving them the convenience to have fuss-free shopping. Yet with such a strong selling point, passengers don’t use it often as they aren’t sure of the buying and collection process as well as what is available.

I was tasked by JWT Singapore to develop the UX to modernize their website and develop new features to enhance the passenger’s experience.

Client Name
Singapore Changi Airport
Type
eCommerce UX Revamp
Platform
Desktop and Mobile

02 The Issues

A Taxonomy

The taxonomy of the old website was confusing and didn’t have many options for users to filter their options, hence a new structure had to be developed to address this. We had to also enhance product discovery to help increase basket size.

B New User

New users aren’t familiar with the site and the functionalities and had to be given some immediate assistance.

C Gift Searching

Gifts are a big portion of purchases and the client wanted an easy way for passengers to search for what they want

D Purchase Flow

The purchasing flow was long and confusing, especially on mobile phones. One of the reasons for a longer purchase flow was due to the fact that there are 4 different terminals in the airport and the products available are dependent on whether the user is arriving or departing at which specific terminal.

E Brands and Promos

A balance had to be achieved to give brands the opportunities to showcase their promotions

03 The Research

User journey was developed to show how a typical passenger would use the website

User Journey Analysis

We analyse the user journey to understand how the users work on the site.

The approach and involvement

In addition to helping develop 26 different templates for Desktop and Mobile with multiple states, I also help to consult with the client on their feedback and manage their expectations during our weekly meetings.

This project took 2 months to complete.

A) Fixing the Taxonomy

We had to readdress the categories and develop something more logical. We also had to ensure that there are many available paths to product discovery to help users find what they are looking for and more.

Revising the Sitemap

The products were recategorized into clearer sections to help users locate items quicker. The arrangement of the categories were placed such that more popular categories were first on the navigation bar

 

Product discovery

The original website employed rows of products with different categories, pre-defined by Singapore Changi Airport staff according to different festivals and promotions. This was to be enhanced to allow for social elements as well as flash deals to help push more potential entry to sales.

1) Search

This is the main area for users and they can see trending searches to help them see what is popular on the site.

2) Revised Navigation

Allow for easy access to different categories, in three different browsing habits:

  1. By product categories for users who are sure what they are shopping for, such as perfumes
  2. By product promotion type, for the bargain hunters, the high-end shoppers and those who just wants to see what’s new
  3. By brand for users who know what they want.

3) Flash Deals

Flash deals were placed further up on the page with a timing to remind users of the deals they are potentially missing out on. User’s flight settings had to be taken into account to ensure that users will be able to

4) Selecting Gifts

Users can select what kind of products that they want to look at, defined by three different categories. Men, Woman and Child.

5) Curated Gifts

A widget was developed to showcase gifts that users can explore.

B) User Education

A row of 3 simple explanation of what they can do on the website. This appears when the user first land on the website on a new device, immediately explaining what they can do on the website.

For New Users
  1. A row of 4 simple reminder of functionalities on the website. This will always be there regardless of whether the person is new.
  2. These 4 steps quickly educates users on what they can do on the website. These appears only for new users who land on the website for the first time.

C) Purchasing Flow

The original purchase process was a single form that had hidden secondary steps that often interrupted the user’s purchase flow, leading to a 40% drop off rate. An approach with a clear path to purchase, as well as paginated check out process was introduced to solve this issue.

D) Promotions

Brands want their promotions to be shown and different promotions appear depending on the product that users select. A prominent yet relatively unassuming area had to be selected in order to:

  • Not take up too much real estate
  • Look too much like an advertisement that can affect the experience of the user
1) Homepage

On the homepage, a small banner above the main hero banner will remind users of a site-wide promotion.

2) Shopping Cart

On the shopping cart page, users will also be reminded of a promotion as they check on their orders. This helps to subtly remind users that they can enjoy a promotion if they reach a certain order amount.

E) Wishlists

Often, users will have friends who want them to buy items for them when travelling. A wishlist feature was developed to ensure that users can ask their friends to tell them what they want or add to wishlist for future purchases on future trips.

1) Types of Wishlists

Users can add to their wishlist from anywhere on the site, which goes into a main wishlist. They can also create shared wishlists as well as see what wishlists has been shared with them.

2) Managing Wishlists

Users can rename their wishlists, delete them or share them with their friends.

3) Individual Item Management

Users can add all items to their chart in a single button. If an item is checked, the buttons change to 4 different options:

  1. Clear all selection
  2. Move items to different wishlists
  3. Delete item
  4. Add item to their cart

Concluding Thoughts

It was a fantastic experience developing an eCommerce website. Beside working on just the wireframes, engaging with the client and managing to successfully sell through the approach was satisfying and most enjoyable. Throughout the process, I learned a few things:

  1. There is a balance to be achieved between the ideal best practice vs what the business requires. One of the pain points I had was how the site seems to push too much up-selling but it was a necessary evil for an eCommerce website.
  2. States, States, States. As an eCommerce website, I had to develop multiple variations to cover all possibilities when users interact with the site.
  3. Mobile was important as the website had a relatively low number of mobile conversions (24% vs 71% on desktop). This was a distinct opportunity that was mentioned throughout the project.