top of page

Ryanair Redesign

GOAL

The primary objective of this project is to enhance ui skills rapidly, unhindered by user research constraints. with existing app content and users in place, the focus is directed toward refining information architecture and visual skills, utilizing all available time and energy effectively

MY ROLE

UX Design: Heuristic Analysis

UI Design: Wireframing, UI elements

DURATION

2 days

Ryanair Header Image

DISCOVER

BACKGROUND

This project entails two primary tasks for the visual redesign. Firstly, the existing screens will be reproduced, as every redesign, regardless of its scale, commences with an audit of the current design. Secondly, the app's look and feel will undergo a redesign, with the extent of this transformation left to the discretion of the designer. In this case the app's redesign is updating current components and redesigning entire screens without redefining the brand's identity. The chosen app for this redesign project must be a well-known native mobile app, either for iOS or Android. A minimum of three screens must be redesigned, with a maximum limit of seven screens. While additional screens may be redesigned, there is no requirement to conduct any UX research as part of this project.

For this project, the airline app from Ryanair was used. For those unfamiliar with the app, its main features revolve around searching for and booking flights, along with managing a personal account to store flight tickets.

CONCEPTUALIZATION

PROBLEM DEFINITION

The current state of the app is quite overloaded with text and information, lacks consistent usage of UI design, and is therefore particularly suitable for a redesign and has potential for improvement.

Ryanair Current Booking Process

SOLUTION DESIGN

DESIGN SPRINT

tools: figjam, heuristic analysis, competitor analysis

Before diving into the redesign process, a comprehensive overview of the app’s issues was sought. The application of Nielsen’s 10 Usability Heuristics for User Interface Design eased the indication of primary UI challenges faced by Ryanair.

Ryanair Heuristics

The app notably lacks consistency and adherence to UI standards, evident upon applying some of the heuristics as you can see below:

 

Visibility of system status

  • The absence of a progress bar leads to uncertainty regarding the number of steps in the booking process

 

User control and freedom

  • Inconsistent use of arrows and close buttons for similar actions complicates user navigation and control comprehension

  • The option to delete a ticket within the price compilation is not immediately apparent, instead, the user needs to discover how to use this feature

 

Consistency and standards

  • Inconsistencies in button design and font styles persist

  • Varied arrow directions and icon usage cause confusion

  • Different visual elements for option selection, information presentation, and warning colors contribute to inconsistency

  • Diverse icon designs further worsen the lack of standardization

 

Error prevention

  • Lack of error prevention measures, only presenting error message after users complete a step, thereby highlighting missing inputs

 

Aesthetic and minimalist design

  • Cluttered screens with lots of irrelevant information text that the user has to go through to find relevant units

 

Consequently, attention was directed towards enhancing these critical aspects during the app’s redesign, particularly within the flight booking process. Specifically, the booking process lacks a progress bar, hindering users from tracking completed and pending steps. Inconsistencies in button shapes and typography usage, as already mentioned, further detract from user experience. Additionally, redundant information placement contributes to a cluttered and occasionally confusing interface.

 

Following an in-depth assessment of the Ryanair app, a competitor analysis was conducted, evaluating easyJet, Eurowings, Lufthansa, and opodo against usability heuristics. Insights gathered from competitors’ approaches, especially in UI elements utilization, information consistency, and aesthetic appeal, inspired elements of the redesign process to ensure a more user-friendly experience.

Ryanair Competitor Heuristics

WIREFRAMES

tools: figma

Staying true to the essence of Ryanair’s brand identity, strict adherence to their designated branding colors and typography was maintained, focusing on enhancing the application’s clarity and hierarchy. In terms of color, a delicate calibration of the saturation of functional colors was conducted to achieve a balanced and visually appealing design. This thorough approach contributes to a more cohesive visual user experience.

Ryanair Stile Tile

To simplify the user journey during the booking process, a progress bar was implemented to ensure that the user is provided with a transparent overview of the current step in the booking sequence and the remaining steps. By consistently adapting buttons, footer elements, and text information, clear visual communication was ensured and a consistent design was maintained. The refinements were based on the screenshots of the actual booking process of RyanAir and blended seamlessly into the existing interface.

 

To improve and optimize the cluttering information screens, a card-based carrousel was implemented, which shows different ticket options or extras that can be purchased for your flight. Swiping horizontally instead of scrolling through a huge amount of information text, enhances an intuitive and user-friendly interaction approach.

Through thorough heuristic analysis competitor comparison and a user-centered design approach the booking process of Ryanair has been successfully redesigned. The new screens all aim to elevate the overall user experience, seamlessly blending the brand identity with improved legibility, visual consistency, and a smooth user flow.

So Ryanair, if you're reading this: feel free to reach out!

bottom of page