原型說明咋寫-角標

0 評論 886 瀏覽 7 收藏 4 分鐘

開發吐槽原型說明不清晰,領導催促原型要快細節再說,真是夾縫中生存的產品。今天教大家一個方法,既快又全。

對原型規范&說明模板不明白朋友,可查看:如何解決原型說明寫不全?

本期組件:角標

組件概述:頁出現在按鈕、頭像右上角的數字或狀態標記,引導用戶及時處理未讀信息

一、約定基礎規范

本節主要與研發約定默認實現內容,通過規范文檔維護。

1、顯示位置:在按鈕、標簽頁、卡片等的右上方。

2、不同樣式:樣式不同所表達意思不同,含數字/內容的角標圓圈寬度,需跟隨內容寬度自適應。

  • 數字角標:有新內容,需用戶及時處理
  • 小紅點:有新內容,但重要度不及“數據角標”
  • 內容角標:增加內容標注,以突出不同點

二、約定可控參數

本節主要與研發約定原型中可控制的參數,也通過規范文檔維護。文中會提供示例參數,及參數填寫說明。

1、出現邏輯:有未點擊內容則出現

2、消失邏輯:所有內容已點擊則消失

3、計數規則(僅數字角標):通過點擊內容數量增減

4、最大值(僅數字角標):可角標顯示的最大值,超過顯示‘{max}+’,如:

  • 設置最大99,超出則顯示99+,
  • 設置最大10,超出則顯示10+。

5、顯示內容(僅內容角標):默認如原型所示,有時會隨數據狀態改變內容,則需要說明

三、輸出說明模板

組件名稱前加個“規范”,便于團隊識別規范組件;模板可直接寫入注釋,并存為Axure/墨刀元件庫。

本次說明模板包含數字角標、小紅點、內容角標,可根據實際場景使用,相關說明模板如下

1. 數字角標

組件名稱:規范-數字角標???

出現邏輯:有未點擊內容則出現

消失邏輯:所有內容已點擊則消失

計數規則:通過點擊內容數量增減

最大值:99

2. 小紅點?

組件名稱:規范-小紅點?

出現邏輯:有未點擊內容則出現

消失邏輯:所有內容已點擊則消失

3. 內容角標

組件名稱:規范-內容角標?????????

出現邏輯:有未點擊內容則出現

消失邏輯:所有內容已點擊則消失

顯示內容:如原型所示

結語

本系列持續更新,喜歡的朋友請點個【關注】【收藏】,您的鼓勵是我們持續分享的動力。

本文由 @產品工具庫 原創發布于人人都是產品經理。未經許可,禁止轉載

題圖來自Unsplash,基于 CC0 協議

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

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