Portfolio by Gechang

少侠江湖风云·引 走江南，跨神州，手捏说书板； 道不尽江湖事，说不完江湖人； 今日且听传奇少侠的江湖风云！

所从何来 此少侠，名葛唱，女汉纸一枚, 星城湖南大学学艺，入交互设计门， 师从何人可大师，修习研究生课程， 将于2016年正式踏身社会江湖

强

所经历之 2015.5－至今 实习·交互

阿里巴巴国际UED－AE卖家组 2014.10-2015.02

实习·交互

网易市场与渠道事业部设计中心移动组 2014.03-07

项目·交互/平面

LG·掌上新玩意手机设计创新工作坊 2013.09-12

项目·品牌/平面

LG中国品牌产品形象与趋势研究项目 2013.02-07

实习·平面/交互

海森设计有限公司（长沙） 2012.09-12

项目·人机

三一虚拟手势交互界面设计工作坊

所怀绝技 经师门之教导， 历江湖之闯荡， 练就如下之绝技： 富有创造力 激情 乐于实践 具备大局观念 逻辑思维能力 沟通协调能力 文字表达能力 行动执行能力 自我管理约束

风云之役 当是时，光明顶，明教伤残无数，几近油尽灯枯，但见一少侠从天而降， 飒飒之英姿屹立，长剑祭出，斜指长空，长发无风自动，剑气倾泻四溢， 众人皆感郁郁压迫，少侠以一己之力与智，顷刻危机解，生灵免于涂炭

未完待续 预知后事如何 抑或欲结交风云少侠， 请联系：

1175145446 15211017820 gechang_hnu@163.com

2014

INTERACTION DESIGN

PORTFOLIO GE CHANG

Smart Phone

DESIGN RESEARCH FROM SERVICE

TO UX & THEME

In 2014, Smart Phone Design Research is a project commissioned by LG. It aims to design mobile phone applying to China market in next one to three years through research on business model in Internet Age and Chinese users’ lifestyle, which supports LG’s design strategy and product development in China and even the global.

The output of the project is five complete sets of phone design based on the real demand of five types of people. I am resposible for one set for the ‘busy and productive’, including early investigation, user research, interaction and visual design of the UX and theme

12:30

旅行 33

购物 豌豆 西红柿 胡椒 竹笋 ......

UX

Flow Key Value

Theme

UI Style Styling CMF

起床

07:00 08:00

带旺财散步

08:00 09:00

讨论提案

09:00 10:30

会议

10:30 12:00

购物 Music

大豆 番茄 纸巾 竹笋 ......

衣物 June 18 Wed. 纸巾 钥匙 ......

9:35 AM

07:15

Clock

旅行

C 牙刷 Changsha

Video

Calendar

Camera

Project Process On-site Field Study

CMF Design Ecology

Need Analysis

UI Style

Phone Interview

Theme Proposals

Flow

Styling

Persona

Styling

MORE

Interface Interaction

Trend Studey On the base of benchmarking analysis about competitive products and different system platform competition, jump out from the mobile device itself to handhelds, mobile terminal, ecological chain and even service mode, and reflect on how to provide system solutions for enterprise.

Desktop Study

Key Value

Participatory Design

Theme The development of society and economy, element of China traditional culture, together with enterprise's demand, determine image of mobile. Combined with the definition of image of mobile from former workshop in 2013 --- 把玩灵气, disperse the thought about the design theme of product image, to prepare for the follow-up design.

Brainstorming, Mood board, Story Board.

CMF

Scenario

Research of Users’ Lifestyle

Product Design Iteration

Anthropological methods, together with industrial design will be adopted. Place mobile phone side by side with the current most important carrying belongings ---carrying keys, wallet---to study about Chinese Users’ lifestyle. On the base of seeking feedback for existing LG products, tap users' deep demand for LG mobile phone, and have a participatory design with consumers.

Former three study results will be summarized. Based on it, put forward the design concept of mobile phone. The design process includes three stages---Concept design > Design Analysis > Design Expression, and according to the needs, it may undergo several design iterations. Design content includes modeling, finish, functions, UI and Interaction and so on

Task , Protocol and Behavior Analysis

From Service to UX & Theme

Trend Study--Interaction Key-press Cluster of Key - Press

Virtual Home Key-press Multi-task

Close APP

Virtual

Back

Virtual Screen Key-Press

Explicit

Implicit

Screen

Physical

Immersive Mode Full screen mode Virtual key-presses in home page blend into background Comparison of Gmail Comparison of Wei Chart

Differences of key press in different systems and brands

Keep consistence with external modeling

Make the integration of screen and frame possible

Innovation of MEIZU X3ďźšvirtual home button+SmartBar

Reduce the use of physical key to extend the life

Lower the failure rate of terminals

Physical keys weakens and virual screen keys tend to be popular

Increase the fluency of operation

Solve the problem of Andriod Fragmentation

The scalability and pleasure of behavior

Concise and coherent user experience

More easy to make wrong operation

Disadvantages of visionďźšlow utilization ratio More easy to make wrong operation

Trend Study--Interaction Function Innovation Air operation

Wake up/Unlock the screen NFC

