89transfers — accessible UI/UX design to simplify the booking process

time icon
2024
2022
arrow scroll icon
scroll
ui/ux design for transportation booking platform

The top player in the French transportation market owing to the power of vehicle-generated open data.

LinkByCar is a SaaS startup that created a tool to collect, process, and aggregate data from vehicles. With the use of AI technology, it can predict the behavior of any vehicle — all to ensure you safely get to your destination.

The company cooperates with popular car manufacturers, including Stellantis, Mercedes, and BMW. With an extensive network already in a place, they have serious potential to expand across all of Europe.

Whether you’re traveling solo, with friends, or as a family, 89transfers caters to all your transportation needs

A go-to platform for booking transportation services across Mallorca. They provide a convenient price calculation tool and a smart system that determines the ideal pickup and drop-off times based on the flight schedule.

With years of experience in private transfers from Palma Airport, the company stands as the top choice in Mallorca. No wonder, even before our collaboration, they had quite a good customer satisfaction rate — 4.6, as per Trustpilot.

Industry
Information technology
Link to Industry
Services
UX/UI design
Link to Service
Timeline
1 month
  • 48,000+
    vehicles LinkByCar gathers data from
  • 75+
    types of data collected by vehicles
  • 18
    car brands they collaborate with
  • #1
    transfer choice in Mallorca
  • 4.6
    customer satisfaction rate
challenge

Insurance company managers and automotive corporations typically face challenges with complex software. That’s why the process of collecting data from vehicles can be a bit of a headache.

Real-time vehicle tracking, predicting potential problems, and accident reconstruction — all of these had to be considered in the product design. A perfect software offers everything in one place, simplifying things for those who aren’t fluent in the language of technology.

Challenge

As users search for hassle-free transportation booking, they face a digital landscape cluttered with platforms lacking in functionality. The disjointed interfaces make the booking process cumbersome, leading to frustration, headache, and bad mood.

But this challenge isn’t just about functionality — users long for an experience that captivates senses and delights eyes. Only through a perfect fusion of practical features and aesthetic appeal can users be assured of smooth transfers to and from their destination.

It was a fully fresh perspective in every sense.

The research showed that competitors’ websites somewhat lagged behind the latest trends, which didn’t align with the technological and innovative nature of this business.

Hence, we aimed to convey the client’s digital orientation through a practical and rigorous branding approach, complemented by bright accents.

15 logo sketches
2 days spent on research
  1. Discovery. A user comes across a link or post in Discord.
  2. Saving to profile. The user can save these links/posts to their profile.
  3. Organizing content. They can create new collections or use existing ones to organize these links or posts.
  4. Easy retrieval. Later on, users easily find a specific link or post, either through a search, within a specific collection, or in their profile.
  5. Sharing. If they want to, users can share links, posts, or collections with others.
  6. Collaboration and discussion. Everyone can engage in discussions about what’s shared and even add new links to collections if they have access.
sdfsdfds
For a brand to speak with one voice, it needs a brand book to set the tone.

Finding best practices for 89transfers makeover

We analyzed the functionality and focused on areas that may be hard for users to digest. Based on this, our team prioritized simplifying flight selection, standardizing design elements, and optimizing the platform for desktops.

Also, we observed that competitors struggled with information overload and lacked clarity in presenting prices. Our goal was to address these challenges by developing a user-friendly and easy-to-book platform for 89transfers.

5 competitors evaluated from A to Z
3 days on research
Although they already had great conversion rates, our goal was to enhance this number even further — with the use of strategic UX and UI solutions.
{{artem-borysenko}}

Aesthetics that sets 89transfers apart from competitors

Concept 1: Light retro

The first concept is all about bringing a bit of the past into the present, but in a cool, subtle way. It features soft pink gradients, creating a nostalgic feel. Then, we throw in some blue accents for a bit of a fresh twist. This combination gives off a retro vibe that’s both familiar and new.

Concept 2: Gentle brutalism

This concept delicately incorporates elements of brutalism, such as sharp angles, bold fonts, and clear shadows, presented in a minimalist manner. Despite the inclusion of such “brutal” features, the design maintains an overall sense of sophistication and refinement.

{{slider-1}}

Diagram that communicates transfer booking

With a clear understanding of the do’s and don’ts for 89transfers, we were ready to start working on the friendly product. To make things simple and accessible, we mapped a flowchart from the entry to the endpoint of users’ actions.

This detailed visualization allowed our team to identify potential pain points and find ways to streamline the user experience. From navigation to confirmation, we ensured that every interaction was intuitive and stress-free.

185 screens designed for the booking flow
3 steps to book the transfer

{{slider-2}}

UX-centric design for easy travel info display

