Connecting Explorers to Authentic Journeys
Embarking on an Adventure with Hum Travel
Scroll for more
Client
Hum Travel
Time
06/2024
Service
UX/UI Design
Front-end development
Back-end development
Booking engine integration
Discover how Hum Travel crafts an authentic journey that brings travelers closer to the heart of local cultures and the thrill of adventure.
Scroll for more
Meet our adventurers
The Personas
Our journey begins with an understanding of two key explorers—Millennials seeking authentic experiences and Hum Travel, a brand that champions cultural exploration. But how do they truly align to create a partnership for adventures that transcend the ordinary?
Scroll for more
The Millennial Explorer
Alex
Age
27 - 38 seeks
Motivations
Seeks authentic cultural immersion and meaningful experiences
Goals
Explore unique cultures with the guidance of local experts using a visually appealing platform
Pain points
Dislikes standardized tourism and finds it hard to locate authentic yet convenient platforms
The Millennial Explorer
Alex
Age
27 - 38 seeks
Motivations
Seeks authentic cultural immersion and meaningful experiences
Goals
Explore unique cultures with the guidance of local experts using a visually appealing platform
Pain points
Dislikes standardized tourism and finds it hard to locate authentic yet convenient platforms
The Explorer
Hum Travel
ArcheType
Explorer
Values
Freedom, adventure, cultural authenticity
Missions
Explore unique cultures with the guidance of local experts using a visually appealing platform
Goals
Celebrate local beauty with a modern approach, creating adventurous and culturally respectful travel experiences
It’s a Match!
Like a compass pointing true north, the goals of Hum Travel and the aspirations of Millennial Explorers align perfectly. Both seek authenticity, cultural immersion, and transformative experiences.
Together, they embark on a journey to create a travel experience that feels authentic, exciting, and respectful of local cultures.
Discover how Hum Travel crafts an authentic journey that brings travelers closer to the heart of local cultures and the thrill of adventure.
Scroll for more
Shared Vision
Goals Aligned
The alignment between our user and brand personas laid the foundation for our goals. Understanding the motivations of Millennials and the mission of Hum Travel allowed us to craft objectives that serve both parties effectively.
Scroll for more
• Build an immersive platform that communicates adventure.
• Highlight Vietnamese cultures in a modern yet authentic way.
• Facilitate simple, human-centered tour booking.
Goals
Aligned
User
goals
Unique
travel
experience
• Build an immersive platform that communicates adventure.
• Highlight Vietnamese cultures in a modern yet authentic way.
• Facilitate simple, human-centered tour booking.
• Find experiences rich in cultural depth and freedom.
• Use a visually inspiring and intuitive platform.
• Connect with real tour experts during the booking process.
Shared Vision
Goals Aligned
The alignment between our user and brand personas laid the foundation for our goals. Understanding the motivations of Millennials and the mission of Hum Travel allowed us to craft objectives that serve both parties effectively.
Scroll for more
Strategic Approach to Experience Design
Our HMW Framework
The challenge section highlighted the importance of aligning our goals with the intended user experience. From this, we developed a clear framework to bring these elements to life cohesively and compellingly.
Scroll for more
Layout
A Solid 12-Column Foundation
By employing a 12-column grid, we were able to create clear focal points, logical content progression, and balanced whitespace, all of which help direct users' attention naturally from one section to another. The systematic structure of the grid provides an intuitive path, making navigation effortless and enhancing the overall user experience.
Scroll for more
Visual language
A Strategic Use of Colors
Brand colors—purple and blue—are used thoughtfully to create an engaging visual identity.
Purple serves as the primary color, with a lighter tint used for accents, establishing a sense of trust and exploration. Blue acts as a supplemental secondary color, adding depth and balance.
Together, with various tints and shades, they form a cohesive color system that adapts well to both dark and light modes, enhancing the website's flexibility and user experience.
Scroll for more
Iris
#5F27D2
Iris
#5F27D2
Iris
#5F27D2
Sea Serpent
#4DD0EE
100
#D1B3FF
200
#B898FF
300
#A17DFF
400
#8A62FF
500
#7447EE
600
#5F27D2
700
#4C00B6
800
#3B009B
900
#2C0080
1000
#100038
100
#6CEAFF
200
#4DD0EE
300
#29B6D4
400
#009DBA
500
#0084A0
600
#006C88
700
#005470
800
#003E58
900
#002842
1000
#00121D
Visual language
Balancing Boldness and Refinement for an Adventurous Reading Experience
The typography choice features two distinct fonts: Unbound and Bricolage Grotesque.
Unbound, as the name suggests, represents limit-breaking, bold, and strong qualities, adding a striking presence to headlines. In contrast, Bricolage Grotesque offers a more elegant and refined touch, providing balance and sophistication.
Together, these fonts, with their humanist qualities, bring the design to life—creating a balance of readability and adventure.
Scroll for more
Unbound
Headline
Extra Bold, Bold, Semi Bold, Medium
Bricolage Grotesque
Body text
Semi Bold, Regular
Elements
Immersing Users in the Explorer Experience
The website's design elements are strategically chosen to embody the traits of the Explorer archetype.
Ticket-like cards evoke the excitement of embarking on a real journey, while ripple-like circles represent the spirit of adventure spreading outward. Immersive elements, such as images extending beyond their borders, break conventional boundaries, further enhancing the feeling of exploration.
Elements
Immersing Users in the Explorer Experience
The website's design elements are strategically chosen to embody the traits of the Explorer archetype.
Ticket-like cards evoke the excitement of embarking on a real journey, while ripple-like circles represent the spirit of adventure spreading outward. Immersive elements, such as images extending beyond their borders, break conventional boundaries, further enhancing the feeling of exploration.
Together, these elements create an adventurous and engaging atmosphere, making the storytelling dynamic and ensuring users feel like active participants in the journey.
Scroll for more
Elements
Immersing Users in the Explorer Experience
The website's design elements are strategically chosen to embody the traits of the Explorer archetype.
Ticket-like cards evoke the excitement of embarking on a real journey, while ripple-like circles represent the spirit of adventure spreading outward. Immersive elements, such as images extending beyond their borders, break conventional boundaries, further enhancing the feeling of exploration.
Visual Storytelling
From Insights to User Experience
The How Might We (HMW) framework set the foundation for a deep exploration of visual storytelling. By defining the core experiential goals, we translated these strategic insights into detailed UI elements that vividly tell the story. From layout decisions to color and typography choices, every aspect of the design serves to create an immersive journey for the user.
Scroll for more
Awareness Stage
Users land on the Homepage to gain an initial impression of Hum Travel, driven by captivating visuals and value propositions that foster curiosity.
Desire
Stories and testimonials from real travelers are used to build an emotional connection, fostering desire by emphasizing authentic cultural immersion and adventure.
Interest
Key features of Hum Travel and unique destinations are showcased with vibrant images and short descriptions to generate interest and encourage further exploration.
Attention
A full-width, captivating image paired with an inspiring headline immediately grabs the user's attention, evoking curiosity about the experiences that Hum Travel offers.
Interest
Key features of Hum Travel and unique destinations are showcased with vibrant images and short descriptions to generate interest and encourage further exploration.
Desire
Stories and testimonials from real travelers are used to build an emotional connection, fostering desire by emphasizing authentic cultural immersion and adventure.
Consideration Stage
Users explore the About Page and Tour List Page to evaluate credibility, with testimonials enhancing trust and showcasing the uniqueness of the tours.
Decision & Booking Stage
The Tour Details Page provides specifics on itinerary and pricing, supported by FAQs to address user concerns, guiding users smoothly towards a decision. Once a tour is selected, users proceed seamlessly to the Booking Page to finalize their purchase, using secure payment gateways and receiving clear confirmations to ensure confidence in the booking process.