轻敲唤醒 smart wake 双击屏幕解锁

刷公交卡或POS机 魅影传送 NFC快速标签 NFC闪传 传输数据 电子标签识别 点对点付款 身份识别

拂过解锁

手掌静止表示点击 翻页 放大，缩小 浮空触控

Camera 触摸拍照(背部)

眨眼拍照

指纹解锁

语音拍照 声控美颜 手势自拍 Pose辅助 运动焦点 连拍模式 更改笑脸 删除移动对象

声纹解锁

旋转摄像头启动相机

主人/访客模式

再对焦 照片合成 更改笑脸 删除移动对象 双摄像头拍摄 语音拍照

Eye Movement 智能熄屏 智能暂停 眼动翻页 智能旋屏

指纹识别隐私数据

Feed flow

附耳呼叫 附耳接听 翻转静音

Open APP

屏幕常亮 指纹设定

Biological recognition

自动切换 扬声器

Quick 影院 smart wake 摇一摇打开应用 四边开启应用

Fastlane BlinkFeed

Multitask 悬浮：计算器窗口化

Basic function innovation User-centered innovation New technology oriented innovation

同屏多窗

Photosensitive sensor 熄屏查看

智能分屏

Glove patterns

Call

One-handed performance 双屏浏览模式 小屏幕悬窗

悬浮按钮

浮窗指令 双屏互动

Trend Study--Interaction Gesture Wake up/Unlock Screen SlideUnlock

Call PassLock

Tap/Double Click Unlock

Biometric Unlock

Camera

Distant Unlock Operation

Open camera

Interesting

Smart phone Security

Near the ear to call

Emotional

Automatic switch The speaker

Shoot process

Trend

Specialization

High recognition Near the ear to answer

Uniqueness Reduce wear and tear

Turn-to-mute

Later-stage Edit

Usability

Easy operation

Open APP

Mutiple Task Mode Suspended screen

Air Operation

Personal Information Flow

Split screen

User Data Camera VIVO Xplay

Floating technology 华为Honor X1

User Defined

Maximizing screen use Natural Interaction

Increase fluency in switching among tasks

Expand the hand movements area

Expand future direction for games

Combine the visualization of individual feeds in desktop

Trends to Theme Recommended Concept

Themes Overview

Detail of Receptive Mind

From former stage of trend study, we have a picture of current fashion trends. Combined with contemporary Chinese native culture and the definition of image of mobile from former workshop in 2013 --- 把玩灵气. We disperse the thought about the design theme. With the feedback from enterprise's demand, we choose six themes to express in detail and prepare for the subsequent design.

Oriental Trend

Refining of Everyday Life

Characteristic

Enjoy Inside Soul

Five Elements

Back

朦胧

包容

辽远

Refine line

Light Fashion

Receptive Mind

Elegant Manner

Lotus

Water

Perfectionism In China

Outline

Pliable But Strong

礼乐

Fire

Boundary Blur

Slender · Wild

Reserved Manner

唐卡

Wood

Redesign line

Back to Basic

Back to Surpise

Before

After

Research of Users’ Lifestyle Research Method

Busy and Productive Persona Financial

Busy and Productive On-site Field Study

Latest and Greatest

Up-to-Date

Initial Concept

Just the Basics Social and Curious

LG Phone Interview

Deployment

Appearance

不需要太异想天开，就连 打电话 、发短信、找联 系人这些操作都做的不好

Portable

Function

Participatory Design

12 USERS Typical Users

Android系统的自定义比 较强，可以刷机，跟其他 设备兼容性也挺好

Extremely Users

Practical

Interview Framework 必须通畅！ 语音省钱

User Basic Information

信息及时 联系人管理

心思 细腻

执行 力强

手机是我的公文包 邮件与日程 文件处理 会议记录

Frequently-used Features Scenarios ‘busy and productive’ is very concerned with all information related to their own personal efficiency and their ability to cope with a busy schedule. They use mobile phones because they are more portable, accessible or convenient than using traditional computers. They are interested in anything that can help them manage their multiple priorities and meet the demands of their busy day.

Need Analysis In seeking need points, we analyze the characteristics and lifestyle of the 'busy and productive' and find that their life can be divided into tow parts--official and leisure mode. High efficiency is required in process of work, and leisure is much more of a kind of comfortable and colorful psychological demands. In official mode three directions are mentioned--be intimate, efficient and safe. To select these needs, we do a comparative analysis in three dimensions--innovation, user satisfaction and realizability.

Realizability 1.2

1.4

2.3 3.1

OFFICIAL

1.1

2.4

4.1 1.3

2.5

2.1

Innovation 2.2

LEISURE User Satisfaction Realizability

2.4 2.3 1.2 1.1

Intimate

Efficient

1.1

模式自动适应日程

2.1 优化视频会议

1.2

通知消除紧迫感

2.2 屏幕显示多维度

1.3 1.4

特殊场景柔性通知

2.3 锁屏及时处理

备忘录+提醒+便签+生日+日历 2.4 便捷词典 2.5 同声翻译

Safe 3.1 移动支付安全

Switch

3.1

Innovation

2.5 2.1

1.3

1.4

