UI refresh & design guideline create
Global VR content community
VeeR VR - V 2.0.6
Overview
VeeR VR is a fast growing up virtual reality video sharing company in China; we target the over 150 countries users who interesting in sharing 360 content and creating content. I joined VeeR VR as a product designer to be responsible for UI refresh and design guideline creative.
Why do we need to upgrade the VeeR brand?
We think the future is an era when people use VR to communicate. They will use 360 videos/photos are necessary elements, with interactivity and other types of media(audio, 2D media, 3D objects.) and create a more immersive and rich experience in VR. We propose this brand update can let user has a new experience for VR.
We hope this new product upgrade can
Users
-
Have opening feeling ;
-
Have consistent experiences with different product lines;
-
Lower the barrier;
-
Highlight contents.
Product
-
Video community upgrade to contents community;
-
Reduce development costs;
-
Have a consistent look and feel across different product lines;
-
Highlight our mission: Empower everyone to create and share content;
-
Highlight the value: Fun, Empowering, Curious, Open, Supportive and Dynamic.
How did we do the new UI refresh?
Process
Based on our product mission and value. We created a few mood boards to concrete our direction. We hope our new product refresh would highlight "Fun, Empowering, Curious, Open, Supportive and Dynamic."
We explore more about different mockup try to highlight the content. Also, we got feedback from earlier stage user test, built-in test. On the other hand, we start to create a design guideline try to normalize our design to attach our goal for this product refresh.
What is UI design guideline？
This UI library was designed by VeeR to upgrade the product image. The inspiration for the design is to simplify the sophisticated color of the interface and make the visual orientation clear. Improve user's usage correctness and better guide users to understand and operate VeeR app.
The library intends to help us design, pitch, and build amazing applications. We've focused on balancing ease-of-use with accuracy — while some aspects aren't 100%, they are made to be reusable by reducing them to the minimum number of layers.
The structure of UI design guideline
What is a structure of UI design guide line？The components attempt to cover as many of the standard UI elements within the OS as possible, including renderings of the phones themselves? Below that are operating system level screens that are common outside of individual app experiences. Also, the bottom of the page flows through universal apps for reference and use.
The components attempt to cover as many of the standard UI elements within the OS as possible, including renderings of the phones themselves. Below that are operating system level screens that are common outside of individual app experiences. Moreover, at the bottom of the page are flows through universal apps for reference and use.
A Sketch GUI of elements
Made by the VeeR Design team
STYLE GUIDE
APP SCREENS
DETAILS
PADDING
