產品經理們標注原型的方法都有哪些?

0 評論 1099 瀏覽 7 收藏 6 分鐘

現(xiàn)在不少同學都會在原型上補充文字標注,以更好傳遞設計想法。本文分享了四種標注方式,看看你們用的是哪一種呢?

為什么需要原型標注?

在實際的原型設計過程中,大部分產品經理或者交互設計師都會在原型中添加一些文字標注,文字標注配合原型界面可以更完善更準確地傳達設計想法。筆者調查了多位資深產品經理,分析了大家在原型中添加標注無外乎以下幾種情況:

  1. 描述數(shù)據(jù)狀態(tài)
  2. 描述業(yè)務邏輯規(guī)則
  3. 說明頁面異常情況
  4. 交互制作成本高或無法實現(xiàn),采用文字標注
  5. 整理彈框的提示文案

原型標注的方法有很多,每個產品經理、交互設計師都有自己的原型標注習慣、標注方法。雖然標注的方法有很多,但找到適合自己團隊的標注方法才是最重要的。

原型標注的目的就是為了向團隊成員說明我們的設計想法與設計意圖,作為原型界面的補充說明。

縱觀大部分原型的標注主要是以下四種:

01 箭頭標注法

箭頭標注法就是通過帶有箭頭的直線連接標注對象及標注文字。

一般情況下標注的文字放置在原型左右兩側,當標注較多時,注意這些連接線不能交叉,否則將影響原型文檔的可讀性。

為了保證標注美觀優(yōu)雅,標注的文字要做到以下幾點:

  • 保持統(tǒng)一的對齊方式,一般為左對齊
  • 文字的字號小于原型字號,一般為12pt或13pt
  • 文字顏色要與背景形成較大反差, 白色背景可采用紅色標注
  • 養(yǎng)成為標注添加標題的習慣

Axure原型設計案例源文件演示及下載地址:https://lvoedu.axshare.com/

優(yōu)點:可讀性高,查看方便

缺點:線條繁雜,界面與標注之間的界限不清晰

02 編號標注法

與箭頭標注法類似,在界面左右兩側添加標注文字。與箭頭標注法不同的是這種標注方法沒有直連連接,而是利用Axure自帶的圓形標記或水滴標記給標注對象和標注文字進行編號,需要注意的是標注對象和標注文字的編號要保持一致,否則將影響文檔的易讀性與理解成本。

優(yōu)點:界面與標注界限分明,界面清晰明了

缺點:標注文字與標注對象的關聯(lián)性較弱

03 說明標注法

說明標注法就是Axure自帶的說明功能,支持為元件、頁面添加標注,可以為每一個元件、頁面添加多條標注。

標注的方法很簡單,選中標注的元件對象或頁面,在說明面板輸入標注的文字內容,說明面板提供了簡易的文本編輯器,可以調整文字的字體、顏色,為文本內容添加項目編號。需要注意的是,頂部工具欄無法設置這里的文本樣式。

查看原型時,標注對象的周圍會出現(xiàn)一個帶有編號的黃色標記。標注的內容默認是隱藏的,點擊黃色編號顯示標注內容,點擊關閉按鈕則隱藏標注內容。

優(yōu)點:可靈活控制標注內容的顯示與隱藏

缺點:不夠直觀,用戶需要點擊才可以查看

04 動態(tài)面板標注法

在界面中添加動態(tài)面板,設置動態(tài)面板的高度等于窗口的高度,通過頁面載入事件實現(xiàn),寬度可以根據(jù)實際情況靈活設置。

我們可以把這個動態(tài)面板當做一個Word頁面,在這里隨意編輯、排版文字,就好像我們在Word里編寫需求文檔一樣。

優(yōu)點:堪比Word的編輯效果,閱讀體驗較好

缺點:標注對象與標注文字關聯(lián)性差,理解成本高

小結

上面介紹了幾種原型標注的方法以及優(yōu)缺點分析,在實際工作中使用哪種方法要依據(jù)具體情況而定。

找到適合自己團隊的標注方法才是最重要的,尤其要考慮到開發(fā)、測試同學的閱讀習慣及理解成本。

不知道各位產品經理、交互設計師們都使用了哪些標注方法?又或者開發(fā)、測試的同學都喜歡哪種標注方法,歡迎大家在評論區(qū)留言討論。

本文由 @PM_墨兮 原創(chuàng)發(fā)布于人人都是產品經理。未經許可,禁止轉載

題圖來自Unsplash,基于CC0協(xié)議

該文觀點僅代表作者本人,人人都是產品經理平臺僅提供信息存儲空間服務。

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 目前還沒評論,等你發(fā)揮!