Travel website concept · 2024

Wayfarer Travel

Wayfarer Travel

Wayfarer was my final project in Designlab’s UX Foundations course, focused on designing a responsive homepage and multi-step form for a travel brand. I strengthened my UI fundamentals while applying UX best practices to create a clear, cohesive experience, developed iteratively over the course duration.

Skills

Skills

UI design · Responsive design · Interaction design · Visual hierarchy · Wireframing

Role

Role

UI/UX Designer (Solo)

Tools

Tools

Figma

Figma

Timeline

Timeline

3 months

3 months

The design brief

The design brief

01

01

The Challenge

The Challenge

Given a design brief for a travel brand, the challenge was to design a responsive homepage and multi-step form that balanced aspirational branding with clarity and usability across devices.

The Wayfarer Vision:

Charting New Horizons in Travel Exploration

The Wayfarer vision is to redefine travel by making it deeply personal, authentic, and connected. Through AI-powered insights, Wayfarer encourages users to venture beyond tourist paths and immerse themselves in local cultures.

The Wayfarer Vision: Charting New

Horizons in

Travel Exploration

The Wayfarer vision is to redefine travel by making it deeply personal, authentic, and connected. Through AI-powered insights, Wayfarer encourages users to venture beyond tourist paths and immerse themselves in local cultures.

Style guide

Style guide

02

02

Adventurous, personal & wanderlust-driven

Adventurous, personal & wanderlust-driven

To reinforce Wayfarer’s adventurous and personal brand, I developed a style guide that captures warmth, trust, and excitement.

To reinforce Wayfarer’s adventurous and personal brand, I developed a style guide that captures warmth, trust, and excitement.

primary

primary

adventure

orange

#D95D39

#D95D39

secondary

secondary

turquoise

horizon

#247BA0

#247BA0

secondary

secondary

meadow

green

#A3C36B

#A3C36B

neutral

neutral

charcoal

mist

charcoal

mist

#2E3D49

#2E3D49

neutral

neutral

desert

sand

#D6C6B5

#D6C6B5

neutral

neutral

dune

white

#D95D39

#D95D39

Raleway

Raleway

A modern and sophisticated typeface for strong visual hierarchy.

A modern and sophisticated typeface for strong visual hierarchy.

Header Text

Header Text

56px

56px

42px

42px

36px

36px

30px

30px

26px

26px

Inter

Inter

Ensures clarity and seamless readability across devices.

Ensures clarity and seamless readability across devices.

Body Text

Body Text

22px

22px

22px

22px

16px

16px

14px

14px

The process

The process

03

03

UI Process Documentation

UI Process Documentation

UI Process Documentation

As part of my formal assignment deliverable, I documented the full UI process — from feedback to iteration. Download the submission file to see how each version evolved.

As part of my formal assignment deliverable, I documented the full UI process — from feedback to iteration. Download the submission file to see how each version evolved.

View Submission

Final design

Final design

04

04

A never-ending wanderlust for adventure

A never-ending wanderlust for adventure

Inspired by the essence of travel caravans as a symbol of freedom, the final design encapsulates wanderlust in motion—tailored for explorers seeking meaningful experiences.

Inspired by the essence of travel caravans as a symbol of freedom, the final design encapsulates wanderlust in motion—tailored for explorers seeking meaningful experiences.

Takeaways

Deepened UI Craft

Strengthened my use of grids, color systems, and typography best practices to design layouts that feel both aesthetic and functional.

Systematic in Figma

Learned to design with consistency by using components, spacing rules, and reusable patterns.

Introduced to UX Best Practices

Applied fundamentals such as sizing for accessibility, clear search/input design, and icon readability.

@

Let’s work together

Made in Framer by Natasha Ow

(@2025)

@

Let’s work together

Made in Framer by Natasha Ow

(@2025)

@

Let’s work together

Made in Framer

by Natasha Ow

(@2025)