Recreating Skyscanner and Airbnb to advance Figma skills

Project background

Overview

I wanted an opportunity to enhance my Figma skills and improve my efficiency. To achieve this, I decided to recreate an existing app, replicating it exactly. This approach allowed me to concentrate solely on mastering Figma without the added complexity of designing or redesigning a new product.

My goal was to become more proficient and faster in areas like component variants, interactive components, auto layout, constraints, responsive design, advanced prototyping, styles, and maintaining an organized Figma file structure.

Have a look at the files to see the progress I’ve made!

Airbnb: https://www.figma.com/design/LS1pJ9q42leCPpUxvx7qpU/Airbnb?node-id=163-5323&t=SYYXdipMjy3taGZt-1

Skyscanner: https://www.figma.com/design/45fS4RaMkFkLgKAnOP8zkp/skyscanner-1?node-id=2-13&t=aOGbwrLlcVACRRxi-1

Prototypes

Click enlarge button on the far right

Clear sections and user flows

Colour palettes

Typography

Previous
Previous

Local grocery delivery platform (prototype)

Next
Next

Borderless