AppDC 03, App x Design, Tony, Mobile 情感設計

95
設計一個感動人心的APP MOBILE情感設計 by 1009 Design Monday, August 19, 13

description

http://registrano.com/events/appdc-20130816/ AppDC#03 : App X Design 20:20~21:00 佟寧 Tony @ 1009 Design 講題: Mobile情感設計 Tony Tung, [email protected] (代為上傳)

Transcript of AppDC 03, App x Design, Tony, Mobile 情感設計

Page 1: AppDC 03, App x Design, Tony, Mobile 情感設計

設計一個感動人心的APP

MOBILE情感設計by 1009 Design

Monday, August 19, 13

Page 2: AppDC 03, App x Design, Tony, Mobile 情感設計

About Tony Tung and 1009 Design

TCUX group 社團創辦人1009Design 創辦人

1998年成立休曼科技,優加數位於2009年看好雲端應用, 將團隊單獨成立1009Design,設計產品奪得IF,紅點等國際設計大獎.

連網消費電子產品設計師

辦公室位於台灣台中, 美國舊金山主要能力: 產品使用者體驗規畫 + 介面設計 + 雲端系統規畫執行能力: 整合不同工程團隊與系統, 實踐可產品化的優質新產品.

設計消費性電子產品出身, 專長於雲端應用整合建置雲端服務與行動裝置互動設計數位匯流雲端服務設計APP, 網站 使用者介面與體驗設計

我們的專長 建立新服務架構, 與客戶成為夥伴一起發表新產品 矽谷產品法則: 用好的使用者體驗來提升產品競爭力 體驗創新應用: 用使用者體驗及視覺化設計, 來達到產品創新與經驗創新

Monday, August 19, 13

Page 3: AppDC 03, App x Design, Tony, Mobile 情感設計

我的APP要怎樣才能吸引使用者?

我的APP要怎樣才能讓使用者愛不釋手?

我的APP想讓使用者喜歡到口耳相傳?

設計可以幫我什麼?

Monday, August 19, 13

Page 4: AppDC 03, App x Design, Tony, Mobile 情感設計

最常聽到:

以人為本的設計 / 使用者中心設計

Monday, August 19, 13

Page 5: AppDC 03, App x Design, Tony, Mobile 情感設計

從設計的眼光看產品, 做的事比你想的雜很多

Monday, August 19, 13

Page 6: AppDC 03, App x Design, Tony, Mobile 情感設計

從設計的眼光看產品, 做的事比你想的雜很多

一般人要從何開始?

Monday, August 19, 13

Page 7: AppDC 03, App x Design, Tony, Mobile 情感設計

基本面: 人 PEOPLE

Monday, August 19, 13

Page 8: AppDC 03, App x Design, Tony, Mobile 情感設計

為人設計 為人的情感設計

Monday, August 19, 13

Page 9: AppDC 03, App x Design, Tony, Mobile 情感設計

情感設計有多重要?

Monday, August 19, 13

Page 10: AppDC 03, App x Design, Tony, Mobile 情感設計

每天生活有許多片刻, 有許多情緒

Monday, August 19, 13

Page 11: AppDC 03, App x Design, Tony, Mobile 情感設計

婚姻美滿的黃金比例

Monday, August 19, 13

Page 12: AppDC 03, App x Design, Tony, Mobile 情感設計

離婚的黃金比例(!?)

Monday, August 19, 13

Page 13: AppDC 03, App x Design, Tony, Mobile 情感設計

Monday, August 19, 13

Page 14: AppDC 03, App x Design, Tony, Mobile 情感設計

團隊效率超高的黃金比例

Monday, August 19, 13

Page 15: AppDC 03, App x Design, Tony, Mobile 情感設計

- 正向

-負向

情 感

Monday, August 19, 13

Page 16: AppDC 03, App x Design, Tony, Mobile 情感設計

- 有機會為用戶創造快樂

-有責任為用戶避免挫折

We, Developers

Monday, August 19, 13

Page 17: AppDC 03, App x Design, Tony, Mobile 情感設計

市售各式與情感設計相關書藉方法學...

Monday, August 19, 13

Page 18: AppDC 03, App x Design, Tony, Mobile 情感設計

2013 5月,  舊金山GOOGLE I/O

Monday, August 19, 13

Page 19: AppDC 03, App x Design, Tony, Mobile 情感設計

從用戶使用Android的高興和挫折開始Study

Monday, August 19, 13

Page 20: AppDC 03, App x Design, Tony, Mobile 情感設計

讓我用了就著迷

