EXPERIENCE DESIGN PORTFOLIO 2011 ﹣ 2014
李 昕
PURPLE
作 用 品 戶 集 體 驗 設 計
李昕 PURPLE 用戶體驗設計師，騰訊 EXPERIENCE DESIGNER, TENCENT
BORN IN 1988
EXPERIENCE USER EXPERIENCE DESIGNER
TENCENT
NOV 2013
PRESENT
USER EXPERIENCE DESIGNER
QQ情侶
TENCENT
MAY 2012
NOV 2013
JUNIOR USER EXPERIENCE DESIGNER
騰訊企業門戶
TENCENT
MAR 2012
JUL 2012
JUNIOR USER EXPERIENCE DESIGNER
騰訊微雲
TENCENT
DEC 2011
MAR 2012
INTERACTION DESIGNER INTERN
長虹
CHANGHONG
MAY 2011
JUL 2011
EDUCATION MASTER OF DESIGN, INTERACTION DESIGN
THE HONG KONG POLYTECHNIC UNIVERSITY SCHOOL OF DESIGN
SEP 2010
NOV 2011
BACHELOR OF ENGINEERING, INDUSTRIAL DESIGN
DONGHUA UNIVERSITY COLLEGE OF MECHANICAL ENGINEERING
SEP 2006
JUN 2010
SKILLS
Scenario
Wireframe
Persona
User interface
Task Flow
Influence & Leadership
Storyboard
Problem Solving
Brainstorming
Design Strategy
Passionate
Research & Analysis
Methodology
Curious Open-minded
Sketch
Information Architecture
Concept Persuasion
Graphic Design
Prototype & User Testing
Creative Thinking
Enthusiasm
Industrial Design
Behavior Mapping
Communication & Organization
Responsible
Enviornment Design
Bussiness Modeling
Juniors Mentoring
Dedicated 
I translate user experience strategies into tangible on-screen experiences from mobile app to desktop software to web and beyond.
03
PROJECT
INFLUENCE
PASSION
QQ電話
Scenario workshop
iPhonegraphy meets Culture
QQ情侶
Service design V.S. UX design
Photography
腦暴工具
QQ design guildlines
Lifestyle
騰訊企業門戶
Mentoring
騰訊微雲
Awards
04
PROJECT
01
QQ雝芹 SEP 2014 - PRESENT QQ, The most popular instant messenger in China, has achieved more than 200 million PCU (peak concurrent users). Voice and video chat is one of the most primary fundamental functions of QQ. While web conference market is still increased dramatically year by year, if QQ wants to share a piece of the pie continually, then the related experiences must be introduced and improved.
http://im.qq.com/
BACKGROUND Supported group video chat from techinic aspect allows multiple videos to be displayed simultaneously on one screen. The experience of switching from one-to-one voice chat, to group voice chat, to group video chat need to be considered for the sake of reducing users’ frustrations. The increased amount of functions has caused the initial screen filled with icons. A new frame of all the different functions needs to be introduced. To ensure the following-up functions never affect its basic experience. Re-organized all elements into right categories that users can understand and stay easily accessible. QQ video and voice chat is part of QQ. It needs to carry forward the key UI languages of QQ, and keeps its own personality at the same time.
RESEARCH & ANALYSIS White-collar user is the only group that being more active on PC than on mobile devices.
69 群
64
25
C2C
31
28
33
17
中小學生
大學生
白領
the average amount of messages sent by MOBILE QQ USERS per day
中小學生
13
大學生
白領
the average amount of messages sent by PC QQ USERS per day
Source: QQ backstage data (Jue, 2014). User groups identified by ISUX.
08
Among the large amount of users who uses PC QQ at work, 40% of them use Wechat as their primary IM tool when they get off work. So keeping the advantage of PC QQ among them, and attracting them use Mobile QQ is an issue worth working on. 上班時最主要用
807
上班時最主要用
100
下班后最主要用QQ电脑版 下班后最主要用QQ手机版
上班時最主要用
79
下班后最主要用微信 其他
Source: Questionnaire from SNG Business Plan.
Under the office environment of PC QQ, if QQ wants to take a spot in this increasing web conference market in China, the mobile app needs to be improved to provide the similar experiences also. 一對一
情感溝通場景
我們擅長的
（陌生人交友）
商務場景 教育場景
一
Source: Ipsos
09
有機會的 熟人/
CONCEPT & SKETCHES Before meet the business web conference, how to optimize group video chat’s basic experience is the first step. We need to have plans and output sketches and concepts quickly, focus on the outcome so that push forward this project.
10
WIREFRAME & PROTOTYPE Came up with the most effective way to showcase interfaces under complicated situation. Also, figured out available tools to create clickable prototype. In this way, clients could actually feel and experience the changes, differences and improvements.
use horizontal and vertical coordinate axis to express the differences and connections of each interface.
PROTOTYPE MADE WITH POP
11
use SCENARIOS to walk through wireframes.
FINAL UI During visual design face, keeping communications tight and smooth with visual designers. Working together on layers and details of all the animations prepared for programmers.
functions
multiple videos main video
background image
one-to-one voice
one-to-one video
group voice
group video
OTHER QQ
PROJECTS
02
QQćƒ…äžś MAY 2012 - NOV 2013 As the most proffesional and popular app for couples in China, over 100 million users here are sharing their cherish moments on this platform.
2013 market research
BACKGROUND To build a creative app to solve vertical connections internally, need to find the best way to organize all sorts of different needs and requirements. Product manager’s team is good at listing functional key points, but I need to be able to figure out which truly represents what our users want among all the functions. We have a large team with many team members. So it’s very important for me to work out a way in concept stage with all team members so everyone could focus on the same thing and fight for it. When in the situation under time pressure, and I am the only interaction designer, I know the upcoming difficulties that I may confront and it would be a great opportunity and challenge for me.
BRAINSTORMING Brainstormed with product managers and user reseracher. Organized exsiting requirements and notices new opportunities from it.
16
INTERVIEW Interviewed couples at their homes to actually feel and understand their relationship behavior details.
同城
同城
同城
男 18 高三 女 17 高三
男 19 高三 女 16 高一
男 23 大三 女 21 大二
相戀 9個月
相戀 4個月
相戀 2年
同居
異地
異地
男 26 建築師 女 26 博士在讀
男 25 切紙師縛 女 22 工廠工人
相戀 2年
男 26 基金分析師 女 25 商業分析員
相戀 1年
異地
相戀 3個月
異地
同居
男 28 程序員 女 28 博士在讀
男 40 自由職業者 女 37 設計師
男 26 網店店主 女 25 網店店主
相戀 3年
相戀 18年
相戀 9年
ANALYSIS Communication and understanding are the promary keys in a relationship behavior, and exists for each single couple.
日常交流 自我展示
共同生活
談情說愛
溝通了解
尋求幫助
明確關係
逃避對方
情感加分
增添情趣
獨立空間
善意欺騙
默默付出 記錄整理 默默關注
17
分享炫耀
個人秘密
給對方空間
INFORMATION ARCHITECTURE Organized and classified the functions into information architecture and output different sketches and proposals.
SKETCHES Output sketches based on different architecture, and ensured each proposal has its own specialty and listed pros and cons as well.
18
WIREFRAME & FINAL UI
19
20
OTHERS
Games, camera &
& other functions
FEEDBACK Ranked top in social networking category in APP STORE and received great reviews.
The amount of users climbs steadily.
23
24
03
腦暴工具 AUG 2014 - PRESENT A self-developed app by our department to use internally in order to coordinate between designers and product managers in each project, and also provide a platform to organize scenarios and click for better ideas.
BACKGROUND Helps all our developers to organize user’s behavior so that come up with insights for actual users. More so, it becomes a great tool for cooperating with other team members for collecting solutions and suggestions so that push our project moving to the next phase quicker.
项
总结 用户需求 行为地图
用户痛点
产品/设计/用研共同参与
脑暴 设计概念
发散 设计方案
判断 优先级
交互设计
26
04
騰訊企業門戶 MAR 2012 - JUL 2012 It’s an Internal portal that 20,000 Tencent employees logins everyday. This platform represents Tencent’s culture, news, communication and day-to-day office tools.
BACKGROUND Change of focus: From only a simple link library, to a representative of our whole company’s culture.
新聞資訊平台 傳播公司聲音：公司新聞及 業務信息傳播的官方載體； 員工了解公司戰略發展與 管理政策的主渠道
文檔資料平台 聚合文檔資料：對公司的 文檔資料進行有效聚合。 所有公開可共享的聚合 到一起。
溝通交流平台
個人門戶網站
促進內部溝通：員工抒發心 聲參與公司管理的平台；各 級管理者與職能部門了解 員工狀態，做好服務工作的 交流陣地。
個人門戶：對個人的公司 內信息管理進行有效聚 合，節約使用成本，加強深 度使用。
BRAINSTORMING Assumed we are employees from all kinds of position and imagined all the scenarios that may occur. We came up with core scenarios and translated them into website contents, and then output them into information architecture from users’ behavior aspect.
28
INFORMATION ARCHITECTURE
WIREFRAME & UI
Kept Working deep on each module. Expres
29
ssed the most typical information that would become the stand-alone differences coparing to other modules.
30
USER TESTING
FINAL UI
As it might be rather risky to implement a thorough innovative design proposal, I created a simple demo and cooperated with visual designers and users researchers to test with colleagues from different positions before the development in order to collect opinions and avoid risks.
設計團隊 想推進的方案
保守方案 （要求視覺設 計師也輸出這個 方案）
After an optimization on the basis of the research’s result, the genuine personalized Quick Links, which is the most popular function on this website, had come into being.
31
32
FEEDBACK Won the approval of CEO Pony Ma, VP Xidan and GM Jonathan Wong. Highly praised by colleagues.
33
34
05
騰訊微雲 DEC 2011 - MAR 2012 Tencent Weiyun is a cloud storage service, which provides users with the convenience of synchronizing files between mobile and desktop, transmitting photos and other data.
BACKGROUND Product Manager Team proposed to develop a personal cloud storage service product, however, no one knows what the products will be like. Starting from scratch will be a great challenge for interaction designers, as they are the first session of designing process.
RESEARCH & ANALYSIS Explored how users behave when using cloud storage service with user researchers to seek design opportunities.
想要 想要
快捷高效地
存儲
“忘記是那個檔案了，
査找
不下載看下就不知道找對了沒。 ”
處理文檔
拷貝
轉移
穩定可靠的
“要一個一個拷貝， 太轉折了。 ”
存儲服務
使用
云存儲服務
文檔處理
打印
的行為
發送
現有的
共享有限制 不靈活
共享
“不下載就不能打印和發送， 太曲折。 ”
......
36
CONCEPT mine
DESIGN friend’s
Presented sketches of several concepts in a storytelling way involving exports from different domains related to this project to push the process forward. Ensured every team member working towards the same goal and make decisions together. 37
38
INFLUENCE
[SCENARIO W
lectured in severa
WORKSHOP]
al design centers
[Service design
shared in ISUX
V.S. UX design]
X department
QQ DESIGN GUIDLINES CAPTION DISCRIPTION
SCOPE
CONTENT
EXAMPLE
LABEL
EXAMPLE
MENTORING SONG 陳松 在QQ設計組擔任其導師。輔助從法國留學回來的他快速補齊 基礎的UI知識， 同時鼓勵他將以往擅長的創新的方法論以落地 的形式帶入團隊。 職級：設計師 （D2-1）
EUGENE 柳斌 擔任QQ情侶項目的交互負責人。輔助剛進公司的他快速對工 作上手， 指導并把關其交互設計質量。 職級：助理設計師 （D1-2）
GRACE 王淦 擔任QQ情侶項目的交互負責人。指導并把關她的交互設計質 量， 輔助協調和產品團隊的溝通。 職級：助理設計師 （D1-2）
47
AWARDS INDIVIDUAL AWARDS 1. 騰訊優秀員工 2. STAR OF ISUX
TEAM AWARDS
PATENT
1. 2013下半年 SNG總裁獎 QQ多終端互融項目體驗設計聯合團隊
外觀設計 中國
2. 2014上半年 SNG總裁獎 QQ音視頻體驗優化聯合團隊
在同一个Wi-Fi環境下快速創建討論組的交互設計方案
3. 2014年9月 騰訊微創新獎 QQ截圖馬賽克 ﹣﹣ 圖片隱私保護利器
第一發明人：李昕
48
PASSION
FRAME DIFFERENT
51
I GO TO PLACES, T CULTURES WITH iPhone.
52
I USE P FEEL BEAUTIFUL MO
57
PROFESSIONAL CAMERAS, OMENTS ON THE PLANET.
58
FOCUS ON EVER
63
I DRESS UP EVERYDAY, RY DETAIL IN DAILY LIFE.
64
Empower others & make a positive change!
67
Copyright Špurpleli.com All rights reserved. This book was produced and published in 2014 by Purple. 68