Madeira Travl

Of 1,000 U.S. individuals who traveled for leisure at least once in the past 12 months, 70% plan to book a guided tour for the next year, according to the survey. Roughly two in five Millennial and Gen Z travelers surveyed had booked a guided tour in the past year.

The problem

As interest in guided tours grows, the number of available options can overwhelm users. Where is the sweet spot between effective promotion that drives conversions and a user-friendly experience?

[ COMPETITIVE AUDIT ]

Encouraging users to book in the tourism industry

I analyzed three websites, examining both the trip booking process and how visuals are used to guide and inspire users toward conversion. The companies I audited were Travel Shift, Land of Ride, and Adventure Kingdom.

01.

Travelshift

01.

Travelshift

01.

Travelshift

02.

Land of Ride

02.

Land of Ride

02.

Land of Ride

03.

Adventure Kingdom

03.

Adventure Kingdom

03.

Adventure Kingdom

[ USER SURVEY ]

The most influential factors in buying guided trips

I conducted a quick survey among frequent travelers to find out what the most influential factors are for investing in guided trips.

Respondents paid the most attention to price, but another important factor was a clear trip plan. People like to know what to expect, and that also stands out from other responses

What is the most influential factor for you to decide on buying guided trip?

26 Participants

Accessibility Evaluation

Summary

[ PERSONAS ]

Who decides to go on organized travel trips?

Based on previous research, I created two personas for this project: Solo Travelers and Family Explorers. It's important to realize that even though both of these groups are looking for different things while booking travel, what they have in common is seeing the value in connecting with another human being.

Solo Travelers 🙋‍♀️

According to a new survey by tour operator Overseas Adventure Travel and Solo Traveler, 68% of participants identified themselves as independent travelers. This data shows the growing popularity of traveling solo.

The challenge for this group involves integrating and establishing connections as solo travelers within a larger group. That may be one of the reasons they look for organized trips—to meet new people and form connections. They may decide to travel alone but don't want to feel lonely.

Family Explorers 🧑‍🧑‍🧒‍🧒

Family travel makes up 30% of global outbound tourism trips. The parents of nowadays families enjoy planning vacations. Travel review sites and friends/family are the most influencial factors while booking and planning travels.

95% of participants said their priority is to make their families entertained and happy. Children seem to be emerging source of inspiration for family travel since 2022. Spending quality time together is listed as the number one benefit as travelling with loved ones.

Solo Travelers 🙋‍♀️

Family Explorers 🧑‍🧑‍🧒‍🧒

Family travel makes up 30% of global outbound tourism trips. Parents of today’s families enjoy planning vacations. Travel review sites and friends/family are the most influential factors when booking and planning trips.

95% of participants said their priority is to keep their families entertained and happy. Children seem to be an emerging source of inspiration for family travel since 2022. Spending quality time together is listed as the number one benefit of traveling with loved ones.

[ WIREFRAMES ]

The design begins

Once I broadened my knowledge through research, I started designing the first screens. The first step of the design process was creating low-fidelity wireframes of the landing page for both mobile and desktop resolutions. My aim was to focus on narrating the value proposition, inspiring users, and keeping them informed with details of the offer. I also wanted to create a flawless travel booking flow, which is the final step of a perfect user journey.

[ UI DESIGN ]

Jungle and adventure, just by looking at the screen

Once the initial wireframes were complete, I began creating a couple of the main high-fidelity screens for the website. I started by defining the fonts and colors.

When creating this visual identity, I was inspired by natural colors that evoke summer and adventure. I decided to make my main call to action a bright orange color so it stands out from the design and draws the viewer's eye. To make the overall design more colorful, I added a complementary color in green shades, which was used as an accent color for some visual elements.

While choosing a font, I wanted it to be playful, adventurous, yet readable. I chose Ivy Presto Display for bold headers and Ivy Presto Text for the body copy.

One of the most important parts of this interface design was visual content such as photographs and videos. As the landing page of this website was selling a travel experience, I wanted users to feel as if they were there just by looking at the page. That's why I decided to add PNG images of jungle leaves to make this experience more dimensional.

