Academic2024
Chalapao
CS251 Database Systems 1: Online Rental Marketplace Platform

Role
UX/UI Designer & Frontend Developer
Year
2024
Team
Group Project
Tech Stack
Figma, React, Node.js, Tailwind
A web application designed as an online rental marketplace where users can list items for rent and rent items from others through a structured workflow. The platform covers key steps such as creating listings, browsing and viewing item details, submitting rental requests, and tracking request/status updates. This project emphasizes user experience (UX) and end-to-end system flow design for both roles—renters and listers—so the rental process remains clear, intuitive, and consistent.
01 The Problem
- Unstructured rental processes often cause miscommunication, unclear status tracking, and higher risk of errors.
- Renters need clear visibility into available listings, details, and conditions before making decisions.
- Listers need an organized way to manage their listings and review incoming rental requests.
- Designing a coherent UX for two roles (renter/lister) requires aligned, practical end-to-end flows.
02 The Solution
- Designed the UX/UI in Figma, starting from personas, user journeys, and system flows to ensure a natural and consistent experience.
- Defined key screens and navigation structure—listing feed, item detail, create listing, rental request, and status tracking—to support the complete rental journey.
- Implemented the frontend with React and Tailwind to match the Figma design system and ensure responsive behavior across devices.
- Integrated with a Node.js backend to support core features such as listing retrieval, request submission, and status updates.
03 The Result
- Delivered a structured prototype rental marketplace that supports both renter and lister roles with clear end-to-end user flows.
- Users can browse listings, review item details, submit rental requests, and track request statuses conveniently.
- Listers can manage listings and review rental requests more effectively through the designed workflow.
Project Gallery

UI sample screens and platform flow overview














