Yahoo App Design

Clients

Mytreat- 送給你最重要的那個他

Category

Branding, UI/UX, Visual Design, Research

Posted

Dec 30th, 2017

Product Introduction

Yahoo奇摩 - 直播Live、即時新聞 is a content platform which can provide important information you need in your daily life. I was honored to be a part of this flagship app which is the Yahoo!’s first bundling mobile app. Besides providing valuable proposals at high-level meetings and reached a consensus, I was in charged of visual design for defining visual personality, also design guideline for this app.

You can download it here.

Insight

Inspirations of Yahoo App came from user’s insights. People need for multiple perspectives and selected contents. Our goal is to connect people with the valuable information they need in daily life. It’s a first app combined all important contents together, so we did the user study to hear user’s voice and found out the best solution.

Principle
Design Process

To find the highlights, we Initialled a design sprint workshop to run an effective design process for the project owner, project manager, tech lead and designers.

Sketch+Wireframe

After the workshop, I have to convergence all ideas to the possible proposal, we discussed with core team members and drew a lot of sketches and wireframes. We have sync up many times to come out the final Information Architecture then go into the visual design part.

Guidelines & Design Language

I Defined visual personality, also design guideline for Yahoo app. To create visual mood boards and define color palette, I consulted with our staff visual designers and presented them to our stakeholders for feedback. I also delivered the consistent user experience. To ensure the final implementation of other team members following the guideline, I had to communicate with cross team members and convince them with my clear design thinking.

Brand new home tab

You can know the most import things at Home tab such as big news, warnings of weather, real-time sports score. You can also enjoy the soft contents and location-based suggestions.

Emotional Design - Weather & Event Theme

As a user, you can see different animations that depend on the local weather. I implemented a smooth and dynamic user interface animations which can delight users.

I had created animation with “Adobe After Effects” and I cooperated with engineers with Lottie to make the perfect results. I am the first designer who imports the Lottie library into the whole Yahoo! mobile design team.

Overall impact in this project

Througn the yahoo app design, I sumed up all elements including media and e-commerce products. I discussed with other designers and made the product more consistency. Even though Yahoo app was built based on our design language, I contributed other outside elements back such as tutorial and tooltips. Furthermore I also improved the working models with engineers which could add surprises to impress the users.

Similar Projects