Google Android Wear 設(shè)計規(guī)范學習心得

2 評論 29484 瀏覽 9 收藏 15 分鐘

1

寫在正文前的幾句話

隨著Apple Watch明年開始發(fā)售,可穿戴設(shè)備市場會逐漸火起來,這里的主因不是因為Apple Watch會像當年的iPhone 4一樣開啟了智能手機時代,更主要的原因是智能手機越做越大,便攜性越來越差。用戶需要一個更為便攜的設(shè)備來滿足一些需要快速完成的任務(wù)。筆者購買了iphone 6 Plus后就遇到了這樣的問題,個頭太大不好放進衣服的兜里,只好放在包里,當需要時還要停下腳步或正在做的事情從包里拿出手機。這個過程每天都要重復好幾十次甚至有時會上百次。觀察下你身邊的人是不是也有類似的情景發(fā)生?

智能穿戴設(shè)備,無論是手表還是眼鏡就會解決這個問題,不因為別的,貼身性就是最大的優(yōu)勢,這些設(shè)備與手機互聯(lián),在不方便使用手機的時候完成簡單的任務(wù),當拿起手機時能無縫的延續(xù)之前在穿戴設(shè)備上的進度。智能手機會徹底變?yōu)閭€人隨身終端,穿戴設(shè)備擔負起部分智能手機的工作,這才是未來移動互聯(lián)網(wǎng)的寫照。

關(guān)于Google Android Wear Design?

Google在發(fā)布第一款Android Wear的時候就同步推出了設(shè)計規(guī)范,從設(shè)計規(guī)范開篇Google就希望所有的開發(fā)者可以嚴格按照規(guī)范來設(shè)計Android Wear上的應(yīng)用。另外需要提及的是Android Wear的設(shè)計規(guī)范與Material Design風格上有很高的相似度,為了保證設(shè)計的一致性建議手機APP的設(shè)計風格最好采用Material Design,這也是Google現(xiàn)在提倡的統(tǒng)一平臺和各個交互間的用戶體驗。

? Android Wear設(shè)計基本原則

卡片流

與手機和平板一樣,Android Wear的通知信息也采用了垂直排列的卡片流形式,區(qū)別在于Android Wear每次只會顯示一張卡片以及一個背景圖組成的簡短信息。這種設(shè)計的意義在于讓用戶抬起手腕掃一眼就能掌握信息,想要更進一步時滑動下卡片就能獲取隱藏起來的更多信息或打開應(yīng)用。

自然交互

得益于Google的語音識別和語義分析技術(shù),可以將應(yīng)用與系統(tǒng)設(shè)定的口令關(guān)聯(lián)使用戶可以用最自然的語音輸入方式達到目的。

設(shè)計規(guī)范文檔相當詳細,就不全部翻譯了,下邊的圖片是筆者總結(jié)的要點摘要,僅供大家參考:

2

關(guān)于2D Picker

2D Picker是Android Wear獨有的信息架構(gòu),2D Picker里的“D”可以理解為軸向,只能在水平軸向選取選項的為“1D Picker”,例如音樂播放應(yīng)用中在一個音樂專輯中切換音樂。如下圖:

3

已經(jīng)有水平軸向后再加上一個垂直軸向就是2D Picker,還是用音樂播放應(yīng)用舉例來說就是從當前播放的專輯切換到另一個專輯,如下圖:

4

語音命令

Android Wear支持系統(tǒng)層級和應(yīng)用層級兩種類型的語音命令,前者是控制系統(tǒng)功能模塊,例如“設(shè)置幾點的鬧鐘”、“開始計時”。后者是控制已安裝的應(yīng)用,用戶需要先說出“開始(Start)”作為激活命令,之后再說出具體的命令。

注意:目前Android Wear不支持中文命令。

下面這個表格是Android Wear支持的語音命令:

目的 口令例句
call a car/taxi叫輛車/出租車 “OK Google,get me a taxi”“OK,Google call me a car”
Take a note記筆記 “OK Google,take a note”“OK Google,note to self”
Set alarm設(shè)定鬧鐘 “OK Google,set an alarm for 8 AM”“OK Google,wake me up at 6 tomorrow”
Set timer設(shè)定計時 “OK Google,set a timer for 10 minutes”
Star/Stop a bike ride開始/停止騎自行車 “OK Google,start cycling”“OK Google,start my bike ride”

“OK Google,stop cycling”

Start/Stop a run開始/停止跑步 “OK Google,track my run”“OK Google,start running”

“OK Google,stop running”

Start/Stop a workout開始/停止鍛煉 “OK Google,start a workout”“OK Google,track my workout”

“OK Goolge stop workout”

Show heart rate顯示心率 “OK Google,what’s my heart rate?”“OK Google,what’s my bpm?”
Show step count顯示步數(shù) “OK Google,how many steps have I taken?”“OK Google,what’s my step count?”

Android Wear 設(shè)計模式

交互方式

Android Wear支持點擊、長按、滑動、語音、手掌這5種交互形式。

5

1、通知卡片、可操作、確認動畫

你在某天的晚上你戴著Android Wear來到了一個餐廳,這時手腕感到了微微的震動后抬起手腕掃了一眼,發(fā)現(xiàn)你的好基友也來過這個餐廳并且還很喜歡這里。

6

通知卡,最基本的信息通知展示形式

既然好基友來過這里,那為了證明你和他的友誼那就簽個到吧,順便表示下我來這里不是因為你……

7

?? 通知出現(xiàn)—滑動卡片—頁面出現(xiàn)簽到按鍵—點擊—操作確認動畫(包含結(jié)果)—結(jié)束

接下來換成基友視角,幾天前還是相同的時間,你的基友第一次來到這家店……

