萬(wàn)字干貨!10大章節(jié)總結(jié) Wear OS App 設(shè)計(jì)要點(diǎn)
可穿戴設(shè)備已經(jīng)逐漸成為人們生活中不可或缺的一部分。Google 推出的 Wear OS(前身為 AndROId Wear)作為一款專(zhuān)為可穿戴設(shè)計(jì)的操作系統(tǒng),為用戶(hù)提供了豐富的功能和便捷的操作體驗(yàn)。
與 Apple 推出的 watchOS 相比,Wear OS 在很大程度上與其擁有著相同的設(shè)計(jì)思路。因此,本文將聚焦于 Wear OS 較為獨(dú)特的設(shè)計(jì)點(diǎn)。更多與可穿戴設(shè)備相關(guān)的設(shè)計(jì)點(diǎn),請(qǐng)見(jiàn)我們先前發(fā)布《設(shè)計(jì) watchOS App》一文。
此外,市面上還有諸多基于 RTOS 的可穿戴設(shè)備。在實(shí)踐中,我們可以將面向 Wear OS 的設(shè)計(jì)直接應(yīng)用至 RTOS。因此,本文的內(nèi)容也適用于 RTOS。
一、設(shè)計(jì)原則
1. 遵循 Material Design 設(shè)計(jì)規(guī)范
Material Design 是 Google 推出的一套統(tǒng)一的設(shè)計(jì)語(yǔ)言。Wear OS 遵循 Material Design 設(shè)計(jì)規(guī)范。因此,在視覺(jué)風(fēng)格和交互體驗(yàn)上,Wear OS 與 Android 高度和諧統(tǒng)一。
2. 專(zhuān)注于關(guān)鍵任務(wù)
應(yīng)專(zhuān)注于一兩個(gè)關(guān)鍵任務(wù),而非完整的應(yīng)用體驗(yàn)。這意味著設(shè)計(jì)應(yīng)簡(jiǎn)潔明了,易于理解和使用。
其原因主要有以下 3 點(diǎn):
① 屏幕尺寸小
Wear OS 設(shè)備的屏幕較小。將關(guān)注點(diǎn)放在關(guān)鍵任務(wù)上可以確保用戶(hù)能快速、輕松地在有限的空間內(nèi)找到并完成他們最關(guān)心的任務(wù)。
② 電池壽命
Wear OS 設(shè)備的電池容量較小。專(zhuān)注于關(guān)鍵任務(wù)可以減少不必要的功能和交互,從而降低設(shè)備的能耗。
③ 避免手腕不適
應(yīng)保證人們?cè)趲酌腌妰?nèi)就能完成手表上的任務(wù),以避免造成人體工程學(xué)上的疲勞或不適。
3. 利用協(xié)同優(yōu)勢(shì)
用戶(hù)通常擁有多個(gè)設(shè)備,而且每種設(shè)備都有其優(yōu)勢(shì)。Wear OS 設(shè)備適合快速、頻繁的任務(wù),而手機(jī)更適合持久和復(fù)雜的交互。因此,在某些情況下,可以同時(shí)使用手表和手機(jī)來(lái)完成同一任務(wù)的不同部分。這種任務(wù)分工可以讓用戶(hù)更高效地完成任務(wù),同時(shí)避免在不適合的設(shè)備上進(jìn)行繁瑣的操作。
由此,設(shè)備間的切換、數(shù)據(jù)同步的體驗(yàn)就顯得至關(guān)重要了。
4. 支持離線(xiàn)運(yùn)行
應(yīng)為無(wú)網(wǎng)絡(luò)和網(wǎng)絡(luò)不佳的場(chǎng)景做好設(shè)計(jì)。
其原因主要有以下 2 點(diǎn):
① 網(wǎng)絡(luò)連接不穩(wěn)定
鍛煉、通勤等 Wear OS 設(shè)備常被使用的場(chǎng)景容易遇到網(wǎng)絡(luò)不佳的情況。
② 減少耗電量
網(wǎng)絡(luò)連接通常會(huì)消耗大量電池電量。離線(xiàn)使用可以幫助節(jié)省電池電量,延長(zhǎng)設(shè)備的使用時(shí)間。
二、手勢(shì)
1. 滑動(dòng)手勢(shì)
在 Wear OS 中,通常使用從左到右的滑動(dòng)手勢(shì)來(lái)關(guān)閉當(dāng)前視圖并返回上一個(gè)視圖,而不是使用返回按鈕。因此,同一頁(yè)面內(nèi)的信息優(yōu)先縱向排布。
對(duì)于需要平移視圖的應(yīng)用(如地圖),可以在左側(cè)屏幕邊緣設(shè)置拖動(dòng)閾值,以避免誤操作。
2. 實(shí)體按鈕
Wear OS 設(shè)備上的實(shí)體按鈕(physical button)也被稱(chēng)為「stem」。
我們可以在某些情況下使用常規(guī)的屏幕手勢(shì),而在其他情況下則使用物理按鈕。這樣既能簡(jiǎn)化用戶(hù)的操作流程,又能保證在需要時(shí)仍然可以通過(guò)物理按鈕進(jìn)行快速切換。
① 類(lèi)型
OS Button
用于系統(tǒng)操作,如開(kāi)關(guān)電源和啟動(dòng)應(yīng)用。所有 Wear OS 設(shè)備都有電源按鈕和啟動(dòng)器按鈕。
Multifunction Button
可以由系統(tǒng)或用戶(hù)配置的按鈕,類(lèi)似于 Apple Watch 上 action button。適用于可以在不看顯示屏的情況下完成的二元操作(binary actions)。例如:
計(jì)時(shí)器中的「暫停/恢復(fù)計(jì)時(shí)」操作
音樂(lè)播放器中的「播放/暫?!共僮?/p>
部分 Wear OS 設(shè)備有多個(gè)此按鈕。但并非所有 Wear OS 設(shè)備都有此按鈕。
② 按壓狀態(tài)
Single Press
按下并迅速松開(kāi)。
Press and Hold
按下并保持按壓狀態(tài) 500ms 或更長(zhǎng)時(shí)間。
③ 設(shè)計(jì)要點(diǎn)
明確功能分配
物理按鈕應(yīng)該具有明確的功能,并且在整個(gè)設(shè)備的所有界面中都應(yīng)該保持一致。例如,主頁(yè)按鈕應(yīng)該總是回到主屏幕,而返回按鈕應(yīng)該總是返回到上一個(gè)界面。
提供反饋
當(dāng)用戶(hù)按壓物理按鈕時(shí),應(yīng)給予明確的反饋,讓用戶(hù)知道他們的操作已經(jīng)被接收。這可以通過(guò)聲音、震動(dòng)等方式來(lái)實(shí)現(xiàn)。
考慮設(shè)備兼容性
不同的 Wear OS 設(shè)備可能有不同數(shù)量的物理按鈕。在設(shè)計(jì)應(yīng)用時(shí),需要考慮這一點(diǎn),確保應(yīng)用能夠在所有設(shè)備上正確工作。例如,如果某個(gè)功能是通過(guò) multifunction button 訪(fǎng)問(wèn)的,那么在沒(méi)有此按鈕的設(shè)備上,應(yīng)提供其他訪(fǎng)問(wèn)該功能的方式。
三、視覺(jué)設(shè)計(jì)
1. 字體排?。═ypography)
Wear OS 的字符樣式體系遵循 Material Design。值得注意的是,「語(yǔ)義化」是其字符樣式體系的核心。
2. 圖標(biāo)(Iconography)
① 遵循 Material Design
一致的圖標(biāo)風(fēng)格助于創(chuàng)建統(tǒng)一的視覺(jué)效果,并提高用戶(hù)體驗(yàn)。因此,應(yīng)遵循 Material Design 的圖標(biāo)設(shè)計(jì)原則,以確保一致性。
② 保證簡(jiǎn)潔
由于 Wear OS 設(shè)備的屏幕較小,圖標(biāo)設(shè)計(jì)應(yīng)簡(jiǎn)潔且易于理解。避免使用過(guò)于復(fù)雜或細(xì)節(jié)豐富的圖標(biāo),因?yàn)樗鼈兛赡茉谛∑聊簧想y以辨認(rèn)。
③ 使用合適的尺寸
通常,建議使用 24 x 24 dp 的圖標(biāo)尺寸,以確保在不同設(shè)備上都能清晰可見(jiàn)。
3. 顏色(Color)
與 watchOS 類(lèi)似,Wear OS 默認(rèn)使用深色模式下的色彩體系。我們可以直接使用 Material Design 顏色主題,也可以使用 Material Theme Builder 自定義。
① 遵循 Material Design
Wear OS 設(shè)備上的顏色設(shè)計(jì)應(yīng)遵循 Material Design 指南。這包括使用 primary color、secondary color、accent color 等來(lái)創(chuàng)建一致的視覺(jué)效果。
② 關(guān)注對(duì)比度
確保文本和背景之間具有足夠的對(duì)比度,以便用戶(hù)能夠輕松閱讀信息。至少應(yīng)滿(mǎn)足 WCAG 的 AA 標(biāo)準(zhǔn),即文本與背景的對(duì)比度至少為 4.5:1。
③ 關(guān)注可讀性
在小屏幕設(shè)備上,選擇清晰易讀的顏色組合。特別是要避免使用飽和度高的顏色。因?yàn)轱柡投雀叩念伾诎瞪尘吧蠒?huì)產(chǎn)生 optical vibrations(光學(xué)振動(dòng)),進(jìn)而導(dǎo)致眼睛疲勞。
④ 減少電量消耗
考慮到可穿戴設(shè)備的電池壽命,盡量使用深色背景和淺色文本。深色背景在 OLED 屏幕上可以節(jié)省電量,因?yàn)樗鼈冃枰^少的能量來(lái)顯示顏色。
⑤ 保證一致性
這有助于創(chuàng)建統(tǒng)一的視覺(jué)效果,傳達(dá)一致的品牌形象,進(jìn)而提升用戶(hù)體驗(yàn)。
⑥ 支持個(gè)性化
考慮為用戶(hù)提供自定義顏色選項(xiàng),以便他們可以根據(jù)自己的喜好或場(chǎng)合來(lái)更改 UI 外觀。隨著 Wear OS 4 的推出,Google 進(jìn)一步深入融合了 Material You 設(shè)計(jì)語(yǔ)言,使得色彩更加豐富,用戶(hù)可以更自由地定義自己喜歡的顏色。
4. 布局(Layout)
不同的 Wear OS 設(shè)備,其屏幕尺寸和形狀均可能不同。特別是圓形和方形屏幕的同時(shí)存在,對(duì) Wear OS 的布局設(shè)計(jì)提出了更高的要求。
① 優(yōu)先為小圓屏設(shè)計(jì)
如果設(shè)計(jì)面向的是矩形屏幕,那么在圓形屏幕上,屏幕角落的內(nèi)容可能會(huì)被裁剪。因此,應(yīng)先為 Wear OS 支持的最小圓形屏幕尺寸(192 dp * 192 dp)進(jìn)行設(shè)計(jì),再為更大的屏幕尺寸進(jìn)行優(yōu)化。
若需預(yù)覽設(shè)計(jì)方案在真機(jī)上的典型表現(xiàn),則可用典型圓形屏幕尺寸(213 dp * 213 dp)。
② 外邊距使用比例
將外邊距定義為百分比而不是絕對(duì)值,以便邊距可以在圓形屏幕上按比例縮放并避免剪切任何 UI 元素。
③ 優(yōu)先使用垂直布局
垂直滾動(dòng)是用戶(hù)在 Wear OS 設(shè)備上查看更多內(nèi)容的自然手勢(shì)。因此,我們應(yīng)優(yōu)先使用垂直布局,以允許用戶(hù)沿著單個(gè)方向滾動(dòng)以瀏覽內(nèi)容。
此外,可滾動(dòng)頁(yè)面還能有效解決屏幕角落的內(nèi)容在圓屏上被裁剪的問(wèn)題。
四、組件
Wear OS 中的組件與 Android 差別不大。因此,這里僅對(duì)比較特殊的組件進(jìn)行簡(jiǎn)述。
1. Button
button 用于用戶(hù)熟悉且不需要文本標(biāo)簽的操作。
從樣式上看,button 一般為正圓型,內(nèi)部展示圖標(biāo)。
若圖標(biāo)無(wú)法描述相關(guān)操作,可使用最多三個(gè)字符的文本。若仍無(wú)法清楚地描述操作,則可考慮使用 chip。
2. Card
card 用于在有限的空間內(nèi)提供簡(jiǎn)潔、清晰的信息。每張 card 應(yīng)該只包含一個(gè)主題的內(nèi)容和操作。這樣可以確保用戶(hù)能夠快速理解 card 的內(nèi)容,并且能夠方便地在各個(gè) card 之間切換。
從樣式上看,card 是帶有圓角和漸變背景的矩形。也可以使用圖片作為背景。
為了避免在圓形顯示屏上被裁剪,card 的高度不能超過(guò)屏幕的 60%。card 的寬度默認(rèn)為容器的最大寬度。
3. List
① Snapping Behavior
在 Wear OS 中,list 組件的滾動(dòng)行為應(yīng)當(dāng)是流暢且直觀的。用戶(hù)應(yīng)該能夠輕松地在列表中上下滾動(dòng),并且列表應(yīng)該能夠自動(dòng)滾動(dòng)以適應(yīng)用戶(hù)的觸摸和拖動(dòng)。此外,當(dāng)用戶(hù)停止?jié)L動(dòng)時(shí),列表應(yīng)該能夠平穩(wěn)地「吸附」到特定位置(通常是屏幕中心),這就是所謂的「snapping behavior」。
為了增強(qiáng)用戶(hù)體驗(yàn),list 組件的 snapping behavior 還應(yīng)該包括適當(dāng)?shù)膭?dòng)畫(huà)效果。例如,當(dāng)用戶(hù)滾動(dòng)列表時(shí),列表應(yīng)該有一個(gè)平滑的滾動(dòng)動(dòng)畫(huà);當(dāng)列表停止?jié)L動(dòng)并「吸附」到一個(gè)項(xiàng)目時(shí),應(yīng)該有一個(gè)輕微的彈動(dòng)效果。這些動(dòng)畫(huà)效果不僅可以讓用戶(hù)清楚地感知到列表的狀態(tài),還可以增加應(yīng)用的吸引力。
② Curved Layout
考慮到許多 Wear OS 設(shè)備使用圓形屏幕,這使得查看屏幕頂部和底部附近的列表項(xiàng)變得更加困難。針對(duì)此問(wèn)題,Wear OS 提供了名為「curved layout」的縮放、淡入淡出效果:當(dāng)元素移向屏幕中心時(shí),其會(huì)變得更大且更不透明。
4. Confirmation Overlay
confirmation overlay 是一種用戶(hù)反饋機(jī)制,用于在用戶(hù)完成某項(xiàng)操作后提供反饋。
從樣式上看,confirmation overlay 會(huì)覆蓋整個(gè)屏幕。
若用戶(hù)的操作導(dǎo)致了可見(jiàn)的 UI 變化,那么就不需要額外的 confirmation overlay 了。因?yàn)椋琔I 的變化本身就是一種反饋。只有當(dāng)用戶(hù)的操作在 UI 中不可見(jiàn),才需要使用 confirmation overlay 來(lái)給用戶(hù)提供必要的反饋。
例如,下圖中的案例里,已通過(guò)消息氣泡的出現(xiàn)表明「消息已發(fā)送」,則不再需要額外的 confirmation overlay 了。
五、關(guān)鍵場(chǎng)景的設(shè)計(jì)
1. 啟動(dòng)應(yīng)用
留下良好的初印象是至關(guān)重要的。因此,應(yīng)提供合適的應(yīng)用啟動(dòng)體驗(yàn)。
① 優(yōu)化性能
應(yīng)用的啟動(dòng)速度對(duì)用戶(hù)體驗(yàn)至關(guān)重要。用戶(hù)希望應(yīng)用能夠快速啟動(dòng)并準(zhǔn)備好使用。為了實(shí)現(xiàn)這一點(diǎn),需優(yōu)化應(yīng)用的初始化過(guò)程,減少在啟動(dòng)時(shí)加載的資源,以避免用戶(hù)在等待內(nèi)容加載時(shí)感到不適。
② 展示品牌
在應(yīng)用啟動(dòng)時(shí),將應(yīng)用圖標(biāo)居中顯示,以提高品牌識(shí)別度。
2. 延遲
為了提供流暢的用戶(hù)體驗(yàn),應(yīng)用的響應(yīng)時(shí)間應(yīng)盡可能短。這意味著在用戶(hù)與應(yīng)用交互時(shí),應(yīng)用需要快速響應(yīng)用戶(hù)的操作。
① 優(yōu)化性能
為了實(shí)現(xiàn)低延遲,可以?xún)?yōu)化應(yīng)用的代碼及使用高效的數(shù)據(jù)結(jié)構(gòu)和算法,減少不必要的計(jì)算和資源請(qǐng)求。
此外,許多 Wear OS 應(yīng)用依賴(lài)網(wǎng)絡(luò)連接來(lái)獲取數(shù)據(jù)和提供服務(wù)。為了減少網(wǎng)絡(luò)延遲,可以?xún)?yōu)化數(shù)據(jù)傳輸,使用高效的數(shù)據(jù)壓縮和傳輸格式,以及在適當(dāng)?shù)臅r(shí)機(jī)進(jìn)行網(wǎng)絡(luò)請(qǐng)求。
② 表明正在進(jìn)行中
讓用戶(hù)知道系統(tǒng)正在積極處理他們的請(qǐng)求,以增加他們對(duì)延遲的容忍度。
值得注意的是,應(yīng)避免使用不確定的加載旋轉(zhuǎn)指示器。建議向用戶(hù)顯示靜態(tài)文本或占位符圖像,以表示正在進(jìn)行的活動(dòng)。
③ 漸進(jìn)展示
在內(nèi)容變得可用時(shí),逐步顯示靜態(tài)元素,如文本元素、可操作按鈕和占位符 UI。
④ 優(yōu)化后臺(tái)進(jìn)程
在 Wear OS 設(shè)備上,應(yīng)用可能會(huì)在后臺(tái)運(yùn)行,以便在用戶(hù)與設(shè)備交互時(shí)提供實(shí)時(shí)信息和更新。為了優(yōu)化后臺(tái)性能并減少延遲,可以使用合適的后臺(tái)任務(wù)調(diào)度策略,避免在后臺(tái)執(zhí)行耗時(shí)操作。
3. 登錄
在 Wear OS 中,登錄是用戶(hù)開(kāi)始使用應(yīng)用的關(guān)鍵步驟。
① 選擇恰當(dāng)?shù)臅r(shí)機(jī)
盡可能僅在適當(dāng)?shù)臅r(shí)候提示用戶(hù)登錄,避免強(qiáng)制登錄。
② 提供上下文
向用戶(hù)解釋登錄的好處和原因。
③ 簡(jiǎn)化登錄過(guò)程
在可穿戴設(shè)備上,輸入信息可能比較困難。因此,應(yīng)盡量簡(jiǎn)化登錄過(guò)程。同時(shí),應(yīng)將登錄方法分組并突出顯示最簡(jiǎn)單的方法。
除了手動(dòng)輸入和 SSO 的登錄方式,還可以考慮使用配對(duì)的手機(jī)設(shè)備來(lái)輔助登錄過(guò)程。用戶(hù)可以在其手機(jī)上輸入登錄信息,然后將信息發(fā)送到 Wear OS 設(shè)備上。這樣,用戶(hù)可以更方便地輸入信息,同時(shí)保持登錄過(guò)程的安全性。
值得一提的是,若手機(jī)登錄相應(yīng)的應(yīng)用,則 Wear OS 應(yīng)用應(yīng)自動(dòng)登錄。
④ 提供指引和反饋
在登錄過(guò)程中,為用戶(hù)提供清晰的指引和反饋。例如,如果用戶(hù)輸入的信息有誤,應(yīng)提供明確的錯(cuò)誤信息,指導(dǎo)用戶(hù)進(jìn)行更正。同時(shí),在登錄過(guò)程中,可以使用進(jìn)度指示器等視覺(jué)元素來(lái)告知用戶(hù)當(dāng)前的狀態(tài)。
⑤ 考慮安全性
在處理用戶(hù)登錄信息時(shí),應(yīng)用需要確保數(shù)據(jù)的安全性。使用安全的加密和傳輸方法,以及遵循最佳實(shí)踐來(lái)保護(hù)用戶(hù)的隱私和信息安全。
⑥ 避免頻繁登錄
盡量減少用戶(hù)需要登錄的次數(shù)。在隱私和安全要求范圍內(nèi),盡可能長(zhǎng)時(shí)間地讓用戶(hù)保持登錄狀態(tài)。
例如,可以使用長(zhǎng)期有效的訪(fǎng)問(wèn)令牌或刷新令牌,以便用戶(hù)在一段時(shí)間內(nèi)無(wú)需再次登錄。這有助于提高用戶(hù)體驗(yàn),減少用戶(hù)在設(shè)備上輸入信息的困擾。
4. 請(qǐng)求權(quán)限
在 Wear OS 中,權(quán)限管理是確保用戶(hù)隱私和數(shù)據(jù)安全的重要環(huán)節(jié)。當(dāng)需要授予手表應(yīng)用權(quán)限時(shí),系統(tǒng)會(huì)顯示一個(gè)對(duì)話(huà)框,讓用戶(hù)選擇接受或拒絕該權(quán)限。因此,應(yīng)用需要在明確需要權(quán)限的時(shí)候和地方請(qǐng)求權(quán)限,例如在提供關(guān)于特定權(quán)限的信息后請(qǐng)求權(quán)限。
若一個(gè)應(yīng)用或 watch face 一次需要多個(gè)權(quán)限,那么權(quán)限請(qǐng)求將依次出現(xiàn);若請(qǐng)求的是手表搭配使用的手機(jī)的權(quán)限而非手表的權(quán)限,則會(huì)引導(dǎo)用戶(hù)前往手機(jī)完成操作;若在手表搭配使用的手機(jī)請(qǐng)求手表的權(quán)限,則會(huì)引導(dǎo)用戶(hù)前往手表完成操作。
① 按需請(qǐng)求權(quán)限
僅在應(yīng)用需要使用相關(guān)功能時(shí)請(qǐng)求權(quán)限。避免在應(yīng)用啟動(dòng)時(shí)請(qǐng)求所有權(quán)限,這可能會(huì)讓用戶(hù)感到困擾。相反,在需要使用特定功能時(shí),向用戶(hù)解釋為什么需要該權(quán)限,并在合適的時(shí)機(jī)請(qǐng)求。
② 保證透明度
在請(qǐng)求權(quán)限時(shí),向用戶(hù)提供清晰的解釋?zhuān)f(shuō)明為什么應(yīng)用需要這些權(quán)限以及如何使用這些權(quán)限。這有助于建立用戶(hù)的信任,提高用戶(hù)對(duì)應(yīng)用的接受度。
③ 簡(jiǎn)化請(qǐng)求
權(quán)限請(qǐng)求應(yīng)該盡可能地簡(jiǎn)單、透明和易于理解。當(dāng)請(qǐng)求訪(fǎng)問(wèn)權(quán)限時(shí),應(yīng)用需要明確說(shuō)明為什么需要這個(gè)權(quán)限,這樣可以增加用戶(hù)的信任度,提高用戶(hù)的授權(quán)率。
④ 優(yōu)雅處理權(quán)限拒絕
如果用戶(hù)拒絕授權(quán)某些權(quán)限,應(yīng)用應(yīng)能夠優(yōu)雅地處理這種情況。例如,可以提供降級(jí)功能,或者在用戶(hù)再次嘗試使用受限功能時(shí)重新請(qǐng)求權(quán)限。同時(shí),需要確保應(yīng)用在缺少權(quán)限的情況下仍能正常運(yùn)行。
六、通知
Wear OS 提供以下 4 種通知模板:
① Standard
適用于大多數(shù)通知。
② Big Text
適用于有較多文本的通知??梢栽谡归_(kāi)時(shí)顯示更多文本。
③ Big Picture
適用于帶有圖片的通知。
④ Messaging
適用于需要回復(fù)信息的通知??烧{(diào)用「Google’s Smart Reply」來(lái)依據(jù)上下文生成回復(fù)建議。
除了展示推送信息,Wear OS 的通知還可以展開(kāi)以提供更多操作,如回復(fù)消息、在地圖上打開(kāi)位置或播放歌曲。
七、表盤(pán)
表盤(pán)是用戶(hù)使用 Wear OS 設(shè)備時(shí)第一個(gè)與之交互的,也是最常用的界面。表盤(pán)不僅可以顯示時(shí)間,還可以通過(guò) complication 顯示相關(guān)、及時(shí)的數(shù)據(jù)。
1. Watch Face
① 以顯示時(shí)間為主
人們平均每天查看時(shí)間 150 次。因此,確保在一瞥之間就能看到時(shí)間信息。
② 支持個(gè)性化
除了實(shí)用性之外,表盤(pán)的外觀也很重要。應(yīng)為表盤(pán)提供自定義選項(xiàng),如顏色、指針和 complication,使用戶(hù)能根據(jù)自己的喜好或場(chǎng)合來(lái)自定義表盤(pán)。
③ 節(jié)能
復(fù)雜的動(dòng)畫(huà)或亮色可能會(huì)消耗更多的電量。因此,應(yīng)使用黑色作為主色,并通過(guò)優(yōu)化算法減少不必要的計(jì)算。
此外,在 Wear OS 中,每個(gè)表盤(pán)都需兼容以下 2 種模式:
Interactive
用戶(hù)與手表互動(dòng)時(shí)的模式。
Always-On DISPlay (AoD)
用戶(hù)未與手表互動(dòng)時(shí)顯示的手表表盤(pán)。為節(jié)省電池壽命,此模式下表盤(pán)上的發(fā)光的像素(即非純黑像素)應(yīng)不超過(guò) 15%。
我們可以使用「Watch Face Studio」來(lái)設(shè)計(jì)表盤(pán)?!竁atch Face Studio」是一款由 Google 開(kāi)發(fā)的用于創(chuàng)建 Wear OS 設(shè)備表盤(pán)的圖形化設(shè)計(jì)工具。它可以幫助設(shè)計(jì)師創(chuàng)建自定義表盤(pán),而無(wú)需編寫(xiě)大量代碼。
2. Complication
與 watchOS 類(lèi)似,Wear OS 中的 complication 是表盤(pán)上顯示的小部件,它們可以顯示來(lái)自應(yīng)用的實(shí)時(shí)信息,例如天氣、日歷事件或健康數(shù)據(jù)等,讓用戶(hù)無(wú)需打開(kāi)應(yīng)用就能獲取所需的信息。
① 類(lèi)型
Wear OS 提供以下 5 種 complication 類(lèi)型:
SHORT_TEXT(短文本)
ICON(圖標(biāo))
RANGED_VALUE(范圍值)
LONG_TEXT(長(zhǎng)文本)
SMALL_IMAGE(小圖像)
LARGE_IMAGE(大圖像)
② 設(shè)計(jì)要點(diǎn)
易于查看
由于尺寸的限制,應(yīng)需選用簡(jiǎn)短的內(nèi)容、合適的大小、形狀和顏色,以確保 complication 的簡(jiǎn)潔性和易讀性。
以?xún)?nèi)容為中心
表盤(pán)組件的價(jià)值在于用戶(hù)只需抬起手腕即可查看所需內(nèi)容,無(wú)需進(jìn)一步交互。
Complications 需定期更新以保持信息的最新性。設(shè)計(jì)時(shí)應(yīng)考慮如何高效地刷新數(shù)據(jù),以最小化對(duì)設(shè)備電池的影響。
保護(hù)隱私
手表伴隨用戶(hù)走遍各處。因此,應(yīng)避免顯示過(guò)于私密的信息。
Wear OS 會(huì)自動(dòng)為應(yīng)用創(chuàng)建一個(gè) app shortcut complication,以允許用戶(hù)直接從表盤(pán)訪(fǎng)問(wèn)應(yīng)用。因此,我們無(wú)需為應(yīng)用創(chuàng)建目的僅為進(jìn)入應(yīng)用的 complication,而應(yīng)專(zhuān)注于設(shè)計(jì)其他類(lèi)型的表盤(pán)組件。
八、Tile
用戶(hù)可以在表盤(pán)上滑動(dòng)來(lái)訪(fǎng)問(wèn)不同的 tile,進(jìn)而快速查看信息和進(jìn)行操作。
與 complication 相比,tile 更適用于信息較多的場(chǎng)景。
1. 構(gòu)成
App Icon
是 tile 中必須包含的元素。
每個(gè) tile 的頂部都會(huì)顯示對(duì)應(yīng)應(yīng)用的 app icon,以幫助用戶(hù)識(shí)別其來(lái)源的應(yīng)用。
這是由系統(tǒng)自動(dòng)完成的。因此,我們無(wú)需在 tile 中手動(dòng)添加 app icon,即使 tile 處于空狀態(tài)也是如此,應(yīng)將精力放在設(shè)計(jì)磁貼的主要內(nèi)容上。
Design Area
是 tile 中必須包含的部分。
Bottom Button
是 tile 中的可選部分。
將 button 放置在距離屏幕底部 6.3% 的位置。
2. 類(lèi)型
Text Centric
用于在 tile 上顯示文本內(nèi)容,以告知用戶(hù)當(dāng)前狀態(tài)并提供明確的操作指引。
Button Centric
用于快速啟動(dòng)特定任務(wù),最多可展示 5 個(gè)操作。
Information Centric
用于顯示進(jìn)度和重點(diǎn)指標(biāo)。
Data Centric
3. 設(shè)計(jì)要點(diǎn)
聚焦單一任務(wù)
每個(gè) tile 應(yīng)僅關(guān)注一個(gè)任務(wù)。
如果應(yīng)用支持多個(gè)任務(wù),可以為每個(gè)任務(wù)創(chuàng)建單獨(dú)的 tile。例如,一個(gè)健身應(yīng)用可以有「運(yùn)動(dòng)目標(biāo)」「鍛煉」「冥想」3 個(gè) tile。
易于查看
盡管 tile 的尺寸比 complication 大,但仍需選用簡(jiǎn)短的內(nèi)容、合適的大小、形狀和顏色,以確保 tile 的簡(jiǎn)潔性和易讀性。
背景色應(yīng)為黑色。不應(yīng)使用超過(guò) 3 種顏色。
保證數(shù)據(jù)時(shí)效性
使用合適的數(shù)據(jù)更新速率,同時(shí)確保能耗得當(dāng)。若展示的是較舊的緩存數(shù)據(jù),則應(yīng)顯示更新時(shí)間。
九、Ongoing Activities
在 Wear OS 中,用戶(hù)能輕松地返回到后臺(tái)正在進(jìn)行的活動(dòng),如計(jì)時(shí)器、音樂(lè)播放器、運(yùn)動(dòng)監(jiān)測(cè)器等。
1. 類(lèi)型
用戶(hù)可以從以下 3 個(gè)位置返回到正在進(jìn)行的活動(dòng):
Watch Face
Tile
在 tile 上顯示簡(jiǎn)潔的內(nèi)容,讓用戶(hù)在節(jié)省電力的同時(shí)能輕松返回到正在進(jìn)行的活動(dòng)。為節(jié)省電量,更新頻率盡量不超過(guò)每分鐘一次。
Launcher
我們可以在啟動(dòng)器入口中顯示有用的信息,以幫助用戶(hù)了解正在進(jìn)行的活動(dòng)類(lèi)型及其狀態(tài)。
2. 設(shè)計(jì)要點(diǎn)
適用
只有當(dāng)應(yīng)用程序正在執(zhí)行用戶(hù)需要持續(xù)關(guān)注的活動(dòng)時(shí),才應(yīng)使用持續(xù)活動(dòng)。
簡(jiǎn)潔
由于屏幕尺寸的限制,持續(xù)活動(dòng)應(yīng)盡可能簡(jiǎn)潔,避免過(guò)于復(fù)雜的設(shè)計(jì)。每個(gè)持續(xù)活動(dòng)應(yīng)只包含少量的關(guān)鍵信息,以便用戶(hù)能快速理解。
節(jié)能
避免過(guò)于頻繁地更新持續(xù)活動(dòng)的狀態(tài)。只有當(dāng)狀態(tài)發(fā)生重要變化時(shí),才應(yīng)更新顯示。
及時(shí)結(jié)束
設(shè)計(jì)明確的結(jié)束條件,以便用戶(hù)知道何時(shí)活動(dòng)已完成或可以被終止。例如,計(jì)時(shí)器到達(dá)設(shè)定時(shí)間、音樂(lè)播放完畢或健身活動(dòng)達(dá)到目標(biāo)等。
十、System Ambient Mode
當(dāng)用戶(hù)在一段時(shí)間不與手表交互時(shí),Wear OS 會(huì)自動(dòng)切換到被稱(chēng)為 system ambient mode 的低功耗模式。這與 watchOS 的 Always-On 類(lèi)似。
對(duì)于特定的使用場(chǎng)景(如在跑步時(shí)查看心率和配速),我們可以設(shè)計(jì)應(yīng)用在 system ambient mode 下顯示的內(nèi)容,以便用戶(hù)在不消耗大量能量的情況下獲取所需信息,以運(yùn)行用戶(hù)在此模式下執(zhí)行一些基本的操作。
為了節(jié)省電能,我們可以:
① 減少發(fā)光像素量
讓屏幕的大部分區(qū)域保持黑色。僅顯示關(guān)鍵信息,在用戶(hù)進(jìn)入交互模式時(shí)提供更多詳細(xì)信息。
② 避免使用高亮度或飽和度的顏色
因?yàn)檫@些顏色可能會(huì)導(dǎo)致屏幕燒錄。應(yīng)盡量使用柔和的顏色。
③ 降低內(nèi)容更新頻率
例如,將計(jì)時(shí)器顯示為最接近的分鐘,而不是最接近的秒。
結(jié)語(yǔ)
設(shè)計(jì) Wear OS app,需充分利用這個(gè)平臺(tái)的特性。通過(guò)遵循 Wear OS 的設(shè)計(jì)最佳實(shí)踐,相信我們可以創(chuàng)建出既美觀又實(shí)用的 Wear OS app。希望你能從本文獲得一些啟發(fā),并與我們一起推動(dòng)腕上體驗(yàn)設(shè)計(jì)的發(fā)展。
參考資料:
- Material Design 3
https://m3.material.io/ - Build apps for the wrist with Wear OS:https://developer.android.com/wear
- Create beautiful, power-efficient apps for Wear OS:https://youtu.be/jpUVamtoKOs
- How to build high quality experiences on Wear OS:https://youtu.be/82HB6ziP1QY?
- Create your first Tile in Wear | Workshop:https://www.youtube.com/live/Q7xudRfN188
- Android Developer Story: Spotify on Wear OS:https://youtu.be/URx8_ZRR7ls
- What's new in Wear OS by Google (Google I/O '18):https://youtu.be/VZVosFzD9NU
- Now is the time: What's new with Wear | Session:https://youtu.be/kYIb9g1r4lw
作者:We-Design
想了解更多網(wǎng)站技術(shù)的內(nèi)容,請(qǐng)?jiān)L問(wèn):網(wǎng)站技術(shù)
本文來(lái)源:http://gagu89.com/seodongtai/19861.html