top of page

Nokia X Design Language

Nokia X is a customized platform built on the Andriod Open Source Project (AOSP). Some of popular smartphones are based upon the software for millions of people for everyday use. 

 

When I started this project as a visual design leader, I set up clear rules to proceed and archived to raise the level to a certain point of unified looking and overall usage.Asymmetrical layout, flush left elements, mathematical grid system, extreme geometric reduction, and flat areas of colors were studied and organized into design guide to follow. I was also responsible for general user experience formats: grid system, glance, lock, home, music, gallery, camera, contacts, call, message, alarm and calendar view. 

Full.jpg
White.jpg
blue.jpg

General Components

General Components define overall aesthetics  and identify the components of forms, recognize their function, and how to use them effectively of the front end of any user interface. Visual treatment of interface elements is perceived as the General Components. The purpose of General Components is to use systems and visual elements like colors, images, layouts and etc…to convey a message to its user.

General-Component.jpg

Glance Screen

Glance screen is the topmost layer in the smart phone. It is shown whenever the display is locked, therefore it is important for user to enjoy the most frequent view of the phone. Glance screen shows the current time and notification icons telling updates to the user. For best legibility for a glance, huge size font and solid-grid system is used to design for user's convenience.

Lockscreen_5.png
Lockscreen_2.png

Home Screen

Home is a user-customisable view that contains:
App shortcuts
Folder shortcuts
Widgets
User can personalize the Home screen in the following ways:
Reorder the items.
Add and remove widgets.
Add and remove app shortcuts.
Resize the app shortcuts.
Resize widgets (if enabled by the widget).
Change the app shortcut background color.

Home_3.png
Home_2.png

Contacts & Call

Contact_1.png
Call_3.png
Call_2.png

Alarm

As a designer, I tried to avoid realistic representation of object, because it may cause other prejudice in human perception to come through the final image. Using the theory of amplification through simplification, the alarm clock was designed only using geometric abstraction and color, but to use metaphors of the time of present.

Alarm_6.png
Alarm_5.png
Alarm_3.png
Alarm_1.png

Message

Regular conversation bubble was abstracted into solid, bold line for a clear distinguish between sender and receiver. Line colors come from the initials of contact’s name from the phone address. Tips of message box pointing left and right create an environment of more casual setting than rigid pointing down tips.

Message_1.png
Message_4.png
Message_3.png
Message_2.png

Calendar

Calendar_6.png
Calendar_5.png
Calendar_4.png
Calendar_3.png

Time Picker

picker_2.png

Volta Mitte

The objective was to create a series of posters, which display the architecture of Volta Mitte, a new mixed-use urban planning project in Basel.

Each poster displays a different theme using distinct shapes and a custom typeface based on the triangular architectural elements of Volta Center, a residential building within Volta Mitte’s campus. 

bottom of page