Readorama

Mobile Book Exchange & Community Marketplace

Role

UI/UX Designer (Mobile Listing & Trading)

Timeline

2023

Status

Interactive Prototype in Figma

Deliverable

Live Preview

Figma UI/UX Design Wireframing Design Systems Interactive Prototyping

Readorama Mobile Book Marketplace Design Presentation

Project Overview

Readorama is a mobile book marketplace prototype designed as an academic group project for our UI/UX design coursework at STI College Davao. Built to solve the difficulty of trading, buying, and selling secondhand books in local student communities, my primary individual contribution was directly inspired by MyAnimeList's cataloging system and community boards: designing the core mobile listing workflow ('Sell Books' — cover image uploads, book information fields, and pricing controls) alongside the community forum and peer-to-peer trading chat.

The Problem

The Challenge: Disorganized Social Media Book Trading

Avid readers frequently buy, sell, and trade physical books through informal social media groups. This leads to common frustrations:

Unstandardized condition ratings and book edition details caused frequent buyer/seller misunderstandings.
Scattered chat messages made arranging meetups or shipping difficult to manage.
No dedicated search filters for specific publishers, genres, or academic editions.

my primary contribution

Key Designed Modules: Mobile Listing & Community Trading

Within our STI College Davao coursework group (Group 5), my primary individual contribution was inspired by MyAnimeList's cataloging and community architecture, focusing on two critical transaction flows: the 'Sell Books' mobile listing pipeline and the peer-to-peer Trading Forum & Chat:

01.

Sell Books: Mobile Listing Workflow

Drawing inspiration from MyAnimeList's structured media database, I designed the primary mobile book submission experience in Figma: cover and detail image uploads, structured book information entry (title, author, publisher, genre, and edition), condition grading (Like New, Good, Fair), and transparent pricing controls.

02.

Forum & P2P Chat: Trading of Books

Echoing MyAnimeList's community discussion boards and member interactions, I designed dedicated community discussion boards and direct peer-to-peer chat interfaces allowing readers to negotiate book swaps, discuss condition details, and coordinate local exchanges without leaving the app.

03.

Mobile Interface Ergonomics & Design System

Crafted a cohesive component library with thumb-friendly form controls, cover art aspect ratios, interactive button states, and accessible typography scales in Figma.

prototype screens