Welcome on board!

Appy2Help is an app that enables KLM / Air France staff help the passengers at the airport and now allows them to digitally board a flight.




Timeline
2019 - 6 weeks

Client
KLM / Air France

Methods & Tools
Documents review, shadowing, contextual inquiries, interviews, usability testing, Overflow, Sketch, Invision, iMovie, Jira, Confluence


Team
Product Owner, Information Analyst, Business Analyst, 2 Developers, tester

My role
Scope, Concept development, User research, UX design, UX writing, UI design, Usability testing, Documentation



Challenge

In 2019, KLM decided to digitize the boarding pass scan, to become independant from the airport boarding devices and have more flexibility.
My goal was to enable to board passengers on the aircraft via an iPad app.

Business goals & requirements

  • Transition from the physical to the digital scan
  • Have a successful boarding rate (>90%)
  • Follow the security procedures
  • Maintain the on-time performance




  • The process





    Research

    Objectives

    To design the feature, I had to to get familiar with the process.
    Please note that I'll share here only generic or non-confidential insights.

    Shadowing & contextual inquiries

    For an overview of gate agents’ responsibilities and actions, I read the boarding manual, that explains the tasks and their time frame.
    Then I went to see the gate agents in their natural working environment.




    User interviews

    After witnessing the process, I organized a round of interviews to dig deeper into it.



    Job to be done


    When boarding a flight, I need to compare the personal information on a boarding pass with the one in the booking system, so that I can board the right passengers






    Ideation

    Requirements

    By analyzing the insights, I acknowledged the feature should:
    • Display reliable and clear information for passenger identification
    • Give clear feedback on the success or failure of the scan
    • Use the security number as a backup, in case the scan doesn't work
    • Avoid slowing down the boarding process

    • User flow & team discussion

      I created a user flow, discussed it with the product owner and the business analyst, and identified the possible boarding errors, together with the information analyst.


      Scroll/swipe left to see the images, click to zoom
      User flow
      Wireframes
      Wire flow



      Towards the mvp

      Usability tests

      Before the final design, I tested the wireframes with the agents.


      With the developers, we increased the scan area to maximize its success.
      I modified the visual feedback of the error, as an alert message had to be displayed.



      Final design

      The app features a scan for boarding passes, displaying all the compulsory information needed by the agents. It also offers to board passengers via the security number, in case the scan fails.

      Features


      Success screen
      The successful boarding is confirmed by visual and audio feedback. The information about the passenger is clearly displayed in order to proceed with the verifications.

      Error screen
      The failed boarding is also confirmed by visual and audio feedback. If possible, the reason is displayed in the alert and suggestions for further actions are given to the agent.


      Boarding via security number
      If the scan fails, it's still possible to board by using the security number displayed on the boarding pass.


      Boarding via passenger profile
      Being able to board via the passenger profile enables the agents to serve the passengers more efficiently.







      Field usability testing

      Once the feature developed and shipped to our beta users, I did a usability testing, together with my product team.
      The agents were instructed to board the passengers excusively via the app.

      Deactivating the boarding pillars // Testing the digital boarding with the product team





      Iterations

      Together with the developer we shortened the transition time between two scans and removed a step when entering the security number.
      Meanwhile, a collegue from the boarding API came up with a 3D-printed prototype of an iPad holder with a scan area, on which I added the app logo.

      The iPad holder with the scan area



      Outcome

      The field testing being satisfactory, we deployed the boarding via Appy2Help to all the agents in Amsterdam and the international airports. The functionality was adopted by 74,6% of the ground staff, with a scan success rate of 94,7%.
      Because of this success the company decided to digitize the whole boarding operations.



      In the second phase of the project, the agents I interviewed shared their satisfaction with the design improvements. In particular, they considered the sound a clearly audible feedback, offering them more control over the process.






      πŸ‘ˆ Previous

      Wellcom

      Next πŸ‘‰

      Design sprint