[ DESIGN SYSTEM ]

The simplicity of the landing page captured in a design system

What makes a good landing page?

There are some guidelines that can make a landing page more engaging and easier to convert. During my design process, I decided to include some elements that could boost page conversion

01.

Clear call to action

02.

Social Proof

03.

Mobile Friendly

04.

Visuals are the key

01.

Clear call to action

02.

Social Proof

03.

Mobile Friendly

04.

Visuals are the key

[ UI DESIGN ]

Jungle and adventure just by looking at screen

Once the initial flow was complete, I started by creating a couple of the main high-fidelity screens of the website. I started by defining the fonts and colors.

When creating this visual identity I was inspired by natural colors that bring to mind summer and adventure. I decided to make my main Call to action bright orange color - so it stands out from the design and sight is drawn into it. To make the whole design more colorful I added complimentary color in green shades which was used as accent color for some visual elements.

While choosing font I wanted to make it playful, adventurous yet readable. I went with Ivy Presto Display to use for bold headers and Ivy Presto Text for copy.

One of the most important part of this interface design was visual content such as photographies and videos. As the landing page of this website was selling a travel experience I wanted to users just by looking at the page felt like they were there. That's why I decided to add pngs jungle leaves to make this experience more dimensional.

[ DESIGN SYSTEM ]

Simplicity of landing page captured in a design system

What makes a good landing page?

There are some guidelines that can make a landing page more engaging and easier to convert. During my design process, I decided to include some elements that could boost page conversion.

01.

Clear call to action

Buttons are core components of a landing page. Users need to know what action we want them to take, as this is what drives conversion.

02.

Social Proof

03.

Mobile Friendly

04.

Visuals are the key

01.

Clear call to action

02.

Social Proof

03.

Mobile Friendly

04.

Visuals are the key

01.

Clear call to action

02.

Social Proof

03.

Mobile Friendly

04.

Visuals are the key

Accessibility Evaluation

Summary

[ PROTOTYPE ]

Splash of interaction to keep users engaged.

The studies show that interaction and animation are a significant part of designing websites, as they can enhance user engagement, navigation efficacy, and even conversion rates.

One study showed that 60% of users are more likely to scroll to the end of a web page if it includes interactive scroll-triggered animations. This is quite important data for a product like a landing page. Based on this knowledge, I decided to enhance the user experience of my project with scroll-triggered animations.

The studies show that interaction and animation are a significant part of designing websites, as they can enhance user engagement, navigation efficacy, and even conversion rates.

One study showed that 60% of users are more likely to scroll to the end of a web page if it includes interactive scroll-triggered animations. This is quite important data for a product like a landing page. Based on this knowledge, I decided to enhance the user experience of my project with scroll-triggered animations.

Desktop Scroll

Mobile Scroll

[ ACCESSIBILITY EVALUATION ]

Accessibility Evaluation

The landing page has been evaluated for contrast to meet the AA standards of WCAG. In some cases, I found that the contrast could be improved.

Accessibility Evaluation

Summary

[ SUMMARY ]

Project summary

Project Overview

During the project, I evaluated the tourism industry market and conducted a competitive audit to find out how other companies approach design in this industry. To determine the most influential factors that motivate people to invest in guided trips, I ran a quick online user survey. Based on previous research, I created personas and started designing. I began with low-fidelity sketches and later developed them into high-fidelity UI with a design system. To add another layer to the design, I created interactions and animations. I also ran an accessibility contrast check to ensure that my project is accessible.

Metrics

As this was a project made for portfolio purposes, I won't be able to measure the success of my design. However, if it were made as an actual landing page, I would measure the following:

Conversion Rate – The percentage of users who booked a Madeira Travl trip. This would be a direct KPI measure of the design's success.
Scroll Depth – Since it’s a one-page design, scroll depth would show how far along users are engaging with it and could help identify any problematic parts of the design.

My learnings

Even though the landing page design is not an extensive project, it still requires a lot of work and attention to ensure it's well thought out and addresses user needs and pain points. I also had the chance to enhance my skills in designing interactions and animations, which were a significant part of this project.