RouteLift- Homepage (Web & Mobile Design)
Embedded Files
Project Overview
Project Overview
RouteLift is a logistics platform that connects businesses and individuals with delivery riders. The product tracks rider pickup and delivery movement in real time, supports fare negotiation between customers and riders, and handles deliveries with multiple stops. I designed the responsive homepage, the first place businesses meet RouteLift, to explain what the platform does and lead them to sign up.
The Problem
The Problem
Logistics in many African markets is fragmented. Businesses juggle multiple delivery contacts, negotiate prices informally, and have little visibility once a package leaves their hands. RouteLift had a strong product, but its website needed to communicate that value fast. Visitors had to understand within seconds that RouteLift is both a marketplace for finding trusted delivery partners and a management system for running deliveries, and they had to feel confident enough to get started.
The Goals
The Goals
Communicate RouteLift's value in the first screen, with a clear headline and a single primary action.
Explain two distinct products (Delivery Marketplace and Delivery Management System) without confusing visitors.
Build trust through social proof, testimonials, and a warm, human tone.
Deliver a consistent experience across desktop and mobile, since many visitors browse on their phones.
Project Duration
Project Duration
October 2024
Role
Role
Sole Product Designer responsible for the end-to-end UI design of the responsive homepage, from wireframes to high-fidelity designs and interaction design, through developer handoff.
Category
Category
Web, Responsive Design, UI Design, Interaction Design
Interaction Design
Interaction Design
More
More
User Research
User Research
I started by understanding what RouteLift offers and who the homepage needed to speak to: businesses looking for reliable delivery partners and tools to manage their deliveries. I reviewed other logistics platforms to see how they explain their products and where they lose visitors, then worked with the team to make sure both the Delivery Marketplace and the Delivery Management System were clearly represented. This shaped the page around the questions a first-time visitor would ask, in the order they'd ask them.
Design
Design
I built the visual language around trust, energy, and local relevance. A deep navy anchors the page and signals reliability, while bright accents and city illustrations keep it lively. Real photography of delivery professionals grounds the story in the African market. Each section has one job, from the hero and value cards to the product sections, testimonials, and a closing call to action. I kept the typography clean with strong size contrast so the page is easy to scan. On mobile, the value cards stack vertically, the navigation collapses into a hamburger menu, and buttons go full-width so the main action is easy to tap.
Development
Development
I designed the homepage for both desktop and mobile, defining how each section adapts between the two, including how the value cards stack, how the navigation collapses into a hamburger menu, and how the product mockups scale down. To prepare for build, I created a handoff document and a specification document that showed developers the expected interactions in the UI, from button states and menu behavior to the testimonial carousel, so the finished page would behave as designed.
Interaction Design
Interaction Design
I added micro interactions to guide attention without slowing the page down. Menu items and buttons have clear hover, pressed, and focus states, so it's always obvious what can be clicked. On mobile, the menu expands smoothly to reveal the products, and the testimonials become a swipeable carousel with pagination dots. I added parallax scrolling animations and micro-interactions such as sections fading in or card hover effects.
Page updated
Google Sites
Report abuse