8

?????? 通知出現(xiàn)——點擊簽到——操作確認動畫(包含結(jié)果)——結(jié)束

接下來修改下劇本,在某日你陪女友去購物中心購物,到了晚飯時間打算在購物中心里找家餐廳解決下肚子問題,你帶著女友進入了一家店,這時手腕傳來震感后抬手一看,發(fā)現(xiàn)推送來的通知里的店名不是這家店,心里一邊嘀咕著“什么破室內(nèi)定位,一點兒都不準“一邊準備修改下位置……

9

通知出現(xiàn)——滑動當前卡片——點擊修改位置——垂直切換選項——點擊選項——操作確認動畫(包含結(jié)果)——結(jié)束

以上三個范例是非常具有代表性的,從中可以看出通知卡片分為僅包含信息和帶有可操作特性兩種,前者適用于大多數(shù)情況,后者需要取決于產(chǎn)品形態(tài)。不管是哪種模式都有簽到的操作確認動畫和結(jié)果,這里強調(diào)動畫的原因是簽到這個功能一方面是非高頻操作,其次是需要向服務(wù)器返回結(jié)果,而返回數(shù)據(jù)期間需要用動畫來告訴用戶應(yīng)用運行正常。

2、1D picker、2D picker

你走在上班路上聽著音樂,走到十字路口等紅燈時想換首音樂……

?10

滑動當前卡片——點擊切換歌曲——垂直切換選擇歌曲——點擊卡片——播放選中的歌曲

到了公司坐到椅子上,想換個適合工作時候聽的專輯……

11

?? 滑動當前卡片—點擊切換專輯—垂直切換專輯—左右選擇歌曲—播放選中的歌曲

這兩個范例是典型的1D Picker和2D Picker,關(guān)于這兩者區(qū)別在文中已做了說明就不再重復了,這里要強調(diào)的是如果產(chǎn)品的某個功能符合用戶高頻使用或要求快速響應(yīng)特點的,不要加入確認動畫。

3、語音

涉及到語音的使用時有個細節(jié)要注意下,涉及到與其他人之間溝通的時候,語音輸入的內(nèi)容直到發(fā)送完成前是可以“反悔”的,發(fā)送中狀態(tài)會用倒計時的方式來給用戶最后幾秒鐘來決定是否發(fā)送,但是如果用系統(tǒng)預設(shè)的快捷回復則不需要用戶最后確認。

在聽音樂的時候總會遇到一些自己非常喜歡的歌曲,為了不想錯過會想辦法創(chuàng)建一個只有自己摯愛歌曲的專輯……

12

滑動當前卡片—點擊創(chuàng)建專輯—說出專輯名稱—語音識別—創(chuàng)建專輯—當前歌曲保存到創(chuàng)建的專輯中

來了個短信,但手機放在包里或不在手邊而又懶得去拿……這種情況比較多見,這時如果佩戴著Android Wear就可以快速回復短信,還不用敲鍵盤打字。

13

???? ?滑動卡片—點擊回復—說出短信內(nèi)容—語音識別—發(fā)送中—發(fā)送完成

在有些場景下不太方便使用語音回復,例如在電影院、圖書館、學校上課和會議中等,這個時候可以用預先設(shè)定好的回復來解決問題。

14

?????? 滑動卡片—點擊回復—點擊google圖標—選擇快捷回復句—發(fā)送完成

4、全屏化、退出

Android Wear對應(yīng)用全屏顯示有限制條件,只在卡片無法承載內(nèi)容時可以全屏化,之后要可以立即退出全屏化。做出這些限制的目的是避免應(yīng)用侵占Android Wear作為手表的主要用處——全屏顯示時鐘。

接下來舉例來說明進入和退出全屏化的設(shè)計:

某天你要去赴個約會,約會地點是你不熟悉的地方,最保險的做法是打個車過去,你利用Android Wear上的打車應(yīng)用成功叫到車到達目的地后想對司機的服務(wù)打個分……

15

??? 點擊卡片上的星星圖標—全屏化進入打分界面—打分—退出全屏化回到卡片

有的應(yīng)用特別是發(fā)送信息后不能自動退出需要等待另一方應(yīng)答,按之前看到的短信回復的范例來看,發(fā)送信息成功后要不是退出或停留在發(fā)送成功頁。這兩個設(shè)計都不是符合要求的,退出應(yīng)用不符合業(yè)務(wù)需求,停留在發(fā)送成功頁看著還能接受,但不符合設(shè)計規(guī)范的全屏化后迅速退出全屏的要求。關(guān)于這部分的設(shè)計可以參考下面這個叫車應(yīng)用范例:

16

叫車請求發(fā)布成功后頁面從全屏化退出進入了等待應(yīng)答卡片頁

在Android Wear上的退出方式有以下幾種:設(shè)備上的返回主頁按鍵、應(yīng)用內(nèi)含有退出功能、長按屏幕、用手掌捂住屏幕、滑屏退出(僅限全屏化下)。下面看看范例:

17

???????????? ???????????????應(yīng)用內(nèi)含有退出功能

18

????????????? 長按屏幕后出現(xiàn)退出按鍵

19

?????????????????????? 手掌捂住屏幕后應(yīng)用退出

20

?????????????????? 應(yīng)用全屏化后滑動屏幕快速退出

本文為作者量產(chǎn)型(微信號:Lostman_D)投稿發(fā)布,轉(zhuǎn)載請注明出處并附帶本文鏈接

更多精彩內(nèi)容,請關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號或下載App
評論
評論請登錄
  1. 第一張圖片壓根看不清,求清楚圖片。。 ?

    來自北京 回復
    1. 額,點擊就好啊

      來自江蘇 回復