Designing for Simpler Discovery: Two Apps, One Seamless Connection
An in-depth look at our user interface design philosophy, typography choices, and information architecture for the Vipto ecosystem.
Great utility software doesn't draw attention to itself. It gets out of the way, answers the user's question, and enables immediate real-world action.
Design Philosophy
When designing Vipto, our primary rule was: **zero unnecessary cognitive friction**.
Every button, label, and card was evaluated against one standard: does this help the customer verify product availability faster, or does it help the seller respond with less effort? If the answer was no, we removed it.
We deliberately avoided flashy animations, decorative badges, and cluttered banners. We chose an editorial, restrained layout that presents information with maximum clarity.
Customer App Experience
The Customer App is organized into three primary views:
• **Explore View**: Categorized discovery showing nearby stores sorted by physical proximity, with clear category icons and recent additions.
• **Product Detail**: Clean photography, store name, distance in meters/kilometers, operating hours, and the prominent "Check Availability" action.
• **Request Activity**: A live status tracker showing pending requests, confirmed responses, and one-tap map navigation to the verified store.
Physical distance and availability status are always the highest-contrast visual elements on the screen.
Seller App Experience
For the merchant, the interface is designed as an interactive notification inbox.
When a request arrives, the screen displays the product name, timestamp, and two oversized action buttons: a green "Available" and a neutral "Not Available". The merchant can resolve the inquiry in a split second with their thumb.
Contrast & Accessibility
We designed with high WCAG contrast ratios to ensure readability under direct sunlight in street markets and on screens with varying brightness levels.