Uno Travel: Travel Booking Website Design for a Swedish Agency, from Flights to Umrah
Travel booking website design for Uno Travel: one search for flights, hotels, cars, rides, tours and helicopters, and full pages for Umrah and visas.
The project at a glance
Uno Travel (Uno Travel Resebyrå) is a Swedish travel agency founded in 2015, with its head office in the departures building at Arlanda Airport in Stockholm, a branch in Vårberg Centrum and another in Istanbul, and membership of IATA. Its customers book very different things, from a cheap flight to a family Umrah, so Kenania designed a site that puts every service behind one search. The travel booking website design was produced in Adobe XD and built with BIGBANG IT Solutions; it is live at unotravelsweden.com.
In collaboration with
Table of Contents
One search for every kind of trip
The home page opens on a full-width photograph with a single search panel. Its tabs cover the agency’s services (flights, hotels, car rental, rides, tours and helicopter trips), and each tab changes the fields underneath: destination and dates for hotels, pickup and drop-off for a ride.
On the hotels tab the panel holds a destination field, check-in and check-out dates picked from a calendar, a Search Hotels button and a tick box for visitors who have no fixed dates yet. Visitors who already know what they want start here, so the travel booking website design puts the panel above the fold, in the part of the page seen before any scrolling, and keeps it in the same position on every tab.
Below it, ten service tiles repeat the offer in plain words: search flights, hotels booking, get a helicopter, rent a car, international tours, get a ride, airport services, visa services, Umrah and Hajj, and online payment. Each has a line icon and a label in the agency’s blue, and the helicopter tile carries a small VIP badge.
Have a project like this in mind? Message Kenania directly on WhatsApp.
Chat on WhatsAppProof before price
Travellers pay before they travel, so the travel booking website design shows proof early. Right after the services comes a row of the airlines whose tickets Uno Travel sells as an authorised agent, meaning it is allowed to sell them directly. Then follow a carousel of current offers, a «Why choose Uno Travel» row of five promises with icons, and a partner banner.
Further down come the agency app, the latest news with blog and event filters, a newsletter sign-up, Google reviews, a row of featured reels and the payment and booking partners: Viva Wallet, Klarna, IATA, and Sabre and Amadeus, the global distribution systems that agencies use to book flights and hotels.
Tours, from the city grid to the booking
International Tours shows the offers carousel again and a grid of destination cities with photographs, from Barcelona, Paris and London to Mecca, Medina and Jeddah, with a search field above it. A tour page reads like a booking form: an overview with the stops, the number of travellers, the date, a choice between a meeting point and a pickup at extra cost, and a total with a single Book Now button, followed by questions and answers on what is included, the departure point, what to expect, additional information and cancellation.
Umrah and visas
Umrah and Hajj are a large part of the agency’s work, so the travel booking website design gives them a full page. The Umrah page explains the visa first and then lists packages as cards with a photo, a short description, a price and View Tour, with questions about timing and which visa to choose. Visa Services follows the same pattern for other countries, with a request form for the passenger’s details and its own questions.
An About page that answers the trust question
An agency that takes payments online has to show who it is, and in this travel booking website design the About page does that. It states the company’s history, its offices and its IATA membership in short paragraphs under a photograph of a family at an airport, and the footer repeats the contact numbers for every country the agency serves.
The ride booking screens
Beyond the travel booking website design, the XD file also holds the agency’s ride booking screens for its app. A ride is requested by trip or by the hour, with pickup, drop-off, date and time. Ride details let the traveller choose the car class, the number of adults and children with their ages, bags, a name for the driver’s sign and flight details, then apply a coupon and see the total including tax.
Trip details show the route on a map, the car and the driver, with a button to reach the call centre. A rating screen closes the ride with the bill, a star rating for the driver and a box for a written review.
Who a travel booking website design has to serve
A travel agency website has two audiences at once. Some visitors know exactly what they want, a flight on a given date, and need a fast form. Others are still choosing between tours, offers and destinations, and want to look around before they fill anything in. A travel booking website design has to serve both on the same page without either getting in the other’s way.
Uno Travel adds a third layer: services that are not travel in the narrow sense, such as visas, Umrah and Hajj, airport services and rides, each with its own rules and questions. The design answers with a strict order. The search panel comes first for people who know what they want, the service tiles second for people who need a way in, and the offers, news and reels after that.
How the search panel behaves
The search panel is the first thing a visitor touches in this travel booking website design, so it follows fixed rules. Tabs keep the same order, and the active tab is filled in the red of the logo. Each field carries a small caption inside the box, above the value, so the label stays visible after the visitor types. Dates come from a calendar instead of being typed, and there is one button, named for the action it starts, such as Search Hotels. The tick box for travellers without fixed dates keeps flexible visitors in the search.
Inner pages built from the same parts
Tour pages, Umrah packages and visa services look different but share one set of parts: a photo header, a short introduction, cards with a price and one action, a booking block with a total, and questions and answers at the end. The system keeps the travel booking website design consistent as it grows, and a new destination or package can be added from parts that already exist.
The questions at the end of each page carry what a traveller needs before paying: what the booking includes, where the tour departs and the cancellation policy, which sits on the tour page itself. Every tour or package page ends with the booking block in the same place, so the Book Now button is always where the visitor expects it.
Questions about cost, timing or the next step? Ask Kenania on WhatsApp.
Chat on WhatsAppTwo visitors, two routes through the site
Take a family planning an Umrah. They see the search panel but have no dates yet, so they scroll to the service tiles and choose Umrah and Hajj. The page explains the visa first, then shows the packages with photographs and prices, and its questions cover timing and which visa to choose. They open a package and find the booking block with travellers, date and total. Before paying they can check the payment partners and Google reviews on the home page and the contact number for their country in the footer, so they can book without phoning first.
A second visitor wants a hotel. They pick the hotels tab, type the destination, choose two dates from the calendar and press Search Hotels without leaving the first screen.
Photographs and colour
The pages lean on large destination photographs: a pool deck over the sea on the tour page, the Kaaba on the Umrah page, passports and a visa on the visa page. The interface of the travel booking website design stays calm around them. Headings and buttons use the agency’s blue, a short red underline marks one word in each heading, and cards sit on white and light grey. The photographs carry the mood of the trip, and the buttons stay easy to see on top of them.
From desktop artboards to a phone
The artboards of this travel booking website design are drawn at desktop width, and many travellers start on a phone. On a phone, the plan is for the search tabs to become a strip that scrolls sideways, the service tiles to fall into two columns and the booking block to turn into a fixed button at the bottom of the screen. Since the pages share their parts, each part needs its mobile rule only once.
Scope
- Travel booking website design in Adobe XD: home, about, contact, terms, tours, tour details, Umrah and visa pages
- Tabbed search for flights, hotels, cars, rides, tours and helicopters
- Service tiles, airline partners, offers, news, reviews and reels on the home page
- Booking form for tours with travellers, date, pickup and total
- Umrah packages and visa request pages with FAQs
- Sign-in and available-tours dialogs
- Ride booking screens for the agency app
- Built and hosted in partnership with BIGBANG IT Solutions
Related projects and services
- Website and app development: from the design to a live site
- UI/UX design and digital products: research, flows and interfaces
- Website design in Syria: bilingual sites built with BIGBANG
Planning a booking website for a travel agency? Send a short brief and we will reply with a page plan.
Questions about travel booking website design
What can visitors book on the Uno Travel website?
Flights, hotels, car rental, rides, international tours and helicopter trips from one tabbed search, plus Umrah packages and visa services on their own pages.
Is the website live?
Yes, at unotravelsweden.com. The design was built and is hosted in partnership with BIGBANG IT Solutions.
Why put every service behind one search?
Customers of a full-service agency come for different things. In this travel booking website design, one panel with tabs lets each of them start the same way and reach the right form from the first screen.
Did the project include an app?
The XD file also contains ride booking screens for the agency app: request, ride details, trip details, payment and rating.
Do you design websites for other travel agencies?
Yes, in Arabic and English, from the booking flow to Umrah, visa and tour pages, with development and hosting through our website and app development service.
