RideX - Ride Fare Comparison Web Application

RideX is a responsive ride fare comparison web application UI designed to help users compare ride options from platforms like Uber, Ola, Rapido, and inDrive in one place.

The project focuses on providing a seamless and intuitive user experience through a modern mobile-first interface. It demonstrates the concept of a unified ride comparison platform where users can explore different ride options before making a booking decision.

Features

• Modern and responsive user interface
• Splash screen with loading animation
• Mobile number login interface
• Google and Email login button UI
• Guest login option
• Interactive map integration using Leaflet.js
• Ride comparison interface
• Compare Uber, Ola, Rapido, and inDrive ride options
• Cheapest and fastest ride filters
• Ride details bottom sheet/modal
• Ride app redirection flow simulation
• User profile screen
• Smooth animations and transitions
• Mobile-friendly design

Tech Stack

• HTML5
• CSS3
• JavaScript (ES6)
• Leaflet.js
• Remix Icons
• Google Fonts

Project Structure

RideX/
├── index.html
├── styles.css
├── app.js
└── README.md

Getting Started

Prerequisites

• Any modern web browser (Chrome, Edge, Firefox, Safari)

Installation

1. Clone the repository:

git clone https://github.com/iutkarsh15/RideX.git

2. Navigate to the project directory:

cd RideX

3. Open index.html in your preferred browser.

No additional setup or installation is required.

Screens

The application currently includes the following interfaces:

• Splash Screen
• Authentication Screen
• Ride Search Interface
• Interactive Map View
• Ride Comparison Screen
• Ride Details Section
• User Profile Screen

Important Note

This project is currently a frontend prototype demonstrating the user interface and user experience of a ride fare comparison platform. Real-time fare comparison functionality will be implemented in future versions through official API integrations.

At present, RideX uses mock ride fare data for demonstration purposes and does not provide actual fare information from ride service providers.

Future Enhancements

• Integration with official ride provider APIs
• Real-time fare comparison
• Live location search and suggestions
• Backend authentication system
• Booking history management
• Saved places functionality
• Personalized ride recommendations
• Deep linking to ride applications
• Progressive Web App (PWA) support

Purpose

The objective of RideX is to showcase frontend development skills, UI/UX design principles, and the concept of a centralized ride comparison experience.

Author

Uttkarsh Chandra

• GitHub: https://github.com/iutkarsh15

License

This project is intended for educational and portfolio purposes.