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.

Framer Design Optimization for Themison
Framer Design Optimization for Themison
Helpful Investors - Logo | Visual Identity
Helpful Investors - Logo | Visual Identity
Logo and Brand Identity Design for Underrrated
Logo and Brand Identity Design for Underrrated
HelpfulSales Rebranding and Website Development in Framer
HelpfulSales Rebranding and Website Development in Framer

Join 50k+ companies and 1M+ independents

Contra Logo

© 2025 Contra.Work Inc