4.1 2.2

User Satisfaction

4.1 工作与休闲模式切换

1.2

1.1 模式自动适应日程

1.1 1.4 4.1

Realizability + Innovation

1.4 备忘录+提醒+便签+生日+日历 User Satisfaction

2.2

工作与休闲模式切换

Scenario

1.

2.

Mr. Zhang's office is located in the company's thirtieth floor where he works eight hours a day. Every day lots of matters wait to be handle , but his CPU is limited.

4.

Mr. Zhang

In view of the complex data books and chaotic information management, Mr. Zhang hopes to handle his work more with his mobile phone.

5.

3.

At night, Xiao Zhang goes home after work ďźŒsitting in the sofa Suddenly A call rings from his boss

6.

OďŹƒce Worker

http://mmmmbb.taobao.com

The fact is that Mr. Zhang has completely forgotten the important meeting this afternoon. Boss is very angry and Mr. Zhang feel embarrasted

Mr. Zhang usually records record reminders and calendar events in mobile calendar, but the phone has a lot of reminder APP: calendar, reminder, memo. And the items is complicated and information management is in chaos, not sure which one is effective.

So Mr. Zhang missed the meeting this afternoon, very embarrassed. After it, Mr. Zhang think can let the phone to effectively manage calendar, remind, memos and other tools, to make the phone with delicate thoughts, enhancing execution.

One Reminder Key Value Integrate ‘calendar’, ‘reminders’, ‘memo’ and ‘ alarm clock ’ into a widget . According to the agenda automatically switch the ‘ bell’ mode. It turns out to achieve the perfect changing role between work and leisure time.

Intuitively understand all the reminders Calendar+Reminder+Memo+Clock Integrate into a widget

Take notes at any time

Extinguish the sense of urgency

Memos are arranged in tabs Input memos in ‘Text’ or ‘Snap’ Mark memos in graffiti

Switch Ring / Vibration in accordance with agenda Able to edit bells in different agenda/mode

One Reminder Wireframe 12:00

12:00

Shopping

bean tomato pepper bamboo shoot ......

Goto Clock

Journey bean tomato pepper bamboo shoot ......

07:15

Get up!

08:00 07:00 09:00 08:00

Take dog forproposal a walk Discuss the

08:00 09:00 09:00 10:30

Discuss Meetingthe proposal

10:30 09:00 12:00 10:30

Shopping Meeting

10:30 12:00 12:00 14:00

Shopping

Shopping

bean tomato pepper bamboo shoot ......

Shopping

Shopping

bean tomato pepper bamboo shoot potato pen toilet paper chili broccoli pineapple apples

bean tomato pepper bamboo shoot potato pen toilet paper chili broccoli pineapple apples

Tips bean tomato pepper bamboo shoot toilet paper broccoli apple

Tips!!! bean tomato pepper bamboo shoot potato

12:00

12:00

Tips!!!

12:00

Goto Camera bean tomato pepper bamboo shoot potato pen toilet paper chili broccoli pineapple apples bitter melon melon bananas

Tips bean tomato pepper bamboo shoot toilet paper broccoli apple

Delete

bean tomato pepper bamboo shoot potato

1

2

3

Q W E R

4

5

Handwriting /Keyboard

Shopping

Title

6

T Y U

7

A S D F G H J

I

8

K

9

O P

0

L

Z X C V B N M ?

123

Widget for One Reminder

Main Page for Memo

Memo (without time) +Timely Remider

Agenda

In the top left corner slide down to delete note

12:0 0

12:00 0

07:00 08:00

Take dog for a walk

08:00 09:00

Discuss the proposal

State Type

Meeting

Lunar Calendar

09:00 10:30 10:30 12:00 12:00 14:00 14:00 15:00 15:00 16:00

Title

Meeting Shopping

16:00 18:00

Farewell Party

18:00 19:00

Shopping

Agenda of Calendar Different colors represent different mode, and priorites works

Meeting Mode ON

Agenda

Sun

08:00 Day 09:00

01

02

03

04

05

06

07

08

09

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

Discuss the proposal

Week 09:00 Shopping 10:30

12:00 14:00

Stop

14:00 15:00

OFF

New Agenda With a lunar calendar switch, it appeals to Chinese peole.

June, 2014 Mon

Tue

15:00 16:00

Shopping

16:00 18:00

Farewell Party

18:00 19:00

Shopping

Side Drawer Nav Switch between Agenda, Day, Week, Month and setting

Wed

Tur

Fri

Sat

07

June12, 2014

Sun

Mon

Tue

Wed

Tur

Fri

Sat

08

09

10

11

12

13

14

01

02

03

04

05

08

09

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

12:0 0

Setting Ordinary Mode Meeting Mode

08:00

07:00

09:00

08:00

10:00

Discuss the proposal

Meeting

Shopping 12:00

11:00

13:00

12:00

Phone Call

Rock

Messenge

Mute

Leisure Mode People’s Calls Permission

11:00

10:00

Aug, 2014

Month of Calendar

12:0 0

07:00

Take dog for a walk

09:00

July, 2014

06

12:0 0

June, 2014

June, 2014

Shopping Meeting

