如何規範ui設計原型圖

規範UI設計原型圖的方法如下：

1、繪製原型圖的尺寸。考慮到繪製與查看原型圖的便利性，以及大部分產品與開發人員使用小屏幕筆記本，當前原型圖的尺寸一般採用375乘以667px，相當於iPhone 6s屏幕尺寸的一半，以iOS系統為主，安卓系統個別頁面單獨做圖説明。

2、原型圖常用組件尺寸。指經常使用的通用組件，如狀態欄、頂部導航欄、底部導航欄等，這裏由於最大寬度已經確定都是375px，因此關注的是各通用組件高度。狀態欄可以設置為母版高度是20px，頂部導航欄高度44px，底部tab導航欄高度49px。

3、對齊。頁面中的模塊或元素不能隨意放置，要保持對齊性，這樣呈現出的效果才規整有序。

4、親密關聯。也就是經常提到的格式塔原理的演變，是指內容屬性可以劃歸為一組的，在位置佈局上距離相近，不同屬性內容之間的距離相對遠一些。

5、對比和重複。頁面不同元素之間要有對比效果，目的是更清晰的組織信息、使層級關係明瞭，能夠引導用户瀏覽並且製造焦點。設計的某些元素可能在整個頁面中多次出現。重複的元素可能是某個模塊、一條分割線、某種粗字體、某類型圖標標識等。