Ace Ride- Ride Share and Car Rental App Design

Al Razi Siam

🧭 Overview

Role: UX Designer, UI Designer
Tools Used: Figma
Duration: 3 Weeks
Platform: iOS/Android (Mobile App)
Goal: Create a user-friendly app for both ride-hailing and car rentals

Figma Preview: Click Here

🔍 Problem Statement

Most ride-share apps focus on instant pickups. Rental apps, on the other hand, operate independently and are often cumbersome. I wanted to design an all-in-one solution that allows users to either request a quick ride or rent a vehicle for a few hours or days.
This concept was built from scratch based on real user frustrations:
Too many apps for similar transport services
Long sign-up processes that discourage new users
Unclear ride pricing and rental terms
Safety concerns about unknown drivers or vehicles
No easy way to schedule future rides

🎯 Goals

Minimize user friction from first tap to ride
Make ride-sharing and rental feel part of one system
Prioritize trust, transparency, and ease
Keep actions accessible and straightforward, even on the go

🧠 Process

1. Research

I spoke with regular commuters and city travelers. Common patterns included:
Wanting faster onboarding
Frustration with hidden fees
Feeling rushed or unsure during booking

2. User Flows

I mapped out two key flows:
Ride now: choose destination → pick ride → confirm → go
Rent a car: choose car → select time → confirm → pickup details

3. Wireframes

Sketched out low-fidelity screens for:
Home (with toggle for Ride/Rent)
Booking
Driver/Car profile
Payment
Ride history
Ratings

4. Visual UI Design

Created a clean, accessible UI with:
Friendly fonts and bold CTAs
Clear ride details and upfront pricing
High-contrast colors for visibility
Soft shadows and space for comfort
Intuitive icons for quick scanning

Figma Preview: Click Here

📱 Key Screens & Features

🔐 Onboarding
Quick signup with phone, Google, or Facebook
One-time passcode for secure login
No unnecessary form fields
🗺️ Home
Live map with location auto-detected
“Where to?” bar as central CTA
Toggle to switch between “Ride” and “Rent”
🚕 Ride Share Flow
Shows drivers nearby with ETA and fare
Rider sees car type, driver rating, name
Schedule option for future rides
“Call Driver” feature inside the app
🚘 Rent a Ride Flow
Displays available vehicles with images and rates
Filters for car type, transmission, pricing
Seamless date and time picker
Car pickup details shown clearly
💳 Payments
Add multiple cards or use cash
Clean UI with icons and validation
Set default method for fast checkout
🧾 Ride History
View past trips with receipt and details
Option to report issues or repeat ride
Rating driver directly from history
⭐ Feedback
Post-ride screen with rating bar
Pre-filled quick tags (e.g., “Friendly driver”)
Option to write a short review

🧩 Challenges & Solutions

1. Combining Two Services
Problem: Ride and rental usually work in separate apps Solution: Used a toggle UI to keep both in one flow without confusion
2. Gaining Trust
Problem: Users fear unknown drivers or hidden charges Solution: Show upfront fare, ETA, full driver/car profile before confirming
3. Fast Onboarding
Problem: Long registration kills interest Solution: Allow login with 1-tap social options and quick verification
4. Easy Booking on the Move
Problem: People often use ride apps while multitasking Solution: Big CTAs, less typing, fewer steps, and forgiving layouts

✅ Outcome

Fully designed mobile UI, ready for prototyping or development
Designed to scale for cities, travelers, and multi-purpose users
Made the booking process easier, faster, and more human
Included smart design decisions for both instant use and planned trips

💡 Learnings

Trust can be built visually through layout, transparency, and feedback
Small tweaks (like showing ETA earlier) improve confidence and comfort
Designing for motion (fast users, changing screens) matters a lot in transport apps
Like this project

Posted Jul 22, 2025

Designed a user-friendly mobile app for ride-hailing and car rentals using Figma.

TalentTrack – HR Management Dashboard Design
Hexwaave Logo and Brand Identity Design
Hexwaave Logo and Brand Identity Design
Framer Design Optimization for Themison
Framer Design Optimization for Themison
Helpful Investors - Logo | Visual Identity
Helpful Investors - Logo | Visual Identity

Join 50k+ companies and 1M+ independents

Contra Logo

© 2025 Contra.Work Inc