Our team took great care in structuring the user interface, creating seamless navigation and a clear journey for visitors to easily book transfers, check prices, access flight information, and much more.

With these needs in mind, we created many new features for 89transfers. They aimed to simplify EVERY tiny thing in the booking process, boosting the perception of information for users of all backgrounds.

200+ screen states for booking functionality
7 new features incorporated
The main challenge was to create a modern, consistent, and well-contrasting visual style for 89transfers — all in one package.
{{artem-borysenko}}

A fusion of charm and functionality

Our main goal for the UI side was to complement the functional side of 89transfers and make the website look more industry-oriented. With this target in mind, Halo Lab designers picked a cool and calm color palette.

We opted for a tandem of pastel purple and bold black, which created extra contrast. As a result, such color inclusivity promotes a welcoming atmosphere, helping customers easily find critical travel information.

200+ elements in design system
24 custom icons

Creating UI Kit & Wireframes

Throughout the entire project, our designers constantly worked on comprehensive, high-fidelity wireframes — all to convey the fundamental structure of the website and test every potential user scenario.

Besides, a crucial part of our deliverables pack was the UI Kit. We filled it with various user interface elements (colors, buttons, icons, fonts, etc.) to help 89transfers feel more organized and consistent.

2/3 of time spent on wireframes’ creation
1/3 of time dedicated to adding visuals
Concept 1
Concept 2
No items found.
Step 1: Booking process
Step 2: Awaiting approval
Step 3: Final destination
No items found.
No items found.

Halo Lab provided brand analysis services that helped us with better understanding our market type, niche, customers, and competitors. They designed our whole SaaS platform, leveraging both UI and UX expertise. Furthermore, they used React to help us build a customer-facing dashboard that connects to our existing backends.

Have a similar project or idea? Let's discuss the details.
Get expert estimation
Get expert estimation
expert postexpert photo

Ready to discuss
your project with us?

Please, enter a valid email
By sending this form I confirm that I have read and accept the Privacy Policy

Thank you!
We will contact you ASAP!

error imageclose icon
Hmm...something went wrong. Please try again 🙏
SEND AGAIN
SEND AGAIN
error icon
clutch icon

Our clients say

The site developed by Halo Lab projected a very premium experience, successfully delivering the client’s messaging to customers. Despite external challenges, the team’s performance was exceptional.
Aaron Nwabuoku avatar
Aaron Nwabuoku
Founder, ChatKitty
Thanks to Halo Lab's work, the client scored 95 points on the PageSpeed insights test and increased their CR by 7.5%. They frequently communicated via Slack and Google Meet, ensuring an effective workflow.
Viktor Rovkach avatar
Viktor Rovkach
Brand Manager at felyx
The client is thrilled with the new site and excited to deploy it soon. Halo Lab manages tasks well and communicates regularly to ensure both sides are always on the same page and all of the client’s needs are addressed promptly.
Rahil Sachak Patwa avatar
Rahil Sachak Patwa
Founder, TutorChase

Logo creation

Sketches

A truly iconic logo is a trail of drafts

We explored different sketches during the design process. Initially, our designers considered wordmarks that convey a sense of technology, innovation, or modernity. We also experimented with minimalist symbols to accompany the wordmark. Ultimately, our team chose a wordmark featuring the infinity symbol and a symbol formed from C and A, creating an infinity loop.

Sketches

A truly iconic logo is a trail of drafts

We explored different sketches during the design process. Initially, our designers considered wordmarks that convey a sense of technology, innovation, or modernity. We also experimented with minimalist symbols to accompany the wordmark. Ultimately, our team chose a wordmark featuring the infinity symbol and a symbol formed from C and A, creating an infinity loop.

Being a data scientist, our client had written Python code to perform mathematical calculations. So, one of our key goals was to leverage the right technologies to correctly integrate this code into the platform.
{{margarita-d}}

Logo creation

Logo creation

Some engaging parts of our design journey

Waiting screen

The Waiting Screen activates for reservations made less than 24 hours in advance. It displays a 4-minute countdown, during which the responsible party is alerted to authorize or reject the booking. Approval confirms the reservation, while rejection notifies the user of unavailability.

People on site

The People on Site feature displays recent activity. It shows real-time visitor counts and the last 3–5 bookings, highlighting info like passenger names, transfer details, and booking times. We designed this section to motivate users and give them a sense of belonging to the online community.

Occupancy and availability indicator

The Occupancy and Availability indicator was created to hint at limited upcoming availability to urge prompt bookings. It also clarifies that selecting a flight automatically calculates pickup and arrival times, achieved through clearer information, graphical elements, and enhanced visuals.

Logo creation