<?xml version="1.0" encoding="utf-8"?>
Open full project

Overview

Marga is a modern ride-sharing app created to make daily commuting in Nepal easier, faster, and more reliable. The idea behind Marga was to blend cutting-edge technology with a deep understanding of local needs focusing on accessibility, trust, and keeping things simple for users.The design challenge was to craft a clean, intuitive experience that removes any friction from booking rides while making users feel confident and comfortable every step of the way.

With Marga, you can instantly book a ride, see nearby drivers, track your trip in real time, and take advantage of features like loyalty points and ride history — all within a friendly and consistent design.This project was never about building just another ride-sharing app. It was about rethinking how design can bridge technology and the everyday lives of Nepali commuters, creating an experience that feels personal, thoughtful, and truly user-focused.

The Problem

Most ride-sharing apps in Nepal today face similar problems inconsistent fares, confusing layouts, slow confirmations, and a lack of trust between riders and drivers. Many of these platforms don’t fully adapt to local needs or understand how people commute daily in Nepal’s cities and towns.

From early research and user feedback, we learned that riders want:

  • Faster bookings without unnecessary steps
  • Clear pricing and dependable trip tracking
  • A loyalty or rewards system to encourage repeat use
  • An app that feels local and relatable, not foreign
  • A modern, simple design that avoids clutter

The challenge was to turn these insights into a smooth, easy-to-use experience that works well on any device while keeping a strong connection to local culture and identity.

Goal

The main objective was to design a ride-sharing platform that feels trustworthy, intuitive, and uniquely Nepali. Marga aims to simplify the booking process, ensure transparent fare estimation, and create a rewarding experience for loyal users through an elegant, minimal, and consistent UI.

In short, the goal was to blend simplicity with reliability giving users a sense of control and confidence at every step of their journey.

Design Process

The project followed an iterative, AI-assisted design process combining human creativity with artificial intelligence for faster ideation. The workflow was divided into four key stages:

1. Research and Insight Gathering

A quick competitor analysis and informal interviews helped identify key frustrations with existing ride apps. Insights were drawn around visual hierarchy, interaction flow, and perceived trust indicators.

2. Ideation through AI (UXPilot)

Using UXPilot, several core screens were generated through structured prompts. These AI-assisted outputs provided layout inspiration, component ideas, and visual direction that accelerated the concept phase.

3. Refinement and Detailing in Figma

The generated designs were refined manually in Figma to enhance spacing, hierarchy, and usability. Components were standardized and grouped into a minimal design system for consistent application across all screens.

4. Prototyping and Interaction Mapping

Interactive flows were created in Figma, simulating booking, trip tracking, and user navigation. Each interaction was tested to ensure a smooth and predictable user experience.

This combined approach allowed the project to evolve quickly while maintaining a clear design rationale at every stage.

AI Workflow and Prompts

A total of 11 screens were generated using UXPilot’s AI design feature. Each prompt was intentionally descriptive to control visual style, component placement, and tone. Example of a detailed prompt used:

The AI generated strong layout foundations that significantly reduced wireframing time. Each iteration refined button placements, typography sizes, and component grouping. Screens were later adjusted in Figma to ensure accessibility compliance, proper alignment, and visual consistency.

Marga 1

Marga 2

View Uxpilot Design

From AI to Figma: Refinement

The AI-generated screens provided an excellent starting point but lacked visual finesse and user-friendly consistency. Through multiple refinement sessions in Figma, every screen was polished to align with Marga’s brand essence.

Select Language Screen Refinement:

Marga 3

Refined for clarity and minimal interaction steps, this screen adopts intuitive iconography and soft color accents to make language selection feel friendly and straightforward for first-time users.

Login Screen Refinement:

Marga 4

The login screen evolved from a simple AI-generated layout to a more welcoming and structured design. The refined version enhances visual hierarchy, introduces clearer call-to-actions, and applies balanced spacing aligned with Marga’s brand style.

Verification Screen Refinement:

Marga 5

The login screen evolved from a simple AI-generated layout to a more welcoming and structured design. The refined version enhances visual hierarchy, introduces clearer call-to-actions, and applies balanced spacing aligned with Marga’s brand style.

Home Screen Refinement:

Marga 6

The refined home screen improves visual rhythm and balance, with better use of color, spacing, and iconography. Cards and quick actions are restructured with better illustrations for easier scanning and enhanced accessibility.

Offer Screen Refinement:

Marga 7

The new design highlights offers through bold icons, stronger contrast, and better visual grouping. The improved layout encourages user engagement while maintaining clean brand consistency with better call-to-action.

