Taste Trek
Taste Trek is a food delivery app designed as a practice project to enhance my UI/UX design skills. While the app takes inspiration from existing platforms like Zomato and Swiggy, it features a unique color scheme, custom typography, and a logo that I created using Adobe Illustrator. The project allowed me to explore Figma's capabilities, focusing on design consistency, component creation, and prototyping.
Tools: Figma, Adobe Illustrator, Freepik, UnDraw
01
Design Process
Brand Identity:
Logo Design: I designed the Taste Trek logo in Adobe Illustrator, combining elements like a Fork, Spoon, and Location Pin. This symbolizes the app’s core functions of discovering and enjoying great food. The tagline, "Discover, order, indulge," was created to reflect the user experience journey.
Color Scheme: The app uses a custom color palette, including Dirty Purple, Chardonnay, and Blush. These colors were chosen to give the app an elegant and modern feel, setting it apart visually.
Typography: I chose Source Sans Pro for the app’s font due to its readability and sophistication, enhancing the user experience and ensuring consistency across all screens.
02
Design Screen
Onboarding Screen: To introduce users to the app, I designed a custom onboarding screen that aligns with the brand identity. This screen sets the tone for the app and showcases the color scheme and typography in a cohesive manner.
Screen Design: Inspired by popular food delivery apps like Zomato and Swiggy, I added my unique touch to the overall design, focusing on layout, color balance, and user flow. Throughout the project, I experimented with various aspects of the UI, such as spacing, visual hierarchy, and component placement, to create a clean, organized, and cohesive interface. My approach ensured that the design not only aligned with the brand identity but also provided an intuitive and enjoyable user experience.
Component Creation: Throughout the project, I practiced creating reusable components in Figma, such as buttons, cards, and navigation elements. This helped ensure consistency in the design and made it easier to apply changes across the app.
03
Prototyping
Interactive Prototypes: Using Figma, I developed interactive prototypes that showcase how users would navigate the app, from the onboarding screen to browsing restaurants and selecting dishes. This was a key part of the learning process, allowing me to explore Figma’s prototyping features.
Challenges: This project was my first experience applying design standards, focusing on proper margins, padding, and alignment. I spent time learning from resources like Material Design guidelines to achieve a polished look.
04
Testing and Iteration
Initial Feedback: While formal usability testing wasn’t conducted, I shared the prototype with peers and mentors to gather feedback. This feedback helped me make minor adjustments to improve the design’s usability and visual appeal.
Iteration: Based on the feedback, I refined the design by adjusting component sizes, improving contrast for better readability, and ensuring consistency across all screens.
Learnings:
This project helped me strengthen my understanding of design principles, component creation, and the use of Figma' s prototyping features.
It also provided valuable practice in applying a consistent brand identity across an entire app.