排版和語言學(Linguistics)
原則
由於螢幕的顯示區域非常有限,而且字體大小必須適當地大,因此顯示的字串長度只保持在適當的長度是非常重要。
- 標題不應超過一行。 如果標題太長,未顯示的部分將被替換為“...”。 請確保使用短標題。
- 按鈕上的字串必須盡可能簡短,並且字串應適合預設按鈕大小。 太長的字串將被截斷,因此使用者將無法看到使用語音命令的描述。
- 此外,在規劃字串的長度時,還需要考慮多國語言問題。
Zenbo 的使用者介面使用 Roboto 字體中的四種字體。 這些字體在各種狀態或條件下組合使用,他們是:
- Roboto light
- Roboto regular
- Roboto medium
- Roboto bold
結構
- 系統按鈕
系統按鈕的顏色是根據字串的意義來使用,分別為藍色(#12afe2)、紅色(#ff0c57)和綠色(#03c4b4)。
字體
Blue: Roboto medium, 50dp, #12afe2
Red: Roboto medium, 50dp #ff0c57
Green: Roboto medium, 50dp #03c4b4
文字縮減規則
系統按鈕上的文本應該簡短(用作命令使用)。 如果系統按鈕上的文本太長,設計者可能會將字體大小減小到 40dp。 如果文本字串仍然不合適,則應使用較短的字串。 或者,可以以“…”替換最後顯示的最後一個音節或該文字之後的所有內容。
- 網頁瀏覽模式
網頁瀏覽器按鈕的配置和字體與系統按鈕略有不同,以符合使用者的網頁瀏覽習慣。
字體
Roboto medium, 40dp, #12afe2
文字縮減規則
網頁瀏覽器上按鈕的字串、字體和尺寸都小於系統按鈕。 每個網頁瀏覽器按鈕都應標示最簡短的字串(也用作語音命令)。 如果字串太長,設計者可以將字體大小減小到 32dp,或者進一步減小到 28dp,超過兩行。 如果字串仍然不合適,則應使用較短的字串。 或者,可以以“…”替換最後一個音節或該文字之後的所有內容。
使用
遵循長字串截斷原則,使用簡短詞。
不要這樣使用
使用最簡短的詞。 不要使用過長的字串或更改字體大小而影響可讀性。
- 編號選項
如前面關於顏色和元件的部分所述,系統的編號選項有兩種尺寸,每種尺寸都有其使用場景。 使用的字體也受相關大小和字串縮減規則的約束。
無邊框的大編號選項
沒有黑色邊框的大選項僅用於單列或雙列選單。
Single-digit numbers: Roboto bold, 92dp, #ffffff
Two-digit numbers: Roboto bold, 70dp, #ffffff
Three-digit numbers: Roboto bold, 58dp, #ffffff
Four-digit numbers: Roboto bold, 45dp, #ffffff
帶邊框的小編號選項
帶有黑色邊框的小選項僅用於水平聯絡人列表或grid view。
Single-digit numbers: Roboto bold, 65dp, #ffffff
Two-digit numbers: Roboto bold, 55dp, #ffffff
Three-digit numbers: Roboto bold, 42dp, #ffffff
Four-digit numbers: Roboto bold, 32dp, #ffffff
- 列表項目
單列選單有多種形式。 如果背景配置包含簡要介紹,請遵守以下關於字體大小的使用限制。
A. 主要內容右側附有單一資訊
標題
Roboto medium, 55dp, #ffffff
內容主體
List items: Roboto medium, 72dp, #ffffff
List subtitles: Roboto light, 45dp, #ffffff
List right-side details: Roboto medium, 55dp, #ffffff
文字縮減規則
所有字串都必須簡短。 如果一個字串超過了單行的空間,字體大小會自動縮小到45dp並分成兩行,或者最後一部分會被替換為“...”,表示字串繼續。
B. 主要內容右側附有2項資訊
標題
Roboto medium, 55dp, #ffffff
內容主體
List items: Roboto medium, 72dp, #ffffff
List right-side details: Roboto medium, 45dp, #ffffff
List right side sub details: Roboto light, 45dp, #ffffff
C. 單行組成的內容
標題
Roboto medium, 55dp, #ffffff
內容主體
List items: Roboto medium, 72dp, #ffffff
文字縮減規則
在這種配置中,如果文本超過一行的空間,字體大小會自動縮小到 45dp 並分成兩行。
D. 兩行組成的內容
標題
Roboto medium, 55dp, #ffffff
內容主體
List items: Roboto medium, 72dp, #ffffff
List subitems: Roboto medium, 45dp, #ffffff
文字縮減規則
在此配置中,如果標題和副標題超出分配的空間,請在末尾加上“...”
- Grid View
Grid view有多種形式。 請遵守以下關於字體大小的使用限制。
A. 聯絡人名單
在聯絡人列表中,使用者將讀出號碼或命令標籤作為語音命令。 因此,顯示的標籤應盡可能簡短。 如果他不適合兩行,請將字體大小減小到 45dp 並將“...”加在最後一段。
使用
縮短字串的長度並在末尾加上“...”。
不要這樣使用
在這種配置中,一個字串被限制為最多兩行。 必要時使用“...”。
B.多媒體grid view
在多媒體grid view中,使用者將以語音命令的形式大聲朗讀數字。 因此只顯示一小行字串。 過長的字串必須用“...”截斷。
使用
字串僅提供一行空格,因此在必要時使用“...”。
不要這樣使用
在grid view中,字串被限制為最多一行。 必要時使用“...”.
- 提示頁面
提示頁面分為標題區和內容區。 每個可用作語音命令的字串都附有一個語音控制圖示,以便使用者能夠準確地大聲朗讀命令。 適用的字體大小定義如下:
標題
Roboto medium, 55dp, #ffffff
內容主體
Content title: Roboto medium, 72dp,
List items: Roboto medium, 72dp, #ffffff