With switch, edit the note more naturally like shopping list

12:0 0

07:00 Take dog for a walk Agenda 08:00

Start

Alarm

12:0 12:00 0

10:30 12:00

Priority

Edit Memo

In the top left corner slide down to delete note

Month Shopping

Date

Shopping Shopping

New Memo

Favorite

Phone Call Music

Relax

Messenge Sound

Piano

Shopping

14:00

Week of Calendar

Day of Calendar

Setting of Calendar

One Reminder Visual Design In order to unify with the UI style of theme design and cater to the 'busy and productive' , the color of high lightness is applied to the classification of information. At the same time we use fine texture of silk as background.

In the overall visual design of ‘One Reminder’ , we strive to make it concise, which adapts to the high demand on efficience of the ‘busy and productive’ . Meanwhile it acts in concert with UI style of theme design, and UX an theme design together form a complete set of design.

Main Page for Memo

Widget for One Reminder

Edit Memo

New Agenda

12:30 12:30

旅行 33 C 牙刷

购物 豌豆 西红柿 胡椒 竹笋 ......

衣物

9:35 AM

起床

07:00 08:00

带旺财散步

08:00 09:00

讨论提案

10:30 Clock 12:00

大豆 番茄 纸巾 竹笋 ......

Changsha

07:15

09:00 10:30

旅行

June 18 Wed. 纸巾

钥匙 ......

贴士！

豌豆 贴士！

会议

购物 Music

豌豆 购物 西红柿 豌豆 胡椒 西红柿 胡椒 竹笋 竹笋 土豆 土豆 钢笔 钢笔 卫生纸 卫生纸 红辣椒 红辣椒 西兰花 西兰花 菠萝 菠萝 苹果 苹果

Video

Calendar

Camera

西红柿 豌豆 胡椒 西红柿 竹笋 胡椒 土豆 竹笋 土豆

12:30

12:30

购物

12:30

Handwriting /Keyboard

购物 Slide Down to Delete

旅行 旅行

牙刷 牙刷 衣物 衣物 纸巾 纸巾 钥匙 钥匙 礼物 礼物 玩具车 玩具车 保健品 保健品

豌豆 西红柿 胡椒 竹笋 土豆 钢笔 卫生纸 红辣椒 西兰花 菠萝 苹果 苦瓜 甜瓜 香蕉

标题 情景模式

会议模式

农历

日期 开始

2014年2月10日 星期五

4:30PM

结束

2014年2月10日 星期五

优先级 提醒

5:30PM

Receptive Mind Theme Six themes from the stage of theme are selected to prepare for subsquent design. Considering the characteristic of ‘busy and productive’ , we choose one --‘refine of everyday life’ --as the theme of this group of people.

After evaluating all the three concepts of the theme of ‘refine of everyday life’, ultimately we determime the concept of ‘receptive mind’ as the final theme for the ‘busy and productive’.

Receptive Mind Busy and Productive

Refine line 辽远

Redesign line

Refine of Everyday Life

层叠

朦胧

Receptive Mind UI Style In UI design, extract the element of stack mountains in Receptive Mind and superimpose the silk texture over the icon, which highlights the sense of hierarchy and delication. In terms of color selection, colors of high lightness are selected, which counteracts the complex superposition effect and draws a concise and pure picture. Meanwhile a concise and ethereal scenery is choosed as background. All of that together is in compliance with the characteristics of ‘busy and productive’ -- sophisticatedly in dealing with complex work and pursuit pureness.

9:35 AM

33 C

Grid

Changsha

9:35

AM

Key APPs

June 18 Wed.

Elements

lightness

WED

16 Clock

Music

Video

Calendar

Camera

Colors

silk texture

line

plane

Infrequently Used APPs

Receptive Mind Styling & CMF Refine the lines of stack mountains and apply them into the side view, which caters to the features of LG -back buttons and make it a DNA.

With more rounded edges, the styling as a whole looks like a stone which the user holds completely enclosed in the hollow of his hand The material integrates the touch of plastic and the vision of metal

This project was to design gestures interface for non-professional users to easily learn and master in modern display environment.

It was my first time to participate in a project maily centered on gesture interaction design and with SANY. Working in an 8 people group as a team leader, I organized our main working process and participated in every stage of the project from fomer research to user test.

GESTURE INTERACTION DESIGN FOR SANY CRANE

Need Anlysis We had desktop study about featues of gesture. Based on it and the demand of SANY-- gestures interface in modern display environment. We decided our target user and built persona, and then set our product target. And eventually definited the gestures in detail Mechanical Controller Touchscreen Gesture Motion Sense Gravity Sense

Crane Process SANY

User

Learning Speed

Non-Accuracy

Design Accuracy

Feedback Distance

Produce

Sell

Operate

Repair

FEATURES of Gesture

Easy to Learn

DISPLAY

Environment

Wang Zhen’an

Feedback Degree

Sensitivity

Playfulness

36 Years Old

Main Concerns and Means of Communication of Different Roles

SANY Marketing Manager Pro

Married 9 years

Non-Pro Mechanic Engineer

Leader/Manager

Has 11 years diverse experience in marketing

Operator

Designer

