![](https://static.wixstatic.com/media/debf5d_cc773eb8fbfe436297e56d2a6730f2e3~mv2.png/v1/crop/x_16,y_0,w_463,h_383/fill/w_49,h_39,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/favicon%202.png)
KFT REDESIGN
A fresh, lively take on a hometown classic
![screens flatlay 300dpi_GREEN.jpg](https://static.wixstatic.com/media/debf5d_b3f76a78428740c68c2e2d66af0c4d59~mv2.jpg/v1/fill/w_646,h_544,al_c,q_80,usm_0.66_1.00_0.01,enc_avif,quality_auto/debf5d_b3f76a78428740c68c2e2d66af0c4d59~mv2.jpg)
Overview
A loved spot in town, Kung Fu Tea is a place close to my heart. After listening to many complaints from friends who used the app, I decided to give a fresh, lively take on the redesign with mindfulness of visual heirarchy and functionality. My main goal is to elevate and streamline the customer's experience when using the app. I wanted to match the joy of drinking boba with the experience of ordering it too.
Duration
Summer 2020, 1 week design sprint
Roles & Responsibilities
UI/UX Designer, Visual Brand Language, Graphic Designer
Identifying The Problem:
Original Interface
First, after using the app a few times, I wanted to take a clsoer look at its architecture, visual design, and brand language. Some pain points that became immediately apparent were the ambiguous and hidden information that were present 2 or 3 taps away from the main screen. I hoped to make navigating much more intuitive. Other areas of opportunties include cohesive branding colors, compelling graphics, and information sorting.
![issues with origianal app.jpg](https://static.wixstatic.com/media/debf5d_d2f1f89e7a674191b67717d2a4226cca~mv2.jpg/v1/crop/x_91,y_82,w_8992,h_3524/fill/w_755,h_296,al_c,q_80,usm_0.66_1.00_0.01,enc_avif,quality_auto/issues%20with%20origianal%20app.jpg)
Prototyping:
Wireframing
I wireframed various layouts, where all of the functionality of the original app is presented in a much clearer manner. The social aspects found on the side menu added to the overall clutter without contributing any value to users. Thus, I chose to omit this section entirely. I hoped to simplify the interface but still keep a bulk of the content.
![kung fu tea wireframes.jpg](https://static.wixstatic.com/media/debf5d_72815e93dc1441a2957f5df93baf81ef~mv2.jpg/v1/crop/x_281,y_36,w_4979,h_5428/fill/w_560,h_611,al_c,q_80,usm_0.66_1.00_0.01,enc_avif,quality_auto/kung%20fu%20tea%20wireframes.jpg)
Deliver:
Final Design
Keeping with the bright color scheme, I opted to go with a fruity color palette with a punchy red as the primary color. This is similar to the original app and also on brand with the friendly and fun aura that Kung Fu Tea gives.
Previously, most of the information was hidden in the side menu, but a bottom navigation bar reduces the ambiguity, allowing customers to easily switch between tasks while knowing which page they are on.
For the 'Welcome' or 'Home' screen, I integrated a progress tracking bar for easy access to this information, as the rewards program is a major perk for using the app. Users can use this page to access daily deals or promotional/seasonal drinks, their personal profile, and see an in-depth review of their rewards.
![phone screens.jpg](https://static.wixstatic.com/media/debf5d_f6e002c6dcd64891b2050f2d905ef550~mv2.jpg/v1/fill/w_916,h_455,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/phone%20screens.jpg)
![screens flatlay 300dpi_GREEN.jpg](https://static.wixstatic.com/media/debf5d_b3f76a78428740c68c2e2d66af0c4d59~mv2.jpg/v1/fill/w_980,h_825,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/debf5d_b3f76a78428740c68c2e2d66af0c4d59~mv2.jpg)
Moving Forward
I really enjoyed the entire process of this redesign - even more so because of my fondness for bubble tea (or boba, as the west coast calls it).
​
While this is a short and sweet passion project, it could definitely be expanded upon with more indepth research and testing. Moving forward, I would love to survey and interview different user groups to uncover pain points and areas of opportunity that I may not have discovered on my own. From there I would conduct multiple rounds of ideation and usability testing before converging into a more complete design solution.