簡化我的生活

讓我成為驚奇之人

Monday, August 19, 13

Page 21: AppDC 03, App x Design, Tony, Mobile 情感設計

Android基於情感設計所歸納出的16條原則

Monday, August 19, 13

Page 22: AppDC 03, App x Design, Tony, Mobile 情感設計

更重要的: 圍繞在情感做設計

1. 避免負面情感

2. 增加正面情感

每一條原則都具有的特性:

Monday, August 19, 13

Page 23: AppDC 03, App x Design, Tony, Mobile 情感設計

從文字就導入情感設計的概念

Monday, August 19, 13

Page 24: AppDC 03, App x Design, Tony, Mobile 情感設計

Monday, August 19, 13

Page 25: AppDC 03, App x Design, Tony, Mobile 情感設計

Monday, August 19, 13

Page 26: AppDC 03, App x Design, Tony, Mobile 情感設計

Monday, August 19, 13

Page 27: AppDC 03, App x Design, Tony, Mobile 情感設計

Monday, August 19, 13

Page 28: AppDC 03, App x Design, Tony, Mobile 情感設計

Monday, August 19, 13

Page 29: AppDC 03, App x Design, Tony, Mobile 情感設計

APP的成功 = 三個情感因素都到位

Monday, August 19, 13

Page 30: AppDC 03, App x Design, Tony, Mobile 情感設計

Example:

Jawbone: UP

Monday, August 19, 13

Page 31: AppDC 03, App x Design, Tony, Mobile 情感設計

Monday, August 19, 13

Page 32: AppDC 03, App x Design, Tony, Mobile 情感設計

功能還很多, 都被藏了起來

Monday, August 19, 13

Page 33: AppDC 03, App x Design, Tony, Mobile 情感設計

達到目標時會閃閃發光

Monday, August 19, 13

Page 34: AppDC 03, App x Design, Tony, Mobile 情感設計

每日Tips根據你的情況來客制化, 更能激勵你

Monday, August 19, 13

Page 35: AppDC 03, App x Design, Tony, Mobile 情感設計

你如果做了運動, 在你的Wall上會先記錄

Monday, August 19, 13

Page 36: AppDC 03, App x Design, Tony, Mobile 情感設計

APP會先預設Default值, 認為你做簡單的運動

Monday, August 19, 13

Page 37: AppDC 03, App x Design, Tony, Mobile 情感設計

你可以更改成特別的運動

Monday, August 19, 13

Page 38: AppDC 03, App x Design, Tony, Mobile 情感設計

而透過點擊活動或睡眠

Monday, August 19, 13

Page 39: AppDC 03, App x Design, Tony, Mobile 情感設計

直接呈現細節, 不同小項目以圖象化表示

Monday, August 19, 13

Page 40: AppDC 03, App x Design, Tony, Mobile 情感設計

UP 的成功 = APP的成功 = 三個情感要素都到位

Enchant me = 進到APP看到自己的狀態, 就覺得相當有趣!

Simplify my life= 記錄我的睡眠和活動, 超級簡單上手

Make me amazing = 原來達到每日一萬步沒那麼難, 超酷的.

Monday, August 19, 13

Page 41: AppDC 03, App x Design, Tony, Mobile 情感設計

SONGZA

Example:

Monday, August 19, 13

Page 42: AppDC 03, App x Design, Tony, Mobile 情感設計

用手機打開聽音樂, 你期待的是什麼?

Monday, August 19, 13

Page 43: AppDC 03, App x Design, Tony, Mobile 情感設計

Monday, August 19, 13

Page 44: AppDC 03, App x Design, Tony, Mobile 情感設計

第一眼就令人驚喜的SONGZA首頁

Monday, August 19, 13

Page 45: AppDC 03, App x Design, Tony, Mobile 情感設計

還有很多功能是藏起來的

Monday, August 19, 13

Page 46: AppDC 03, App x Design, Tony, Mobile 情感設計

而如果你有看到你要的情境

Monday, August 19, 13

Page 47: AppDC 03, App x Design, Tony, Mobile 情感設計

點進去有三個頻道可以選

Monday, August 19, 13

Page 48: AppDC 03, App x Design, Tony, Mobile 情感設計

點了以後開始撥放

Monday, August 19, 13

Page 49: AppDC 03, App x Design, Tony, Mobile 情感設計

喜歡此頻道還可以有更多動作可以作

Monday, August 19, 13

Page 50: AppDC 03, App x Design, Tony, Mobile 情感設計

如果一眼看過去覺的沒有打到你現在的心情

