Mobile App Design for Orderbit
At the start of 2019, I worked on the redesign of Orderbit using Material Design in preparation to scale the product to new markets. Orderbit is an online medicine delivery app that provides an expansive search engine and allows pharmacies to order medical products from different suppliers.
- UX/UI Design
Timeline
Early 2019
Tools
-
Sketch
Services
- UX/UI Design
Wireframes
The Orderbit team had a general idea of their desired design and shared screenshots of the previous app with me. Utilizing those references, I proceeded to develop the wireframes for the new design.
Wireframes for key screens and flows.
Typography / Colors
The preliminary design of Orderbit had a pale green color. For the new version, I made sure that the color remains but with a slightly brighter shade. Additionally, as a secondary color, I added an orange hue to create contrast when applied to buttons, sliders, switches, selected text, etc.
Components
I did an audit of the existing UI to see what to replace with a pre-existing Material component, and what new components I needed to design to deliver the full experience.
A Form that includes components like Buttons, Radio Buttons, and Text Fields. Also, a Dialog Box that informs the user about a task requiring action.
The top app bar shows actions relevant to the current screen, while the bottom app bar displays navigation options and important actions.
A Card component that contains content and actions about a single subject and a List component that includes vertical indexes of text.
Before / After
The redesigned interface was intended to be bright, clear, and follow the Material Design language.
Profile page
Login page
Orders page
All screens
Login
Orders
Order Item
Search / Scan
Other screens
Prototype
