Heather_Shields

Work

About

Resume

Heather_Shields

Work

About

Resume

Heather_Shields

Alba Air

Alba Air is a bold, youthful revival of Air Scotland, inviting travelers to experience the easiest and most fun way to book popular flights around the UK.

I designed a comprehensive design system and desktop booking application for Alba Air while familiarizing myself with advanced prototyping in Figma using variables and conditionals.

Role

UX/UI Designer

Solo Project

Timeline

August – December 2024

Skills

Design Systems, Prototyping, UI/UX, Interactive Design

Tools

Figma

View Design System

Try the Prototype

Planning the Timetable for Alba Air

Alba Air services the largest respective city in each of the 4 UK constituent countries: London, Cardiff, Belfast, and Glasgow (Alba's home base).

I didn't know much about airline timetables going into this project, but I do now! I was able to create a complete daily schedule for Alba Air's planes to take.

Figma Variables and Conditionals

The Alba Air Design System utilizes Figma variables (colors, booleans, strings, and numbers) for streamlining advanced prototyping.

What would've taken countless frames just a year ago can now be accomplished with very few, thanks to the power of variables.

As a result, Alba Air's desktop booking application prototype is highly interactive and adaptive.

Ensuring Consistency, Collaboration, and Scalability with Plaid

Alba Air's Design System

Plaid is a comprehensive design system supporting all experiences across Alba Air's digital touchpoints. Inspired by Scotland's rich heritage and innovative future, Plaid combines vibrant aesthetics with practical functionality.

Building a UI Component Library

The Alba Air component library contains reusable, modular, scalable elements intended to adapt and grow with Alba Air's digital needs.

From icons and buttons to a fully functional calendar, all components are created with flexibility in mind.

Final Designs

Check out some of the key screens from the final flight booking application with the Plaid design system applied!

V3 feels much better, achieving the warm, trustworthy, playful, nostalgic graphical style paired with a clean, modern, efficient UI design.

The illustration is inspired by the Smoky Mountains at sunrise or sunset when the sky turns orange, and is much more cheerful and friendly, brightening the entire design. Logo and branding are more cohesive than before.

Desktop Web Booking Experience Prototype

Takeaways

Design Systems as a Single Source of Truth Overall, I learned the ins and outs of creating a design system, and gained a solid understanding of how much more efficient they can make the design process.

The Power of Figma Variables
Figma Variables, while still new, are extremely helpful towards efficiently creating scalable, consistent designs quickly.

Next Steps

In the future, I plan to continue expanding Alba Air's digital presence through a mobile ticketing app and watchOS app to create a more seamless boarding experience for users.

This would enable me to further test out my design system to ensure that it is flexible across multiple touchpoints, and see what possible updates might need to be made to it.

View Next Project

Let's build the future, together!

SITE

Work

About

CONTACT

Resume

Thanks for visiting! ʕ•ᴥ•ʔ

Let's build the future, together!

SITE

Work

About

CONTACT

Resume

Thanks for visiting! ʕ•ᴥ•ʔ

Let's build the future, together!

SITE

Work

About

CONTACT

Resume

Thanks for visiting! ʕ•ᴥ•ʔ