Common Audience

Mechanical Structure

Memorable

Ergonnomic

Remote Monitoring

Interesting

Maintenance

Comfortable

Aesthetical Structure

Efficiency

Impressive

Material

Safety

Problem Solving

Benefit

Aesthetic

“

Repair

Learnable

Visual Identity

Advantages

Learnable

Demand

Mechanical Functions

Clear Orders

User Satisfaction

Cost

Technical Difficulties

Easy to Control

Identity

Energy Saving

Engineer Drawing

Diagrams

Sketches

Form & Charts

Images

Forms & Charts

Demo Video

3D Model

Lists

Demo Video

Exploded Diagram

Instruction Document

Brochure

keeps on learning new knowledge The most beautiful curve is the rising sales curve

Sometimes when a new product launching, Mr Wang is responsibility for presenting it, once he just introduced to potaintial customers with just some pictures or a video. He will be willing to try a new way to have a presentation that attracts audience eyes and impresses them.

Brief Description Mr Wang is always responsibility for setting down sales plan, determining sales policy and designing sales model. He reflects excellent performance in launching innovative services and building up good customer relationship.

Mr Wang does not know the principles of crane’s structure and exactly how it works in mechanics. He focus more on the product appearance that first attacts customers eyes, performance advantages, products parameter, for all that above easily make him sell his product.

Scenario 1

Demonstration Gestures

2

To list the gestures in demonstration, we made reference from the display video of new product launch and brainstormed about the gestures it may concern

3

4

DISPLAY CONTENT

GEASTURE DIVISION

Appearance Display

三一起重机新 品：XX型号问 世，召开新品 发布会

营销经理王先 生对产品作介 绍，用优雅的 虚拟手势控制

台下掌声雷动 ，对XX产品印 象深刻，对新 品甚是憧憬

发布会后众多 潜在客户表达 了采购意向， 后续营销跟进

Performance Characteristics

Demonstration Gestures

Simulate Operations

Cotroling Gestures

Video Reference

+

Brainstorm

Start

Cotroling Gestures

Drive the crane to working spot Unfold the legs

After a series of discussion about the non-professional’s concerns and some reference, we decided on a set of orders to be designed as following:

Test Hanging Y

Overweight?

Key Words Extraction

N Stretch the boom

Boom

Stretch

Raise the boom

Boom

Raise

Lower the hook

Hook

Lower

Grab the object

Hook

Grab

Raise the hook

Hook

Raise

Rotate the boom to a proper position

Object

Boom

Motion

Rotate

Lower the hook

Hook

Lower

Release the object

Hook

Release

Raise the hook

Hook

Raise

Lower the boom

Boom

Lower

Withdraw the boom

Boom

Boom

Fold the legs

B-1

Boom Up/Dowm

B-2

Stretch/Retract Boom

B-3

Move Left/Right Boom

B-4

Hook Up/Down

B-5

Grab

B-6

Release

D-7

Zoom In/Out

D-8

Exploded Diagram

D-9

Rotate View

D-10

Information Reference

D-11

Stop

D-12

Switch

D-13

Return

*Notes for Some Movements

End

Back

Front

Boom Top View

Rotate the boom

Strech/Withdraw the boom

Raise the hook

Boom Hook Side View

Raise the boom

Lower the boom

Lower the hook

Gesture Design People’s former experience was a best resource for our design. We did a thorough research to form our gesture pool including learning from sign-language and professional crane signal gestures to interviewing non-pros about their understanding and expression about certain words in life.

Grammer Structure Analysis Composition

Combined Comparison Analysis

Semantic Analysis of Gestures

Crane Signal Gestures Fomer Experience

Cotroling Gestures for Crane Movements

Design of Gesture

verb.

noun.

Main/Auxiliary Hook Swinging Range

Hand Type

ad.

Boom Up/Down Slightly Rotate Boom Slightly Hook Up/Down Slightly Pan Hook Slightly

Slightly --> palm swing -- hook Palm level/forearm foreward--boom Emergency --> both arms’ motion

Hand Type+Palm+Arm Position

noun.

Hook --> fist Boom --> fist with thumb up

verb.

Up/Down --> forearm position for direction -- hook thumb/forearm position for direction-- boom Extend/Retract--> thumb direction & relative motion tendency Rotate --> arm for direction & wrist twist for motion type Grab/Release --> forearm direction & relative motion tendency Stop --> forearm paralell motion Strengthen --> cross

noun.+ad.+verb.

Single Gesture

noun.+verb.

Boom Up/Down Extend/Retract Boom Rotate Boom Pan Hook Hook up/Down

Hand Type+Arm Position

noun.+ad.

Emergency Stop

Strengthened Gesture

Sign-Language Fomer Experience

Stop Pause End

Gesture Type

Attention Destination Grab/Realese

Sign-Language Demonstrating Gestures

Crane Signals

noun. --> Hand Type Move Direction --> Arm Position verb. --> Wrist Twisting Size/Range --> Ralative Motion Tency Between Arms ‘Slightly’ --> Palm’s Paralell Motion Strengthen --> Both Hands

Comparison Survey of Samples

