中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

本文是作者總結了自己工作中的一次產品迭代，看看如何建立適合自己產品的交互設計規范。

我們公司目前在做的是一款服務于外貿企業的工具性網站，而前一段時間（大概是5月底到6月底）完成了產品的一次大型的迭代工作，這段時間閑了下來，于是便抽了點時間編寫了一套服務于這款產品的交互規范。

在這個過程中能總結出一些心得，在此分享給大家。（PS：本文最后會附上整理的Axure交互規范文件，可供大家參考）

建立規范的要素：

1. 明確自己產品定位和目標 ；
2. 規劃交互規范的內容范圍；
3. 化繁為簡，簡潔易懂。

一、明白自己產品定位和目標

我們的產品是定位于服務于外貿企業用戶的工具，主要目標是幫助客戶建立自己的外貿網站/尋找外貿客戶/客戶管理/外貿營銷，簡單來說就是建站-獲客-管客-營銷-轉化。

所以我們的產品中需要最多的就是控件就是輸入/搜索控件和各類表單圖表，而且在控件的設計上不能設計操作性太復雜的控件（千萬不要為了追求新奇炫酷而去設計比較少見的控件，否則不僅加大前端同學工作量，用戶也不一定用的明白），不然就違背了快速操作反應的原則，在這里建議大家可以參考阿里的Ant design交互規范。

二、交互規范的內容范圍

交互規范內容包括什么？

不同的產品的交互規范范圍內容不同，一般來說網頁端產品的相對移動端產品內容更多，這是因為網頁端產品的頁面布局多樣，交互控件和方式更為復雜；To C網頁產品比To B網頁產品內容更多，因為To B產品目標明確，更注重使用效率，不會采用過于復雜和新穎的頁面布局和交互方式。

而針對我們的產品，交互規范內容總結主要包括以下幾個部分：

1. 設計規范說明

設計規范說明主要描述該設計規范的基本信息：

2. 設計更新記錄

因為交互規范是需要根據項目不斷完善更新的，所以會有很多迭代的記錄，及時記錄更新可以方便其他設計師、前端工程師知道我們更新了什么內容，及時同步給整個團隊。

3. 設計規范主體

主要包括字體規范、色彩規范（這兩個建議和UI設計師共同制定）、頁面布局、工具、控件庫、圖表，在這里我的做法是先匯總出當前產品版本所具有的所有規范內容，再參照Ant design、Material Design、element等設計平臺。

部分已有的規范內容進行升級再整理，同時根據使用場景和優使用頻率，將控件分類和調整排序，這樣基本上交互規范的框架就可以建立起來。

最終我為我們產品確定的交互規范內容展示如下：

三、化繁為簡，簡潔易懂

如果大家通過上述方法來進行設計規范整理，勢必會得到一份體量更加龐大的交互設計規范文件，這個時候，設計師更多的需要根據自己的經驗來進行刪減（會合理刪減的設計師才是優秀的設計師）。

哪些可以刪減？哪些不能刪減？

1. 可以刪減

舉例來說：下面兩個時間范圍篩選器，能達成的篩選目的和作用是一致的，但由于長度不一樣，上面的篩選器能適配的頁面場景更多，所以可以直接把下方的時間篩選器刪減。

2. 不可以刪減

舉例來說：下面兩個選擇器，兩個表面上目的看起來都是進行選擇項選擇，但右邊的選擇器帶有搜索框，適合選擇項數據龐大時的進行搜索選擇，左邊的適合選擇項數據量不大時進行直接選擇，所使用的場景并不相同，所以不能進行刪減。

好的交互規范不需要太多的文字說明，團隊成員直接看圖即可明白這個組件的交互方式（點擊前、點擊后、空數據、有數據、極限情況下等的交互樣式），當然有些不好通過圖稿表達的信息也必須需要文字說明輔助，但相比文字而言，大家更喜歡看的肯定是圖片。

最后附上我自己整理的交互規范axure文件，以供大家參參考

鏈接：https://pan.baidu.com/s/19WuKY4nnE_HQqDT5ASlcKw? 密碼：y5wj

本文由 @李小先生 原創發布于人人都是產品經理。未經許可，禁止轉載

題圖來自 Pixabay，基于 CC0 協議