Tourscanner

UX UI , Mobile, mock project
1 day
Project Overview
I revamped TourScanner, a pioneer in travel tour and activity search engines, to enhance its UX/UI for a more seamless experience. With over 30 online travel agencies integrated, users can compare top offers effortlessly. The focus was on refining navigation, simplifying search processes, and elevating visual aesthetics to ensure an intuitive and engaging platform for travelers worldwide.
Try the figma prototype
My Contributions
For this personal project, I handled the entire UX/UI design process.
The Design
How would tourscanner app look like if I designed it?
In this brief case study, I'll show you.
Color Palette
To come up with a color guide, I leveraged the company brand color, created a darker variant of it, to keep the contrast of text consistent across the design, while still applying a tone that would raise brand familiarity.
The other tones in this palette are simple neutral colors (with a sprinkle of blue).
Typography
I choose two sans serif fonts: Poppins and Inter; because they work well on mobile, are easy to style and look "friendly".
Grid system
I adopted a simple grid system with consinstency and grouping as the main pillars, everything just has to be grouped inside the safe area, with proper spacing and proportions of the elements provided by the 4 px grid. Simple yet effective. The columns worked as  guides for the navbar.
Screens
For this project I designed various screens and the search feature modals and interaction. To communicate and convey the experience I had in mind I've also made an interactive prototype with animations.
You can try it here.
Conclusions
This market is growing and so is the competition, I believe that a convincing, delightful and frictionless user-experience is the key to differentiate your service in this realm.
This project has been an opportunity to test my capabilities, explore the potential impact I would bring to this app, and of course hone my skills.