Crane Signal Gestures: Sign-language Gestures Crane Signal Gestures GB 5082-1985

Explode Diagram

Key Word

Apart Enlarge Open Spread ......

Related Words in Dictionary

Slit Boom Open Big

Explode

Pull

Explode

Open

Apart

Big

Pull

Hit

Out

Spread

Brainstorming

Reference in Sign-language Pool

User Interview

16

Cluster of Former Experience Set -- Rotate the Boom USERS

0

15min

Brainstorm to Keywords

D1

More Reaction to Keyword

Mind behind the Action

吊臂旋转指令 顺／逆时针转

D2

Order D

D3

Reaction to ‘Rotate the Boom’ D4 Video

D5

Mind Behind the Action D6

Pic 右手臂水平移动， 地球仪随之转动

双手手臂水平绕转， 汽车沿绕转方向转向

腰部发力以身体为轴 旋转，呼啦圈转动

手臂向左向右移动， 指挥车辆向相应方向

一手向前一手向后发 力，竹蜻蜓旋转

D7

单手臂水平旋转

画圆事件

旋转石磨

交警指挥

搅拌

单手手臂水平旋转

手握笔在纸上

人力推动石磨动作

手臂向左向右旋转

单手握住搅拌器绕

吊臂旋转

笔尖旋转画图

石磨绕轴旋转

指挥车行进的方向

使物体绕中心转

腰部扭动动作

呼啦圈

腰部绕身体纵轴转

腰部发力使旋转

吊臂旋转

呼啦圈转动

手部水平转动

转手绢

手部平行地面圆周

以手指为中心转

吊臂旋转

手帕转动

双手手臂水平绕

方向盘

双手腰侧水平环绕

双手沿一定方向转

吊臂旋转

车体按同方向转动

手臂体侧旋转

跳绳动作

划动船桨

体操飘带

手臂于体侧旋转

双手握手柄转

以支点为中心转

以手为中心旋转

吊臂旋转

绳以腕为中心转

船桨转动

飘带转动

手臂圆周运动

地球仪

身体正前方圆周

单方向用力

吊臂旋转

地球仪转动

单手手臂前后环绕

卷毛线团

手臂垂直于人体

手拿向一个方向转

吊臂旋转

毛线团转动

双手手臂前后运动

竹蜻蜓

手臂垂直前后转动

前后反向用力

吊臂旋转

竹蜻蜓旋转

Text

人力推动石磨，石磨 绕纵轴旋转

双手执跳绳绕转，跳 绳随手腕动作绕转

手臂绕肩部旋转，彩 带随之绕转

手臂以固定支点施力 摇动，船桨随之绕转

D8 绕手指尖旋转，手帕 随之旋转

Design Limit Qustionnaire of Former Experience Set -- Rotate the Boom 动作描述

先在事件1 指挥车辆转向

先在事件2

打分

模拟转呼啦圈

标注

先在事件3

打分

打分

模拟转手绢

标注

先在事件5

先在事件4 打分

方向盘操作

标注

先在事件6

Besides the ergonomic study, the analysis of Kinect played an important role in our study, for the gesture user interface was establishe based on the Microsoft handware system of Kinect.

标注

先在事件7

先在事件8

从两侧控制船桨 打分

单手转舵类物体 打分

单手环绕缠毛线 打分

标注

标注

标注

双手手臂前后 模拟竹蜻蜓

打分

吊臂旋转

Average Response Time 0

10

20

40

33.4 s

D2

D7 D8

1

2

3

4

5

6

D4

4.5 s 38 s 32.34 s 35.34 s

8

9

10

3.34 5.68 4.84 6.68

D5

6.48

D6

28.23 s

7

Mood Board--Elegant

4.84

D1 D3

24.6 s

D5 D6

0

D2

17.44 s

D3 D4

Average Grade of Compatibility

30

D1

标注

D7

3.82

D8

3.94 Mood Board for ‘Explode’

Mood Board for ‘Rotate’

Final Output Our final gestures interface for non-professional users was displayed in diverse ways: videos and gesture specification. Video includes standard gesture in front and side view and the reaction from the crane or the effect on the show. Here are part of gestures.

Video

Cotroling Gestures

Stretch Boom

Specification

Stretch/ Retract Boom

Demonstration Gestures

Zoom Out

Zoom In/Out

Zoom In

Retract Boom

Move Left

Rotate Boom

Move Right

Grab

Explode Diagram

Grab/Release

Release

Usability Test This usability test aimed to examine whether or not our design was applicable and learnable by comparing with the National Standard for Lifting and Moving Gesture Command Signals-- GB 5082ďź?1985 on learnablity, memory, confusion and subjective satisfaction. And this user tested was performed for two times within one week.

Learnablity Test

Test Data Analysis

Group A

Group A

Group B

Group B

B1-1 B1-2 B2-1 B2-2 B3-1 B3-2 B4-1 B4-2

Subgroup

B1-1

3 2

4

B1-2

15min Geature Learning

1

2

7

B2-1 B3-1

1

1

B4-1

4

1

B4-2

1

3

D11

1

B1-1 B1-2 B2-1 B2-2 B3-1 B3-2 B4-1 B4-2

B2-2 B3-1