Monday, August 19, 13

Page 51: AppDC 03, App x Design, Tony, Mobile 情感設計

Monday, August 19, 13

Page 52: AppDC 03, App x Design, Tony, Mobile 情感設計

SONGZA 的成功 = 三個情感要素都到位

Enchant me = 一進APP就很舒服, 放歌選擇簡單又輕鬆

Simplify my life= 放歌很快, 找適合的音樂很方便, 找放過的歌也很方便

Make me amazing = 以往看情境挑歌很難, 現在我簡單就放出不同的組合, 超酷!

Monday, August 19, 13

Page 53: AppDC 03, App x Design, Tony, Mobile 情感設計

回顧一下剛剛的分享

1. 簡介情感設計 :

從讓使用者開心 / 避免不開心的角度重新檢視設計

II. 從情感設計, 看Andriod設計原則

這APP令人著迷, 這APP好方便讓我生活變簡單, 這APP讓我變超人!

III. 情感設計的成功範例成功的APP, 三個情感因素都存在

IV. 我該怎麼使用這些情感設計原則呢?

Monday, August 19, 13

Page 54: AppDC 03, App x Design, Tony, Mobile 情感設計

應用設計原則的幾個方法來自Google I/O的建議

Monday, August 19, 13

Page 55: AppDC 03, App x Design, Tony, Mobile 情感設計

1.印出Android設計16條原則, 平時一直瀏覽他們

Monday, August 19, 13

Page 56: AppDC 03, App x Design, Tony, Mobile 情感設計

Android 設計原則

V.S

從情感設計角度研究從情感角度列出問題更容易用在”改善產品 “

開發團隊更容易導入

Apple 人機介面原則

Monday, August 19, 13

Page 57: AppDC 03, App x Design, Tony, Mobile 情感設計

利用16條設計原則 修正自己的APP

目標: 帶來更多正向情感

Monday, August 19, 13

Page 58: AppDC 03, App x Design, Tony, Mobile 情感設計

2. 在爭論不同方案時特別好用

Monday, August 19, 13

Page 59: AppDC 03, App x Design, Tony, Mobile 情感設計

Google的作法:

Monday, August 19, 13

Page 60: AppDC 03, App x Design, Tony, Mobile 情感設計

Monday, August 19, 13

Page 61: AppDC 03, App x Design, Tony, Mobile 情感設計

X 1 X 1

Monday, August 19, 13

Page 62: AppDC 03, App x Design, Tony, Mobile 情感設計

X 1 X 1

Monday, August 19, 13

Page 63: AppDC 03, App x Design, Tony, Mobile 情感設計

最低標準

Monday, August 19, 13

Page 64: AppDC 03, App x Design, Tony, Mobile 情感設計

終極目標

Monday, August 19, 13

Page 65: AppDC 03, App x Design, Tony, Mobile 情感設計

範例: Google Home最後一頁的設計

Monday, August 19, 13

Page 66: AppDC 03, App x Design, Tony, Mobile 情感設計

情境: 當使用者碰到最後一頁, 該怎麼作?

Monday, August 19, 13

Page 67: AppDC 03, App x Design, Tony, Mobile 情感設計

情境: 當使用者碰到最後一頁, 該怎麼作?

可能性A: 什麼也不做

Monday, August 19, 13

Page 68: AppDC 03, App x Design, Tony, Mobile 情感設計

請問身為User, 你會有什麼感受?

Monday, August 19, 13

Page 69: AppDC 03, App x Design, Tony, Mobile 情感設計

Monday, August 19, 13

Page 70: AppDC 03, App x Design, Tony, Mobile 情感設計

可能解法B: 用文字訊息告知

大家覺得如何?

Monday, August 19, 13

Page 71: AppDC 03, App x Design, Tony, Mobile 情感設計

Monday, August 19, 13

Page 72: AppDC 03, App x Design, Tony, Mobile 情感設計

最後的解法

Monday, August 19, 13

Page 73: AppDC 03, App x Design, Tony, Mobile 情感設計

Monday, August 19, 13

Page 74: AppDC 03, App x Design, Tony, Mobile 情感設計

3.Present你的理念時 ,口頭描述這些原則這樣別人也才能從你的理念, 提出更具體的建議

Monday, August 19, 13

Page 75: AppDC 03, App x Design, Tony, Mobile 情感設計

3.Present你的理念時 ,口頭描述這些原則這樣別人也才能從你的理念, 提出更具體的建議

Monday, August 19, 13

Page 76: AppDC 03, App x Design, Tony, Mobile 情感設計

