ecomm-portal-thumbnail

E-commerce experience in the sky, facilitator of innovative passenger moments. 
  

The Opportunity

The overarching vision is to create and sell experiences around airline passenger travel. My assignment was to initiate this vision by designing a user-friendly e-commerce platform that seamlessly functions both on the ground and in-flight (IFE). Leveraging the captive audience during flights, our client, an UK-based business conglomerate, wanted to create personalised experiences across their various business offerings like flights, resorts, trains, cabs, etc.
This strategic approach positions the airline as more than just a travel company into a facilitator of innovative passenger moments. Resulting in enhanced brand’s image, customer loyalty, & unlock additional revenue opportunities.

Problem Space

The current e-commerce platform, technologically outdated, hence cannot facilitate even seamless mobile access.
These difficulties makes expanding the experience to In-flight Entertainment (IFE) impossible.
Despite numerous offering possibilities, this leads to decline in customer satisfaction due to reasons like underutilisation of loyalty points.

My Role

Lead the product design
supported by an UX designer.

Collaboration

Product Owner, Business Analysts, Enterprise Architect, Brand team, QA team, Developers and Cabin Crew.

Responsibilities

Discovery
Scope Definition
Research & Insights
Design Execution - User Experience including UI
Integration experience through iOS Crew apps
In-flight IFE experience
Pre & Post Release evaluation (IFE Testing in actual Flight)

 

Impact

impact

Design Process

We embraced the Dual Track Agile process, in retrofitting user-centered design principles into agile framework. We used "Scrumban" approach, Kanban for Design, Scrum for Delivery. This helped in creating a perfect balance between the creative, iterative nature of design and the structured, time-boxed delivery of features. To achieve this we had two parallel tracks as illustrated below.

dualtrack

Setting the Project Vision: Sprint Zero

This initial phase was pivotal in defining our project's vision and setting the stage for success.

Stakeholder mapping to navigate complexity
Our initial conversations with product owner revealed a web of dependencies across various departments, each with unique and sometimes conflicting interests. To tackle this complexity, we developed a comprehensive stakeholder map, detailing Stakeholder identities with departments, Individual motivations, challenges and project-related dependencies
This mapping exercise, informed by in-depth discussions, highlighted the critical need for building consensus among key stakeholders to prevent future rework and ensure smooth project progression.

Secondary Research
Following the stakeholder mapping, we sought to deepen our understanding before engaging key stakeholders, thereby narrowing the focus areas for the vision workshop. The design team conducted comprehensive secondary research, considering the following documents to gather insights specific to an airline's e-commerce portal accessed both on-ground and in-flight:
  • Analytics Data: Analysis of the current e-commerce website's performance.
  • User Feedback and Surveys: Collection of feedback and survey data on in-flight product sales to understand user preferences and pain points.
  • Customer Support Logs and Complaints: Review of logs and complaints to identify recurring issues post-purchase.
  • In-Flight User Behaviour Studies: Exploration of studies on user behavior during flights.
  • Technical Specifications for In-Flight Systems: Understanding constraints and capabilities of in-flight entertainment systems.
  • Airlines' Brand Guidelines: Ensuring design alignment with brand identity.
  • Regulatory Documents: Compliance with e-commerce regulations in the airline industry.
  • Cultural Considerations: Research on cultural preferences influencing design for a diverse passenger base.
Collaboration and Dependency Analysis
We performed a collaboration and dependency analysis to identify cross-functional requirements and align stakeholders. Throughout discovery sprints, we maintained flexibility to re-engage with key departments. The teams we collaborated are:
  • Product Management and Digital Marketing
  • Technology and IT Department
  • Supply Chain & Logistics
  • Customer Service
Vision Workshop: Bringing Stakeholders Together
Conducted an interactive vision workshop. This brought together relevant department stakeholders, as well as engineering and design team members. We utilized Mentimeter to facilitate engaging.  Some of the key themes focused in the workshop include: 
  • Stakeholder Alignment and Consensus Building
  • Omnichannel Experience
  • Integration with In-Flight Systems
  • Retail Partnerships and Ancillary Services
  • Personalization and Customer Engagement