Activity Screen Refinement:

Marga 8

The refined activity screen improves information hierarchy by grouping ride records logically, adding status indicators, and applying modern card layouts for a clear summary of recent trips.

Notification Screen Refinement:

Marga 9

The refined Figma design enhances the original HiFi concept with a cleaner, more cohesive layout and consistent use of brand colors. It introduces better spacing, subtle shadows, and refined typography for improved readability and hierarchy. The updated version also aligns with modern UI principles, offering a polished and professional notification experience.

Booking Ride Screen Refinement:

Marga 10

The refined Booking ride design improves the HiFi version with a more immersive map view and a balanced visual hierarchy. It introduces realistic vehicle illustrations, consistent iconography, and cleaner spacing for better readability. The updated interface feels modern and intuitive, enhancing the overall booking experience with a polished and professional look.

Trip Detail Screen Refinement:

Marga 11

The refined Figma design gives the Trip Detail screen a cleaner and more modern look. It improves spacing, alignment, and typography to make everything easier to read and more organized. The overall layout feels more polished and user-friendly, creating a smoother and more professional experience for users.

Marga Points Screen Refinement:

Marga 12

The refined Marga Points screen look more organized and visually appealing. It improves spacing, button alignment, and typography for a cleaner, more modern feel. The layout is more balanced and easy to navigate, giving users a smoother and more rewarding experience while tracking their points and rewards.

Profile Screen Refinement:

Marga 13

The refined Profile screen is cleaner and more structured layout. It simplifies icons, improves spacing, and enhances readability for a smoother user experience. The updated version feels more modern and professional, making navigation easier and the overall design more visually balanced.

Design System:

Marga 14

The design system was created to maintain visual consistency and a strong brand identity across the product. It uses the Geist typeface in multiple weights Regular, Medium, SemiBold, Bold, and ExtraBold to establish clear hierarchy and readability. The color palette is built around a bold primary red (#E73D3D) that represents energy and confidence, complemented by neutral grays (#9CA3AF), deep black (#191C24), and a soft pink accent (#FF9E9E) for balance. Together, these elements ensure a clean, modern, and cohesive design language throughout the interface.

Key Learnings :

This project revealed how AI can be a valuable creative collaborator in the design process, helping to balance AI's efficiency with human creativity.

Some key insights I gained include:

  • AI speeds up the ideation phase significantly but still relies on the designer’s expertise to ensure emotional depth and contextual relevance.
  • Writing precise and thoughtful prompts is a crucial skill; the clearer the guidance, the more aligned the AI-generated results.
  • Accessibility and cultural context are essential foundations of usability that go beyond surface-level aesthetics.
  • Establishing a mini design system early on helps maintain consistency and reduces the need for extensive redesign later.
  • Leveraging AI allows designers to focus more on human-centered aspects like empathy and storytelling, rather than repetitive layout tasks.

Overall, this work demonstrated that AI enhances creativity rather than replacing it. It reinforced the idea that human intention and insight remain at the core of meaningful design.

Final Showcase :

The final screens reflect a harmonious fusion of AI-driven ideation and careful, hands-on refinement. Every element is thoughtfully crafted to embody Marga’s essence confident, rooted in local culture, and elegantly minimal.

The visual style features clean layouts, subtle shadows, and bold accent colors that together convey a sense of energy and clarity. The completed prototype delivers a seamless user experience centered on trust, simplicity, and efficiency.

Marga 15

Marga 16

Marga 17

Marga 18

View Marga Prototype.

Conclusion :

Marga isn’t just another ride-sharing idea it’s a glimpse into how new design tools like AI can simplify the creative process without taking away the designer’s touch. It shows how thoughtful design that considers context, accessibility, and simplicity can truly change how we experience everyday mobility.

This project also highlighted the power of collaboration between designers and AI, proving that technology can enhance creativity rather than replace it.

Through this journey, Marga reimagines what it means to create digital experiences that feel local and authentic, yet ready to compete globally. It’s a reminder that great design begins with empathy, clarity, and a clear sense of purpose.

Tools used

Figma
ChatGPT

From brief

Topics

Share

Share your insights — leave a project review and help others grow their skills

Reviews

0 reviews


This project hasn’t been reviewed yet
Share your expertise with the Uxcel community by providing a review of this project. Not only will you help others, but you will also enhance your leadership skills.
0 Claps
Average 0.0 by 0 people
5 claps
4 claps
3 claps
2 claps
1 claps
<?xml version="1.0" encoding="utf-8"?>