1

B5

5

D7

5

1

D11

1

10 10 10 10 10 10 9

D9

1 10

D10

10

D11

8

D10 D11 D12 D13

10

D8

10

B5-2

D9

10

B6

10

D8

10

B4-2

2

B5-1

D7

10

B4-1

4

B6

10

B3-2

1

B5

B1-1 10 B1-2 B2-1

2 3

1 1

B3-2

B6

1

9

B2-1

3

B5

1

D12

9 10

D13

Comparison of Confusion Analysis Act After Crane Action

Tell Order After Gesture

?

?

?

?

D-8 Exploded Diagram

*Notes for Geatures B-1 Boom Up/Dowm

B-2 Stretch/Retract Boom

D-7 Zoom In/Out

D-10 Information Reference

B-3 Left/Right Boom

B-4 Hook Up/Down

D-9 Rotate View

D-12 Switch

B-5 Grab

B-6 Release

D-11Stop

D-13 Return

5

16.23

4.5

16

12.56 12

13.34

4

11.59 9.88

4.58

9.23

9.45 7.32

8

5.18

4.72

3

7.21

7.32 4.62

6.88 4.34

3.22

4

4.2

4.22

4.36

5.20

4.3

4.1

3.8 3.5

3.0

4.4

3.3

3.4

4.3

4.5 4.3

4.4

D8

D9

4.4 4.0

4.3

4.1

D11

D12

4.2

3.5

2

1

0

0

B1

B2

B3

B4

B5

B6

D7

D8

D9

Comparison of Average Response Time(/s)

D10

D11

D12

D13

B1

B2

B3

B4

B5

B6

D7

D10

D13

Comparison of User Satisfacation Evaluation

Conclusion Proposal B can reduce the user's learning time, making users quickly learn and master the gesture interface; Confusion degreen of Instruction in Proposal B is obviously lower than that in Proposal A, which indicates that users prefer to learn, master and use Proposal B; Proposal B has some advantages in learning speed, anti confusion and satisfaction than Proposal A, and to some extent users’ storing and extracting Proposal Bhas higher efficiency and higher accuracy in the cognitive process.

Sports in Compus Our project was to redefine the sport l way nowdays in compus. Start from the method of service and system design, we find the main painpoint of users and then made a difference, which offers college students a new sport experience.

Project Process

Need Analysis

Our project underwent the four main stages -- need analysis, prototype phase, visual design, excute and implement. After questionnaire and on-site field study, we educed the target user and analyze their needs.

And set the product target and product positioning.

Prototype Phase

Visual Design

Excute & Implement

Questionnaire Study

Design Keyword

Mood Board

Refining

On-site Field Study

Scenario

Style Definition

Testing

Group Segment

Task Flow

High-fidelity

Validation

Target Interview

Site Map

Persona

Page Flow

Experience Map

Wireframe

Coding

Overview

128/135 +

Investigation Report Time Spent on Sport Per Week

51.3

%

<3h

30.2

%

3-6 h

10.6% 6-10 h

7.6% > 10 h

19.1%

42.2

%

without partners

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaa

29.2%

Limited Social

Un-cycling of Equipments

Limited Fields

Dealing with Sports Injuries

Just Lazy

On-site Field Study

Reasons for not exercise without time

Questionnaire Study

Problems Existing

Valid Questionnaires

9.5% Others

Group Segment Cluster Analysis Sport Agenda

Group Selection

57.6%

Skill Advance

Cluster Variables Sport Equipment

10.3%

Sport Purpose

Couch Patato 32.1%

Camparison of Groups Motivation Be Ready

Just for fun or make friends; Be fit

Role

Time

Companier

Equipment

Spontaneous

Aperiodicity; Not usual; Random time;

Not-fixed and changable

Ordinary

or just out of

comformity

Depend on

57.6%

Couch Patato 32.1%

Skill Advance 10.3%

companiers;

emotion Out of the addiction to

web game; To make friends Advance

professional skill; Part of

lifestyle

Possivly participate

Seldom

Spontaneous; Periodicity; Organizer of Fixed time

activities

equipment or even not;

Borrow from others or rent in

Focus

Demand

Service

Fun of sport; interaction

Use of the field

Fun of sport;

Use of the field

Be Ready

Low Requirement High Demand

Couch Patato

Low Requirement External Attraction

Skill Advance

High Requirement Self-Sufficiency

Equipment

Field

Partners

Field

Partners

Partners

with partners

gym

Rare

Without

User Demand

Be Ready

equipment

Regular

companiers;

Relatively

professional

equipment (whole set); Have knowledge about

maintenance

Prefession of field , equipment, teammates

Attraction

We had listed some essential elements that each of the three groups cares about.

And on consideration of the demand of each group, we could list the feature of each group: ‘be ready’--low requirement, high demand; ‘couch patato’ -- low requirement, external attraction; ‘skill advance’--high requirment, self-sufficiency.

Based on the features, we selected group on the dimentions of user demand and commercial value and eventually we selected ‘be ready’ .

Be Ready

Companier

Satisfaction

VIP of gym; make reservation by phone; Periodic reservatuib

Couch Patato 32.1%