Roadmap

The workshop's outcomes yielded a structured roadmap that guided our overall efforts.

Roadmap

End User Interviews

To build resonance with our users in addition to our above discovery activities, we conducted interviews with our target audience was conducted strategically and iteratively throughout the project as described below:

End user interviews

Research Findings

Given below are the identified key themes with the summary of our research learnings.

Research-Findings-ecomm

Research to Action

Research findings formed the basis for creating detailed backlogs. Each sprint saw the product owner and business analyst prioritise capabilities for exploration and prototyping in the Design track, while user stories were prepared for development in the Delivery track.
Our design process was adaptable, guided by the below flow that could be tailored to each sprint's needs, enabling us to incorporate new insights and pivot as necessary.

Resaerch to action new

User Testing - Validating Our Hypothesis

For each sprint, we created low-fidelity prototypes using Balsamiq, occasionally supplementing with hand sketches and white boarding sessions. These prototypes enabled collaborative design discussions with stakeholders from Product Management, Marketing, and Technology. After usability testing, we iterated on the designs based on feedback, focusing on the below key areas for improvement.

usability-findings

High Fidelity Design

Home Page

home page_xl

Information Architectre

master-navigation-3

Search Results

search-flow

Offers Page

offers-home-page

Product Detail page

product-detail-page

Shopping Basket

shopping-basket-1

Gifting Options

gifting-screens

Checkout Flow

The checkout module is the most complex component of this project due to its need to accommodate multiple delivery options, including current flight, future flight, and home delivery. Consequently, we must collect various types of delivery information, such as flight details and address particulars, depending on the chosen delivery method. This complexity requires careful design and implementation to ensure a seamless user experience across all delivery scenarios.

checkout-flow

Click above image to view enlarged version of the check out flow.

Payment Module

payments

States & Edge Cases

states-edge_cases

Order Confirmation Emailer

order-confirmation-email2x

In-Flight Usability Testing

Our testing took place on a specially arranged flight, providing an authentic setting to evaluate the portal's performance. This is essential to validate both the design and engineering aspects of the portal before its first release to passengers. We engaged diverse participants, which included flight stewardesses, employees from business and other departments, providing a range of perspectives. The primary objectives of the in-flight testing are:

Assess user experience in the unique context of an in-flight environment.
Identify Engineering Issues related to connectivity, performance, and integration with in-flight systems.
Gather Real-Time Feedback from test participants to inform final design adjustments.

inflight usability testing

Challenges & Learnings

The client utilized design system from another business partner airline. Due to a strategic agreement change, the design system was revamped as we are busy progressing with our sprints. Though Figma components helped us to some extent, aligning with the new branding required quick adjustments to meet deadlines.

Customer wanted to showcase the IFE experience, to reviewers and press on their new A350 flight. Unlike existing IFEs used for testing, the IFE in new airline had more advanced interaction features and bigger screen real estate. Hence last-minute adjustments were needed to run the portal without any UX glitches.

The batch processing of data between cloud and inflight server should happen post each flight. Initially this was considered as engineering challenge, however during the project course, decision was made to address this via an app designed for crew’s iPad. This demanded additional efforts and time requirements. This app facilitated bidirectional e-commerce and Food & drinks transaction data transfers between cloud and in-flight server pre and post a trip.

Due to the aforementioned data challenge, a low-volume ordering system was introduced on IFE for passenger purchases, with complimentary delivery to business class passengers. To facilitate this we designed an iPad experience for seamless order delivery and inventory management.

Changes in key project roles, including the Product Owner and Business Analyst, led to shifting expectations and priorities during the course of the project. To keep the project on schedule, the sudden departure of the business analyst necessitated designers transferring high-level requirements from product owner to dev and quality assurance through one full sprint .

Staying two sprints ahead in Kanban ensured smooth agile development.

Designing experiences beyond usual touch points, into systems like the In-Flight Entertainment (IFE) system,  is a huge learning, considering the unique opportunities that environment presents.