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. 

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.

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.

Home Screen

Home is a user-customisable view that contains:
App shortcuts
Folder shortcuts
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.

Contacts & Call


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.


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.


Time Picker

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.