57.6%

Skill Advance 10.3%

Commercial Value

Persona

Scenerio Jake 20 Years Old Single A Sophomore in Schoo of Mechanical and Vehicle Engineering, Hunan University Lives in Tianma Student Department

A makes a call to B and C to do sports

A borrows a racket for his friends

They book a tennis field with student ID card.

They all have rackets in hands

A, B and C meets at the gate of cumpus gym.

Always T-shirt + Jean + Black-Rimmed Glasses

Brief Description

â&#x20AC;&#x153;

I want no wait for the field!

When I just want to play badminton, partners come immediately! Best to be a girl!

User Goal Hope to quickly gather teammates and best to be girls; Hope to no wait for a vacancy, when get the gym, can start to play

Demand Effectiveness of gathering people; Appeal to girls; Arrangement of the limited field

Jake takes many courses this year, which leaves him limited time to do exercise. With a limited social circle, he is still single. He want to relax himself and make friends, maybe a girl, through sport.

Jake bought a pair of unnamed brand of badminton rackets in a small super market in the freshman year, However on the spur of momenthe he want to play badminton, without equipment on hand, he rent in the gym.

Jake has unfixed partners. When classmates call him, he joins them. Always he want to, he find no one with him, for they are busy with dates or other things.

They rent two rackets from cumpus Rent Center

Many times Jake excitedly rush to the field of badminton and disappoitedly returns, for there is no vacancy.

Focus

Pain Point

Enjoy the fun of play badminton; Interaction with new partners or new friends; Time spent on wait

Limited field, has to wait for a long time or even returns empty-handed; Only classmates, just boys, limited social circle

They return rackets to Cumpus Rent Center and pay for it

They pay for the fare of field using based on time

They enjoy happy sport time

Key Value

Light Social

Book Field

Activities Bullet

Based on the field Focus on oďŹ&#x20AC;ering chances for strangers

Essential touchpoint for sport oďŹ&#x20AC;er convenience for college students

A platform for college to promote activsties Advance the participation of students

Page Flow

Wireframe 4.1

组队提交页面

1

湖南大学体育馆

首页

2

湖南大学体育馆

登陆页面

6.1

湖南大学体育馆

登陆

湖南大学体育馆

登录

2人场

占领 组队

羽毛球 17:00-18:00

预定 场地

活动 通知

06.20

XXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXX

页内导航

06.20

密码

09:00

18:00

14:00

14:00

组队确认页面

XXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXX

恭喜你，成功秒杀！

距开始还剩

分

秒

3

4

2

人场

人场

人场

羽毛球 17:00-18:00

羽毛球 17:00-18:00

乒乓球 17:00-18:00

5.1

预定提交页面

06.20

网球

游泳

足球

篮球

今天 06.20

星期一 06.21

星期二 06.22

星期三 06.23

7剩余

2剩余

6剩余

8剩余

06.20

羽毛球 已售完

题目：XXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXX

可预订

09:00 10:00 11:00 14:00 15:00 16:00 √ 17:00 18:00

个人中心 06.20

题目：XXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXX

同学A 级别 2级

06.20

100诚信币

题目：XXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXX

06.20

项目

时间段

XXX XXX XXX XXX

XXX-XXX XXX-XXX XXX-XXX XXX-XXX

预定时间

06.20

XX-XX-XXXX XX-XX-XXXX XX-XX-XXXX XX-XX-XXXX

题目：XXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXX

下一页 >

已组队 项目

时间段

XXX XXX XXX XXX

XXX-XXX XXX-XXX XXX-XXX XXX-XXX

预定时间 XX-XX-XXXX XX-XX-XXXX XX-XX-XXXX XX-XX-XXXX

操作 退订 完成 完成 完成

6.2

通知详情 湖南大学体育馆

06.20

题目XXXXXXXXXX

题目：XXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXX

确认

5.2

乒乓球

6活动通知

湖南大学体育馆

XXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXX

已组队

5预定场地 羽毛球

题目：XXXXXXXXXXXXX

湖南大学体育馆

2人场 羽毛球 17:00-18:00

06.20

20:00

2

湖南大学体育馆

3

题目：XXXXXXXXXXXXX

登录

4占领组队

跳转至

题目：XXXXXXXXXXXXX

学号

确认

4.2

通知列表

更多

预定确认页面 湖南大学体育馆

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXX

下一页 > 恭喜你，成功预订！

羽毛球03

跳转至

3 06.20 17:00-18:00

Visual Design

占位交友 占位交友

场馆预定

14:00

09:00

公告通知

18:00

14:00

20:00 距开始还剩 08 分 34 秒 08

乒乓球 2人场 17:00-18:00

乒乓球 4人场 17:00-18:00

羽毛球 4人场 17:00-18:00

SANY

SMALL-TONNAGE FORKLIFT

Inherit the brand image of Sany port machinery--dynamic and differentiation and highlight the features of small-tonnage forklift -- light, delicate. Overall shape of backward face assumes a lovely facial features with smooth curve which breaks the too tough image of mechanical products and offers exquisite taste.

THANKS Ge Chang Postgraduate Hunan University gechang@foxmail.com +15211017820