Ubiquitous Computing and Ambient Networking Laboratory 1
Google Glass Developers- Design -
Wei-Tsung Su ( 蘇維宗 )[email protected]
09/09/2014 (Ver. 1.0)
Ubiquitous Computing and Ambient Networking Laboratory 2
About Me
Assistant Professor, Dept. of CSIE, Aletheia University, Taiwan
Project Management Professional
Someone who is interesting in writing technical articles except papers?!
Ubiquitous Computing and Ambient Networking Laboratory 3
Change LogDate Ver. Authors Description
09/10/2014 1.0 Wei-Tsung Su Google Developers – Glass Developers - Design
Ubiquitous Computing and Ambient Networking Laboratory 4
Google GlassGoogle Glass 目前還只是一個實驗的計畫
目前 Google 還在透過 Explorer Program 致力於修正使用者介面 (UI) 與使用者體驗 (UX)
嗯 ! 我覺得我們還是做手錶就好
了 !( 設計旁白 )
Ubiquitous Computing and Ambient Networking Laboratory 5
系統規格 (Explorer Edition 2.0)• 相機
– 照片: 5 百萬畫素– 影片: 720p
• 聲音– 骨傳導技術 ( 魔音傳腦 ?)
• 連線– IEEE 802.11b/g– Bluetooth
• 儲存– 1GB RAM– 16 GB Flash (12 GB 可用 )
• Battery– 570mAh
那麼哪裡買的到 Glass?
https://www.google.com/glass/start/
準備美金 1,650 元 ( 含稅 ) 就可以成為 Glass Explorer
Ubiquitous Computing and Ambient Networking Laboratory 6
使用者介面 – Timeline
Home PastPresent / FutureSetting
... ... ...
• Timeline 為 Glass 主要控制介面,其中 Card 為主要元件–卡片 (Card) 人生 ?–系統內建• Home Card• Setting Cards
Ubiquitous Computing and Ambient Networking Laboratory 7
使用者介面 – Timeline – Card
• Static Card– 顯示靜態資訊的卡片– 很少 ( 甚至不會 ) 更新– 通常用做資訊通知
• Live Card– 顯示即時資訊的卡片– 根據環境動態更新– 可存取感測器資料
靜態訊息 根據羅盤動態改變內容
Ubiquitous Computing and Ambient Networking Laboratory 8
使用者介面 – Immersion
• 脫離 Timeline 的全客製化使用者介面
Ubiquitous Computing and Ambient Networking Laboratory 9
使用者介面 – Menu
• Card 和 Immersion 都可以利用 Menu 來進行其他動作
Ubiquitous Computing and Ambient Networking Laboratory 10
使用者介面 – Home Card
• 特性– 位於 Timeline 的中心–喚醒 Glass 時會出現–提供系統層語音與觸控命令
• 語音命令– 「 ok glass 」
Ubiquitous Computing and Ambient Networking Laboratory 11
Glassware 設計原則• Google Glass App 稱作 Glassware
– Google 很重視 Google Glass 的使用者介面 (UI) 和使用者體驗 (UX) ,所以要求 Glassware 符合特定的設計樣式 (design pattern)
• Glassware 的設計原則– 為 Glass 重設計– 需要時才出現– 提供相關資訊– 避免干擾雜訊– 以使用者為本
– 資料來源: https://developers.google.com/glass/design/principles
Ubiquitous Computing and Ambient Networking Laboratory 12
Glassware 設計原則 – 為 Glass 重設計
建議:不要想用 Glassware 去取代智慧型行動裝置上的 App ,而是讓兩個裝置能夠互補。
Ubiquitous Computing and Ambient Networking Laboratory 13
Glassware 設計原則 – 需要時才出現
Glass 的設計原則是當你需要時它才出現;當你不需要時它會滾蛋。
Ubiquitous Computing and Ambient Networking Laboratory 14
Glassware 設計原則 – 提供相關資訊
在對的地點、對的時間提供對的資訊給使用者。
Ubiquitous Computing and Ambient Networking Laboratory 15
Glassware 設計原則 – 避免干擾雜訊
不要太頻繁地在不對的時間傳送資訊 ( 最好都不要 ) 。
Ubiquitous Computing and Ambient Networking Laboratory 16
Glassware 設計原則 – 以使用者為本
使用圖像、口語、或自然的手勢來設計人機介面。
Ubiquitous Computing and Ambient Networking Laboratory 17
「 ok glass 」語音命令設計原則• 聚焦在動作 (action) ,而非下命令。例如,
– take a picture – start camera
• 降低動作的反應時間。例如,– listen toair supply– listen to musicselect air supplyplay
• 是否口語化 (colloguial) 且容易說。例如,– tale a picture– take a photography
• 是否可以應用在不同的 Glassware 上。例如,– listen toair supply– listen to air supply
• 資料來源: https://developers.google.com/glass/design/patterns
Ubiquitous Computing and Ambient Networking Laboratory 18
設計樣式 – Periodic notifications
Ubiquitous Computing and Ambient Networking Laboratory 19
設計樣式 – Ongoing task
Ubiquitous Computing and Ambient Networking Laboratory 20
設計樣式 – Immersion
Ubiquitous Computing and Ambient Networking Laboratory 21
視覺設計 – Card Regions
Ubiquitous Computing and Ambient Networking Laboratory 22
視覺設計 – Main layout
Ubiquitous Computing and Ambient Networking Laboratory 23
視覺設計 – Full bleed with text
Ubiquitous Computing and Ambient Networking Laboratory 24
視覺設計 – Author and content
Ubiquitous Computing and Ambient Networking Laboratory 25
視覺設計 – Left image or column
Ubiquitous Computing and Ambient Networking Laboratory 26
視覺設計 – List
Ubiquitous Computing and Ambient Networking Laboratory 27
結論• 沒有 code? 沒有,這一集只講設計 (design) 。• 請期待下集 !
Ubiquitous Computing and Ambient Networking Laboratory 28
Q & A