4. 嘗試定義出設計原則的優先次序並修復它讓團隊共同討論出, 想給使用者的主要情感價值

https://s3.amazonaws.com/dexio/slides/398.png

Monday, August 19, 13

Page 77: AppDC 03, App x Design, Tony, Mobile 情感設計

4. 嘗試定義出設計原則的優先次序並修復它

讓團隊共同討論出, 想給使用者的主要情感價值

https://s3.amazonaws.com/dexio/slides/398.png

+

Monday, August 19, 13

Page 78: AppDC 03, App x Design, Tony, Mobile 情感設計

5. 偶爾拿一兩個原則, 特定功能來腦力激盪拋開開發限制 ,單純從情感設計來腦力激盪, 會有意想不到的效果

Monday, August 19, 13

Page 79: AppDC 03, App x Design, Tony, Mobile 情感設計

5. 偶爾拿一兩個原則, 特定功能來腦力激盪

拋開開發限制 ,單純從情感設計來腦力激盪, 會有意想不到的效果

Monday, August 19, 13

Page 80: AppDC 03, App x Design, Tony, Mobile 情感設計

偶爾拿一兩個原則, 特定功能來腦力激盪

Android設計原則, 平時沒事就瀏覽它們

在爭論不同方案時特別好用

Present你的理念時 ,口頭描述這些原則

嘗試定義出設計原則的優先次序並改進它

1.2.3.4.5.

Monday, August 19, 13

Page 81: AppDC 03, App x Design, Tony, Mobile 情感設計

今天的分享-情感設計- 幫助我們自己很多

也希望能幫助到大家....

Monday, August 19, 13

Page 82: AppDC 03, App x Design, Tony, Mobile 情感設計

我們都是創造者, 都努力想給”人”更好的生活

http://www.abc.net.au/reslib/201206/r955169_10229984.JPG

Monday, August 19, 13

Page 83: AppDC 03, App x Design, Tony, Mobile 情感設計

具體地說: 創造更多微笑, 減少更多不便

http://www.turnbacktogod.com/wp-content/uploads/2009/01/ways-to-make-someone-smile.jpg

Monday, August 19, 13

Page 84: AppDC 03, App x Design, Tony, Mobile 情感設計

情感設計: 怎麼樣讓你的使用者多些開心的心法

Monday, August 19, 13

Page 85: AppDC 03, App x Design, Tony, Mobile 情感設計

Android基於情感設計所歸納出的16條原則,

很值得我們借鏡

Monday, August 19, 13

Page 86: AppDC 03, App x Design, Tony, Mobile 情感設計

雖然礙於時間我們無法一一講解

Monday, August 19, 13

Page 87: AppDC 03, App x Design, Tony, Mobile 情感設計

但我們一起分享了很多例子

http://pinterest.com/danilobrizola/mobile-user-interface/

Monday, August 19, 13

Page 88: AppDC 03, App x Design, Tony, Mobile 情感設計

也分享平常能使用的方法

Monday, August 19, 13

Page 89: AppDC 03, App x Design, Tony, Mobile 情感設計

回到最初的問題: Mobile UI要怎麼設計才吸引人?

我想我們可以問自己三個問題

Monday, August 19, 13

Page 90: AppDC 03, App x Design, Tony, Mobile 情感設計

你的APP讓我為之著迷嗎?

Monday, August 19, 13

Page 91: AppDC 03, App x Design, Tony, Mobile 情感設計

你的APP讓我的生活更輕鬆嗎?

Monday, August 19, 13

Page 92: AppDC 03, App x Design, Tony, Mobile 情感設計

你的APP讓我變得更棒更酷嗎?

Monday, August 19, 13

Page 93: AppDC 03, App x Design, Tony, Mobile 情感設計

抓住這三個原則, 從收集使用者的微笑開始 :)

Monday, August 19, 13

Page 94: AppDC 03, App x Design, Tony, Mobile 情感設計

參考資料

1. Android 設計原則官方頁面

http://developer.android.com/design/get-started/principles.html

2. Google I/O , Google 使用者體驗專家發表情感設計與Android原則的演講

https://developers.google.com/events/io/sessions/326368573

Monday, August 19, 13

Page 95: AppDC 03, App x Design, Tony, Mobile 情感設計

謝謝聆聽, Q&A

1. 更多給創業人的設計概念: FB粉絲團1009 Design

2. 創業人設計方法共同學習社群: FB粉絲團 TCUX

3. Tony Tung / 0933-491-051 / [email protected]

Monday, August 19, 13