Weshow

Mobile Video Editing and Sharing APP
Major design revision
May 2014 - June 2014
Tencent Technology co. LTD. Beijing
Product:
Weshow
Type:
Mobile video Editing and Sharing APP
Duration:
6 Weeks
My Role:
Visual Team Leader and Manager;
Chief Designer
Team size:
8 visual designers

Background

Based on the existing interaction design of APP WeShow, we overhauled the whole visual design, including the style, color, texture, and icons, etc., in order to meet the users’ increasing demands for more dynamic and energetic appearance. Moreover, to ensure the product’s competitiveness, the whole project had to be done within 6 weeks. Considering the huge quantity of widgets, icons, and pages of the APP, the project management had to be efficient and effective.

Keywords

We investigated a certain number of active users of the APP, who were representative in many aspects, such as their ages, jobs, locations, frequency of use, etc. Meanwhile, we interviewed several experts of visual design in the industry, and collected and summarized their feedbacks. Their opinions laid a solid foundation for our further discussion and the decision of the following keywords.

Drafts

Since the APP had already been running for around a year, the main users were familiar with the dominant tone, which meant the new characteristics should be based on the existing dominant color. In this stage, while nearly half of the team members were focusing on the daily operations of the former edition, several experienced designers in the team began to try brand new ideas and styles according to the key words.

Final Version

After three rounds of meetings and discussions about the drafts, the final design was decided. During the following days, the main pages were designed and endorsed by the main designers and senior project managers.

Illustration of the homepage

Homepage is the most complicated and important page in the whole APP. It includes two kinds of feeds—original ones and reposted ones. Moreover, every single feed contains 4 parts of information— details of the publisher, the video, information of the video, and operations related to the feed. In order to show the hierarchical relationship between all the different areas of information, and keep the whole design lively and concise, the visual design should be straightforward and clear. Finally we solved the problem by elaborately selecting and using several main colors to divide areas and keep them harmonious, qualifying the use of lines, making white space as a vital element, reducing the use of texture, etc. Thus, although there is a great amount of information to be showed on this page, the visual design enables to keep it simple and explicit.

Guidance of Visual Design

Since the goal was to accomplish all the redesign with in a limited time period, which necessarily asked for teamwork. This made the guidance of vital importance. In this stage, the chief visual designer decided the guidance of color, widgets, and icons of the main pages, while the other members in the team followed suit and did the remaining pages and situations.

Colors

Icons

Widgets

Video

This video shows the major functions and flow of WeShow, which basically means sectional shooting video, editing video, beautifying it with filter, etc.