Zhao Xue Portfolio
After graduated with a bachelor degree in Industrial Design, I worked on visual and UX design for more than 2 years, in which I picked up much experience in design. I recognized that design is not simple accumulation of functions, instead, it integrates user behavior and psychology with user experience throughout the design process. I love to focus on user needs and behavior, pay attention to communicating with user and learn more about the related knowledge. The accumulation of projects gave me an in-depth understanding that interaction design is not a simple presentation of visual interface and actions - it solves the problems of communication between people and things, which makes the products effective, easy-to-use and pleasant.
Name: Zhao Xue Mobile: +86 150 0104 1371 Email: sherryzhao25@gmail.com
About Me
Skills
Experience
Education
Rhino, Keyshot, 3Ds Max SolidWorks Photoshop, Illustrator, In Design Prezi Axure, Balsamiq Mockups Mac OS X, Windows, Office Sketching Photography
2012.8 - Now Interaction designer Beijng WeiReasearch Co., Ltd.
2007.9 - 2011.7 Bachelor in Industrial design North China University of Technology
2012.1 - 2012.7 User researcher Beijing Dongdu Technology Co., Ltd.
2010.10 - 2011.12 Visual designer Beijing Dongdu Technology Co., Ltd.
1
19
31
FAB Intelligent Community Terminal
Deer Jet Business Handicraft
Lenovo NBA USB Flash Disk
35
39
45
Wood Branches Stationery Combination
Sanlian Life weekly Lifeweeker
Some Graphic Design
5C Intelligent Community Terminal In 2012, I was as the main designer and collaborated with team members to design the interactive interface of community intelligent terminals for FAB Enterprise Group. In the period, I was responsible for the interaction design and the control over visual works. Besides, I communicated directly with the clients and successful completed the project jointly with the effort of my team members. Making user experience penetrate intro the entire design process not only solved problems, but also brought new design concepts to FAB.
1
Background Established in 2003, FAB Enterprise Group (“FAB�) is committed to providing Chinese consumers with copyrighted digital culture and entertainment products. FAB has become China's leading supplier of diversified products and services in the audio-visual, information and network market segments.
5C Intelligent Terminal FAB independent research and development of the 5C intelligent terminal is the core of the 5C digital project. Based on 55 national patents, it fills the gaps in the market of multimedia digital network terminal services. It’s the core platform of the digital culture project and communication carrier, as well as the perfect combination of multimedia and digital culture. Established on the concept of digital and fashion life and aiming at providing the public with a comprehensive and multi-information service system, the intelligent terminal integrate functions of e-commerce, download of copyrighted movies, songs and games, advertising, city information query, navigation search and convenient services. They also provide carrier and platform for the government to build digital and intelligent cities.
2
Project Process Interview Result Analysis Persona
Determine Needs
Stakeholders Interview
Concept Design
UX Design Principles
Determine Design Requirements
Determine Interview Questions
Layout Prototype Test
Phase 2
Phase 3
Phase 4
Page Framework
User Interview Concept Design Review
Phase
UE & Concept Design
Scheme Design
Visual Design
Phase 6
Final Review Design Scheme Review
Story Board
Survey & Research
Phase 5
Mood Board
Design Requirements Review
Determine Research Form
3
Design Output Refinement
Phase 1
Requirement Analysis
Design Scheme
Task Flow
Refine & Output
Determine Design Style
In the earlier stage, this project provides handy service for the public in the center of Wangjing Community in Beijing and develops two major functions: “Nearby Businesses” and “Property Information”.
Drink
Grain& Oil Cigarettes& Alcohol
Leisure& Entertainment
Important Notice
Property Advertisement
Property Information
Restaurant
Others
Hotel
Pay Water Charges
Convenience Shopping
Others
In later stage, it will gradually develop five functions: “Payment & Recharge”,“Coupon”, “Convenience Shopping”, “Entertainment Download”, “Hotline 96156”, depending on the business value injected by more merchants.
Snack Food
Pay Electric Charges
Payment & Recharge
Coupon
Life Service
Recharge Phone Bill
Sports& Fitness Parent-child Game Wedding Photography
Function of Intelligent Terminal
Nearby Businesses
Beauty Salon Shopping
Pay Gas Charges
Hotline 96156
Restaurant Leisure& Entertainment
Date Entertainment Download
Mobile Phone Software
Movie
Time Weather
Help Brightness
Music
Basic Information
System Settings
Greeting Vocie
Temperature
4
User Research
Consumption Characteristics
Target users are from 18 to 35. Allowing for the sensitivity of teenagers for interactive products and those in forties who work in high-tech companies, target users will upsize in the scope of age. Based on serving the public in communities, this program focuses on the housing community and divides the user groups according to age and activity scope. Different users pay attentions to different products functions. Meanwhile, the products they are using are also of different functions. Therefore, the design should be follow the properties of different users and their needs, which will contribute to product’s usability. We get knowledge of users’ characters and needs by interviews and establish four personas.
Trendsetter
Striver
Most of them haven’t worked for a long period or even have no job, but their power of consumption is good and they are fond of trend-setting products. What they value most is brand and price ranks the second when they shopping. Awarding points and discount can enable them to make unreasonable consumptions.
Most of them belong to the stay-at-home type of people, who are not willing to shopping in the mall even it is nearby. For them, online shopping is a good choice. Daily special price and flash sale favor them very much and those cheap and popular goods interest them mostly.
Achiever
Homemaker
As the pillar of the society, they have certain economic strength and pursue a high-quality life. They only buy high-quality and high-price commodities but make reasonable consumptions.
They favor long-lived commodities that have high quality and cheap price, like discount merchandises and enjoys stocking up goods. They only pay attention to the necessities of life and make no impulse consumptions to non-necessities.
Young
Striver
Name: Tommy
Name: Ben
Age: 24
Age: 26
Interests: music, movie, sports, food, party
Interests: surf the internet, online games, discount, stay at home
Activity: around the community on working day(supermarket, shopping centre); away from the community on weekend (restaurant, park, shopping centre)
Striver
Trendsetter
Trendsetter
Nearby Businesses
Gregarious
Coupon
Payment & Recharge
Payment & Recharge
Property Information
Coupon
Home Bird
Achiever
Homemaker
Achiever
Homemaker
Name: Fred
Name: Mary
Age: 35
Age: 42
Interests: automobile, photography, travel, wine tastings, nourishing of life
Interests: cooking, cleaning, health care, discount
Activity: away from the community on working day (restaurant, shopping centre); away from the community on weekend (suburb） Nearby Businesses
Old 5
Activity: at home on working day (online games); around the community on weekend (bank, property, supermarket）
Payment & Recharge
Property Information
Activity: around the community on working day (supermarket, go for a walk); around the community on working day (bank, property）
Property Information
Payment & Recharge
Nearby Businesses
Coupon
Projected User Scenario
Standby page of the community terminal... 2
Name: To
Hot Pot
mmy
Oh! An information? Let me see...
What’s that?
Age: 24 Tommy is a young m an play. He us ually goes who likes to KTV, mov to restau ies, sports ra field with nt, after wor fr k or on th e weekend iends Sometim es he need . s to view informat ion mobile ph about them, but th one netw e ork signal good... is not
Where shall we go? 1
1
He had used the community terminal last week... 2
Yeah, I can use it to find the restaurant around here~
3
Oh! It can choose the distance. Let me choose the nearest one...
After choosing a restaurant...
Enter the page...
Click the ‘Coupons’...
Enter mobile phone number...
3
4
Store more water for later use~
Oh My Gosh! Thanks to the remind message!
4
Hot pot, I’m coming! Hahaha...
6
The notification time is approaching... Cool~ The pictures can tell the truth!
5
Enter the content page... Great~~! I can also view other property information on this page~
5
It really comes in handy! I have extra water to use!
Name:
Wow！20% discount! I can save some money~~
Mary 2
Age: 4 6
7
nd she y. busy a il lly very re of her fam a u s u Mary is s to take ca e notice d e th e d n also ension n’t fin ly susp She did Once, e water supp tin board. e ll th u t b u y o ab unit comm us y... on the to tremendo ’s famil d That le ience to Mary n e inconv
6
Import Scenario Analysis Before the design of import interface, we make it clear as for what methods the users will adopt to understand and use the terminal: attracted by the machine, re-use, publicity or others’ introduction.
As for the import scenario, we mainly take into account sensory experience of users such as visual and auditory feelings, achieving the effect of guiding users to use by catering to their aesthetic appreciation. Subject to these factors, the users will be able to successfully enter the standby interface, to achieve our purpose of import.
Emotion/ Memory
Experience
lm
en t
Standby Page UX For the standby page, we have clearly stated its function and expression mode, and discovered problems that may be encountered by the users in the standby page and the corresponding solutions by interaction model and user needs analysis.
Fu lfil
In allusion to these four import methods, we have analyzed the measures that can be taken by each method. For instance, for the method of attraction, we have made analysis of the factors which can attract users, such as appearance, voice, logo, screen and information, studying the problems that result from these factors and putting forward solutions based on the interaction model.
Communication
Information Accessment
Interaction Model Beautiful Beautiful
Legibility
Staffs Legibility
Volume
Attraction Legibility
Appearance
Outside
Import
Logo
Import
Volume
Screen Information
Family
Introduced by others under known or unknown
Define Functions
Random Content Presentation
Have ever used the
Import
Introduce Memory
Screen Savers
Positioning
related or other functions
Friends Volume
Re-use
7
Broadcast Advertising
Legibility
Not long ago
Continuity
Attraction
Neighbors
A long time ago
Operability
Attract Attention Standby Page
Import
on the vending machine
Volume
Positioning
Vending machine
Voice
Placement
Beautiful
Advertising
Legibility
Speech Presentation
Expansibility
Legality
Beautiful
Operability
User Needs coupon
Needs Analysis
recommended store
store & product introduction
After the interview, we will make a summary of needs and classify those needs based on the Kano Model so as to continue subsequent design works.
repayment
network signal is not good
Satisfied
differences between similar products
Interface Optimization store address
store phone number
important notice pay water& electric charges
fast identification
clear information
recharge card
don’t know keywor can’t seards ch
weather increase user viscosity
time
greeting
Indifference
function prediction
expansibility
extensibility
store evaluation
Home Page Information
an better th ive competitts produc
Attractions
store & product pictures
property information
Attractions
search
ranking list store name
business hours
Competitive Needs
Attractions
group purchase
clear function module show next content
appropriate size of controls
legibility
reduce the level of pages
display more information in one level
simplify proces
good tactility
avoid user waiting
easy navigation
intuitively display easy to use
concise style
p dragogor g effecin t
easy operation
low sensitivity sliding screen
attract user
clear navigation
Linear Need not Fulfilled
Need Well Fulfilled
Basic Element
the latest informat ion ranking list
Linear
Basic
Fundamentals
voice
colour
Fundamentals Dissatisfied
Kano Model
brightness
affinity
The overall information User Experience Organization of information
Users’ maximized appeal for the function and performance Complex interaction and presentation of information The usability, ease of use, durability, robustness, extendibility of information and interaction flow
Layout
8
Design Criteria
Accessibility
Expansibility
The addition of other functional modules in the later stage will not disturb the existing visual system
Adaptability
Pleasure
9
Can adapt to different indoor light environment and space size.The interface colors and information can keep clear
Can allow user to has a pleasant feeling in the use process
Legibility
Usability
Should be applicable to all potential users. We should take into account the special user groups' habits, such as for color blindness, color weakness, the elderly, etc.
Interface Design Criteria Before we start designing, we clarify the criteria for design and the interface strategy of this project. Also, we have to study the design criteria to be followed by each page
1 Can allow user to identify each function module quickly
Can allow user to complete operation clearly and fulfill their requirements
Legibility
Affinity
Standby Page
2
Extensibility
Simplify
Home Page
3
Function Page
4
Content Page
No ambiguity
Reasonable layout
Reasonable layout
Reasonable layout
Can attract user
Can add other functions at the later stage
Can add other contents at the later stage
Easy to update
Can display the function
Function need to have obvious characteristic
Comprehensive and clear function
With clear information
Should accord with the overall visual style
Unified style
Clear navigation
Beautiful
Simple and beautiful
Unified style
Unified style
Simple and beautiful
Simple and beautiful
Clear navigation
Ideation
Standby Page
We write down stakeholders and user needs, and place paper as terminal interface in different regions before the design of page layout. The integration of functions and information is considered to better adapt to paper sizes.
Through analysis, the major function of lock screen is summarized as attracting users and displaying functions. In the design procedure, dynamic effect is also considered. Meanwhile, some real time information such as time and weather information as well as modules for tips are added.
Home Page Homepage is the main page, including seven function modules. Due to the differences in user groups and using frequencies, the modules have different positions and sizes. In the design procedure, a host of studies of the size, distances in between, integrated relations, display form and other aspects are conducted to increase the module resolution and to bring joyful experience for users.
Coupon Nearby Businesses
Functional Module
Property Information
Basic Information
It is the key point of our design to make modules of different functions integrated with the overall style on the premise of maintaining their own features. Property Information function is the key point of the program. We are hoping that we can distinguish the importance of each function according to the different sizes. Latest information will be displayed on the module of the first page.
Payment & Recharge Hotline 96156
Content Page This page is used to fully display contents. It is also expected to be as simple in operation as possible. So the third-layer page and parts of the second-layer page are integrated to optimize user’s experience.
Entertainment Download
System Settings
Convenience Shopping 10
Mood Board Before the mood board is created, we did brainstorming based on explicit interface design principles (affinity, simplify, extensibility, legibility), classifying all derivative keywords into vision, mentality and physical expression, and finding corresponding pictures to exemplify the abstract words from the perspective of users and apply them in visual design.
Extensibility
Affinity
Simplify
11
Legibility
Affinity Color
Extensibility Shape
- Soft, warm, no stimulation
- Elastic, soft and round
- Mostly the same color, low saturation
- Irregular shape with tension-free or regular shape with small tension is preferred Resizing shapes and changing the space between them can reduce stiff feeling.
- The overall color should be harmonious and unified
Material - Tend to be warm, natural and downy Like scarf, cake, fluffy hat, fabric sofa, carpet, towel, etc. It can be appropriate to add these materials if necessary, but do not overuse them in the interface.
Color - Should have the characteristics of serialization - The same saturation - Easy to add a new color
- Can add quasi materialized design Using the shape of real object in life, that can close distance between users and product.
Color
- Mostly light or solid color High purity color gives a strong visual impact, that can only be used in local area to attract users. - Use as few color categories as possible on the same interface
- Convex-concave Through the edge connections to improve extensibility and bring modules into close association. Such as puzzle, tetris, gear, building blocks, etc. It can add other functional modules at the later stage without destroying unity.
Material - Flat, wide, broad and extensive Do not necessarily need to add concrete material for the interface. Minimize the use of material and details expression. Solid color, no gradient, no shadow and no high optical is perferred. Use the same material like wood, paper, metal wire drawing, that can make the interface more extended.
Legibility
Simplify
- Fresh, natural, vitality, and do not make public
Shape - A series of the same shapes
Shape - Basic geometries Such as streamline, circle, square rectangle, line, etc - Must be united Use as few shape elements as possible on the same interface. The arrangement of shapes should be unified.
Material - Pure, clear, natural Minimize the use of material and details expression. Solid color, no gradient, no shadow and no high optical is perferred. Do not use the disordered materials. Use the same or similar elements can make the interface more simplified, and that will bring a good user experience.
Color - Tricolor or strong contrast colors The color has the difference in hue, lightness, purity. - Has an explicitly orientated
Shape - Mostly representative, concise, recognizable symbols Select the unique shapes or details and refine the characteristics to generate module or icon.
Material - Can be used as a light source, silky smooth surface - Can add quasi materialized design Using the material of real object in life appropriately, that can make interface easy to identify.
Manipulate the horizontal and vertical spacing between shapes.
12
Scheme 1 Round shape represents the reunion, the success, symbolizing the expectations of the people for a better life. The round design elements and page layout is extracted from galaxies in the universe, showing the symbol of nature and harmony, and indicating that the community service commits to provide a better living environment for residents. What is more, the round shape makes the interface more user friendly.
多云 -7°C~-3°C
Important Notice
Product Information
Property Advertisement
返回
返回
首页
吃喝玩乐 | 餐饮美食 | 休闲娱乐 | 购物达人 | 丽人美体 | 婚纱摄影 | 亲子游戏 | 运动健身 | 酒店住宿 | 生活服务 |
外婆家
外婆家 人均￥93
Home Page
火锅
850m
外婆家 850m
外婆家 850m
火锅
帮助
Nearby Businesses Category page
13
声音
850m
人均￥93 火锅
850m
外婆家 人均￥93
火锅
850m
外婆家
外婆家 850m
人均￥93 火锅
人均￥93
人均￥93 火锅
850m
外婆家 850m
外婆家
外婆家
人均￥93 火锅
人均￥93 火锅
人均￥93 火锅
850m
外婆家 人均￥93
火锅
外婆家 人均￥93
火锅
850m
人均￥93 火锅
850m
亮度
Nearby Businesses Display page
Business Information
Product Presentation
360 Degree Panorama
Interface Design Frequently used information conclusion Information such as the time and the weather is located on the top left corner of the page, leaving space for visual focus and easy to see.
Rapid access to function modules Modules are displayed in circle in accordance with the overall roundness style. Directly click the inner information on the modules, and enter the content page. Modules are easily to be differentiated.
Integration of function modules according to the user needs Payment & Recharge modules are separated according to what are paid for. User operation process is optimized and easy to be identified.
The major modules are designed with larger size to attract user. On the home page, user can learn about important notifications.Click and enter next page to view details to optimize user operation process.
14
Scheme 2 Final Scheme
Square symbolizes the strictness and calmness, representing the unity of the form. The inspiration comes from the bulletin board in real life, and it meets the users' psychological demands and habits. In addition, the square design is visually simple and more intuitive and efficient in conveying information.
Important Notice
Property Information Category page
Property Advertisement
Nearby Businesses Display page
Business Information
Product Presentation
Home Page
Product Information 15
360 Degree Panorama
Interface Element 2013-01-24 星期四
吃喝玩乐
缴费通道
有想吃想玩的么？快来这里 查找一下周边的好去处！
不想排队？不想请假去银行？ 轻松缴费就来这里吧 ...
北京
24 -7°~-3° 多云
水 费
电 费
燃气费
农历 腊月十三
餐饮美食
25％
010-82120966
50％
用户登录
周一至周日9:00-22:00 75％
100％
海淀区科学院南路44号华星影院1楼 距您的位置850m
登 录
不同模块颜色：
注 册
Adopting simple pure color design in the visual style, while weakening the sense of interface and highlighting contents of scripts and pictures allows users to receive information more intuitively. Through strong constitution to create a plane aesthetic feeling which can be interpreted as having bright and soft blocks of color as well as tidily arranged shapes. In addition, system resources will occupy less but respond more rapidly.
Interface Design Create business express entry on demand Create express entry for the most common business types on the home page. Users can quickly access businesses for dining, entertaining and shopping on the home page, saved from entering secondary pages to choose business types.
Easily discernible function modules
Maintain interface expansion The home page includes seven functions, whose modules should be designed to be square so that further modules can be added. Those modules are distinguished by colors but harmonious with the same lightness and saturation.
Function modules are independent from each other and characterized by pictures’ switching, icons and texts, so that can easy to be identified.
16
17
18
19
Deer Jet was first established in 1995 as one of the key subsidiaries of the Hainan Airlines Group, China’s fourth largest commercial airline. Deer Jet provide a variety of services, such as business charter, aircraft management, ground handling, aircraft sales and medical evacuation.
NOBLE
EFFICIENT
At the early stage of the project, the client needed to design a VIP card which could be used both for recording membership information for identity authentication, and for collection and giving as presents. The VIP card should manifest the distinguished identity of the members and at the same time inherit the image of the brand. After a series of research and digging deeper into the client's requirement, I have found that the essential requirement was to convey the connotation of the product, that is, the client wanted to emphasize on the product's being the symbol of identity and the brand, instead of the form of the product.
EXCLUSIVE
Design Process
Orientation
Design
Production
Submission
Brand Feature Brand Essence
Username Signature
Functional Relationship
Decoration & Usage
Engrave
Pure
Exclusive
Brand Image Communication
Unique
Environment Material
Appearance Process Requirement
Noble Decorative Detail Ceremonial Magnanimity
Material Selection
Material Selection
Username
Streamline
Sense of Ritual
Decoration &Usage Smooth Surface
Signature Engrave
Environment Material
Generous Shape
Efficient Comfortable Experience Brand Image Communication
Smooth Surface
Unique
Purity Appearance
Functional Relationship
Generous Shape
Comfortable Experience
Etiquette & Bearing
Decorative Detail
Process Requirement
20
Market Research Card
with the product
card cover
Bank cards, membership cards and consumer cards are required to be carried and shown during settlement.
Common market membership cards are mostly plastic or metal with different printing techniques and patterns, difficult to distinguish their grades.
card cover
custom packaging
Traditional membership card packaging is hard to highlight the noble status of enterprise services and holders.
Results As a symbol of service and quality, Deer Jet VIP Card is not used for data transmission, no need to carry it around. It does not have to be designed in a traditional card type. 21
Packaging Material Rigid Package
Metal
Wood
Packaging Style
Flexible Package
Plastic
Paper
Fabric
Leather
Through a research on the packaging boxes of high-end products in the market, a conclusion is reached concerning the materials with high usage rate: metal, wood, plastic, paper, fabric, leather. Apart from single material, some packages also adopt the design of multiple materials, for instance, paper and fabric, wood and leather etc., which not only serves as the finishing touch, but also helps to save materials and cut costs. The lining of the packaging boxes is mainly velvet or sponge, which acts as the buffer. The research result is also categorized based on the style of packaging and common opening methods are also summarized in the paper.
Modern & Fashion
Opening Method
Simple & Elegant
Intricate & Refined
up & down
left & right
push & pull Traditional & Classical
22
IDEATION Through investigation and analysis of the brand, logo, high-end crafts and packaging, then identify the design location. According to the brand essence, we design different schemes of product and packaging.
23
Scheme 1 Brand Image Communication
The card selects and uses high-grade leather with bright colors, emphasizing honorable and comfortable user experience, and the hot press technology presents the brand image.
Environment Material
Sense of Ritual
Generous Shape
Material Selection
Comfortable Experience
Smooth Surface
Etiquette & Bearing
Purity
The metal material starts from the function, and the cold punching technology records the Vip exclusive number.
This is a design scheme starting from the brand sense of ritual. All the materials of the whole series refer to the materials within business classes. It synthesizes the material and techniques to extrude the sense of quality, using metal and leather materials as a contrast.
Packaging The packaging box is designed with up-down structure, which enables the member to extend hands into it from two sides and thus highlights the ritual of actions. size: 170*170*55mm material: leather (print logo) + sponge cushion
24
Scheme 2
Sense of Ritual
Concept
Functional Relationship Decoration &Usage
Etiquette & Bearing
Purity
Decorative Detail
Process Requirement
acrylic crystal
metal or ABS matches well with the pseudo-metal surface high-density plastic + pseudo-lacquer surface
This is a design proposal with an emphasis on the etiquette and bearing of the brand, referring to the waist-band styling of traditional crafts, which manifests the special status of the user and ensures the functionality of the products. Special emphasis is given to the details of decoration and there are also high demands for the craft.
Packaging Draw on the traditional gift box embodying social etiquette and reflecting oriental taste.
25
size: 150*100*70mm material: high density board / dark solid wood
Sense of Ritual
Concept
Scheme 3
Username
Etiquette & Bearing
Engrave
Based on the above two schemes, we select the design scheme with bold attempt to focus on the performance of the brand purity. The membership card is no longer of a simple function, but equipped with a decorative function and use function at the same time. The seal, as the concept of intention, inherits the traditional noble authentication mode, with VIP name engraved at the bottom. Giving priority to the image, the design combines with sculptural techniques to show the beauty of structure, and extracts the pure decorative effect.
Unique
Purity Signature
Appearance
black sponge pu leather embossed logo
black plastic
Packaging classic portfolio of handbag + gift case, products highlighted in dark internally. material: paper+ sponge cushion
Vip number Vip name
size: 60*80mm acrylic or high-density plastic 26
Packaging 1 The internal structural design highlights the multiple layers and exhibits a ceremonial formality. Material: white special paper + dark gray EVA Foam
2 The internal space reveals the nobleness of the product. Material: black cardboard + EVA Foam + silk
4
3
The opening mode endows the package with a three-dimensional touch and has a feature of demonstration. The liner EVA has a particular angle of inclination, which allows the product to be placed more stably when opened in a vertical manner. Material: black cardboard + EVA Foam + silk
Based on the Oriental elements, the red brocade is attached to package, that makes simple and generous. Material: cardboard + red brocade + EVA Foam 27
1
The type setting is simple, and the change of size regarding the picture and the blank form a kind of rhythm, with due attention given to both the whole and details.
Product Brochure
2
It follows the previous designing style of the manual, with the whole-page picture demonstrating the focus, which displays a graceful and comfortable service experience.
3
4 The navigation bar is set at the left of the page, so that the structure of the brochure looks clearer and readers can search content easily. Besides, those crossed lines symbolize that Deer Jet provides abundant air lines for customers to choose from.
The well-chosen pictures are decorated with simple but elegant text boxes, which make the brochure seem a package of hardcover travel postcards. 28
Production
29
30
31
32
33
34
35
36
37
38
Social Media for iPad app Lifeweeker is a sub-branch of Sanlian life week, and the main products include web sites and apps. It is a social networking media based on the form of calendar, with which users can make arrangements on their time and agenda, record moment of life at any time, share fun in lives and be informed about their friends’ schedule and lives. This project is aiming at developing the Lifeweeker App of ipad version.
39
In the project, I was responsible for the visual design of the product. Considering that the product was a social networking platform based on schedule management, I chose the schedule book people use every day as a visual image, restored real scenarios in the interface, reduced the usage difficulty and eliminate users’ psychological barriers to add intimacy. In dealing with colors and details, I tried various options and finally selected a simple pure color manifestation to weaken the differences among user groups.
USERS
CALENDAR
CALENDAR
CALENDAR CALENDAR
Combining with product positioning, the colors of brand identity are chosen as the main color. Employment of sundry colors is avoided, following the principle of simplicity for User Experience. Thus users can easily get access to proper operation. Due to the broad scope of user groups, that can also weak the differences among user groups.
Final Scheme
TRODITIONAL SCHEDULE
LIFEWEEKER
Other Scheme
This App contains functions as books and photos sharing, calendar reminding, friends making and interacting. Users can not only share their moment of fun lives and find friends with similar hobbies, but also keep in touch and collect books and cultural resources with high qualities in Sanlian.
1 WHAT CAN USER DO WITH LIFEWEEKER?
Arrange Schedule Follow Friends Organize Activity Write Log
浅色多孔
Post Article Initiate Discussion Share Collect Books
2 WHAT IS THE PRODUCT POSITIONING?
Young lifestyle
High-end cutting-edge 40
- Several revisions are made to unify control styles and eliminate visual effects such as shadow and gradual change to pure color, weakened sense of interface and highlighted text and picture content, so that users receive information more directly.
Control - Initial Scheme 新鲜事
今天
- Control sizes of the same category and level are unified. Their sizes are designed according to their significance to catch users’ attention as well as large enough to be touched accurately.
ｉ
我的日历
- Every control is designed to have different states with details directing users to click so as to optimize users’ experience.
联系簿
封底小袋
确定
取消
Control - Final Scheme 新鲜事
新鲜事 normal
Final Scheme
selected
我的日历 写日记
写日记
normal
down
收藏小袋 normal
selected
notice
关系中心
normal selected
评论 (24)
41
Other Scheme
Wireframe LOGO
写日程
23
xxx xxxxxxx 新鲜事
星期三
23 24 25 26 27 28 29
今天
关系中心
密码
xxx
xxxx xxxxxxxxxxxx
xxx
xxxx xxxxxxxxxxxx
xxx
xxxx xxxxxxxxxxxx
xxx
xxxx xxxxxxxxxxxx
xxx
xxxxxxxxxxxxxxxxxxxxxx
xxx
xxxxxxxxxxxxxxxxxxxxxx
12月
xxxxxxx
16 17 18 19 20 21 22 30 31
写日程
xxx
2 3 4 5 6 7 8 9 10 11 12 13 14 15
2010年 12月23日
新鲜事
MORE
切换 列表
日程
收藏小袋
账号
一 二 三 四 五 六 七 1
全部 主题
我的日历
LOGO
写日记
今天
一 二 三 四 五 六 七 1
星期三
16 17 18 19 20 21 22
2010年 12月15日
23 24 25 26 27 28 29 30 31
MORE
切换 列表
星期一
星期二
星期三
收藏小袋
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxxxxxxxxxx
2 3 4 5 6 7 8 9 10 11 12 13 14 15
今天
全部 主题
我的日历
日记
写日记
星期四
星期五
星期六
星期日
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
关系中心
记住用户名和密码
登录
xxx xxxxxxxxxxxxxxxxxxxxxx xxx xxx
xxxxxxxxxxxxxxxxxxxxxx
xxx xxx
Log in
Collection（calendar）
My Calendar(Date)
Visual Presentation iPad
8:35 PM
iPad
8:35 PM
iPad
写日程
Amma @北京 东城区
新鲜事 我的日历
23
关系中心
星期三
BIGDAY
Big-day 小组成立周年纪念
BIGDAY
Big-day 小贝的生日
全天
全天 主编朱伟开微博了
全天
全天 主编朱伟开微博了
11:00
@北京 东城区
2 3 4 5 6 7 8 9 10 11 12 13 14 15
2010年 12月23日
全部 主题
10:00
写日程
Amma 一 二 三 四 五 六 七 1
今天
16 17 18 19 20 21 22
新鲜事
23 24 25 26 27 28 29 30 31
MORE
切换 列表
今天
日程
收藏小袋
8:35 PM
写日记
我的日历
一 二 三 四 五 六 七
12月
1
今天
2 3 4 5 6 7 8 9 10 11 12 13 14 15
星期三
16 17 18 19 20 21 22
2010年 12月15日
23 24 25 26 27 28 29 MORE
切换 列表
星期二
星期三
收藏小袋
手镯“非洲”——非洲位于世界的中心。
30 31
全部 主题
星期一
日记
为了纪念“滚石”乐队在今年5月中再版发行唱 片，音乐杂志新期再次将这支传奇的乐队搬上了封 面。1971年“滚石”乐队因为逃避英国政府查税而 呆在法国南部的一栋豪宅，在女人、大麻、音乐的混 合派对中，制作了这张伟大的唱片。和滚石乐队颇有 渊源的作家借着唱片再版的机会，再次和滚石的成 员回忆起那段嬉皮岁月。为了纪念乐队在今年5月中 再版发行唱片，音乐杂志新期再次将这支传奇的乐队 搬上了封面。
写日记
星期四
星期五
星期六
星期日
1
2
3
4
5
关系中心
手镯“非洲”——非洲位于世界的中心 8AM-8:30AM
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
12:00
下午一点钟的部门会议 13:00
14:00
如果爱思想聚会——《三联生活周刊》
M
15:00
iPad
iPad
iPad
16:00
In the process of transforming wireframe into visual presentation, I made some adjustments. In order to harmonize and unify the overall style, the rectangular control was changed into rounded rectangle while dividing lines were added for some controls to render each functional area of the interface distinct. Appropriately adjusting the size of the interface elements makes the product easier to use.
42
iPad
iPad
Main Interface
Write Message
iPad
Private Message
iPad
iPad
System settings
Log in
Log Contents 43
Write Schedule
Write Log
Select Theme
CALENDAR
Collection（calendar）
iPad
iPad
iPad
iPad
iPad
My Calendar(List)
iPad
My Calendar(Date)
iPad
News
iPad
iPad
Notice
Collection(List)
Friends
On the accomplishment of the project, San Lian Life Weekly participates in the Beijing Culture Expo (ICCIE) with its products, drawing attention of the media and all walks of life. 44
After field visits and investigation, Yungang Buddha, mostly characteristic of local culture, is selected as logo body with flame pattern and lotus image added to its solemnity. 03
01
02
01-02
45
06
Poster of “capital of China sculpture Tatung 2011 international sculpture biennial festival”
03
Letter paper and envelope design
04
Logo design
05-06 05
04
Poster design of “Changsheng Fund”
1 4
2
5
3
Juice Bar Logo The inspiration derives from people’s pursuit of delicious food. Based on the elements like water drops, shape of grasping juice with hands, facial expressions, as well as the brand attributes, five designs are produced which express the youthful vigor of the brand and stimulates consuming desire. 46
C:5
M:23 Y:90 K:0
C:8
M:18 Y:43 K:0
C:4
M:51 Y:90 K:0
C:13 M:43 Y:85 K:3 C:5
M:95 Y:87 K:0
Snack Festival & Folk Association Logo - The overall design chooses traditional Beijing folk food cultural elements and highlights snack festivals with bright colors.
C:14 M:69 Y:33 K:3 C:2
M:24 Y:37 K:0
C:16 M:91 Y:15 K:1 C:45 M:11 Y:89 K:1 C:78 M:27 Y:83 K:12
47
- Lotus and Yinding Bridge in Shichahai are used as main visual images, and characteristic Beijing paper-cutting style is adopted to stress humanistic feelings.
C:4
M:51 Y:90 K:0
C:4
M:51 Y:90 K:0
C:40 M:65 Y:90 K:35
C:19 M:100 Y:87 K:11
C:35 M:60 Y:80 K:25
C:0
M:0
Y:0
K:0
Blind Theme Experience Activities Visual Identity How to keep brand influence as long as possible with short-term seasonable activities? After design the logo for SID, many derivatives are designed in accordance with clients’ requirments to promote brand image. 48
01
02
03
04
01
05
F1 Racing Driver Ho-Pin Tung Business Brochure
49
06
Thank You For Looking
Zhao Xue Mobile: +86 150 0104 1371 Email: sherryzhao25@gmail.com