讓原型更加高保真,重要的規範是字體、字號、間距、對齊

現在部分產品職責中要求中高保真的原型，而是否要求產品經理輸出高保真原型有著相反的兩種主張，主要矛盾在於時間成本以及影響到了設計師設計。這篇文章裡不討論這個問題，僅僅表述下，筆者作為一個技術出身的產品經理，如何學會能夠快速地產出高保真原型的，以下寫的也是態度篇，文字較多，期望能夠給各位看官大老爺提供個參考。

方是方，圓是圓，規範最重要。

以前我的做法會是找找優質元件庫，就我個人而言，這是走了段彎路。好的元件即使它精緻且白搭，但對於產品設計來說其實也是不利的，我們做的產品是為了貼合場景、服務用戶、優化體驗，而不是為了對上漂亮的元件。做得demo多了慢慢發現讓原型更加高保真，重要的規範是字體，是字號，是間距，是對齊。

一、字

1. 字體統一，一般不要用幾種字體，就選常用字體就行，1~2種足夠；
2. 字號不要亂，一級標題、二級標題、正文、簡介描述等等字號大小都儘可能的統一；
3. 顏色規範，標題、正文、描述等等顏色事先統一併做出相應的區分。

這裡可以把規範事先定好（如圖），但並不需要很硬的將規範事先畫出來，能夠在設計過程中根據實際情況調整為最佳，主要是各個部分的一致性。這種參考數值的圖，更多是用在最終稿設計完成後展示設計的數值，而並不能稱之為參考數值。

小貼士：善用Axure中的基本元件，添加幾個要用的規範文字元件不花時間，也可以直接將本身的元件更新。做好一套就行，不斷迭代。操作不詳說了，假設不清楚，點點如下圖的幾個畫圈標註的地方就大致了解了。

二、圖

主要會用到的圖片為以下幾種，背景圖、展示圖（廣告/產品/文章等）、圖標。在高保真原型設計中，主要考慮的是背景圖和圖標。對Axure自帶的圖片元件不太喜歡的，找幾張接近項目主題的代替下就行了。

圖標還好，目前各icon網站提供的素材都不錯，我會經常在各個UI設計的網站上看看，但是一般取icon就在https://www.iconfinder.com/找上一套，實在沒成套的，就按同風格的湊一套。不用太花時間，一開始實在不好找，就用小方塊代替也可以的。

背景圖在整體設計中最為影響項目的體驗，也是在設計中會要多花些時間，這時候，看看競品、和設計師溝通都是不錯的方法。之所以重視它，因為顏色、背景等對產品內容、功能等布局有所影響的，在產品設計之初就做出思考，更有可能做出最佳體驗的設計。且對於整個項目來說，會減少設計師反覆修改的時間。

我們都是期望做出更好的產品，產品原型設計時就能得到各方的建議是好事，不用真等到原型設計後再反覆修改。而且多數情況項目開發的流程是瀑布模型，要抓好用戶體驗以及產品研發效率，可以靠我們產品多把把關多做點事。畫原型別太隨意，時刻提醒自己保持更新迭代，讓烏龜越畫越好。

小貼士：同一頁面的圖儘量用同一色系的，產品圖等用透明背景的，要麼就有淺灰色背景框替代。為什麼不用原型工具裡的，顏色和樣式太吸引眼球的話，會把注意力帶偏。

三、間距

間距設定主要一大問題就是統一，千萬不要隨緣對齊，規規矩矩的按統一的大小排列整齊。各同類間距做到一致，規規矩矩的對齊。

其它各個元素之間的間距留白也有技巧，這裡就不延伸了。這裡每次設計到時都做些許調整會讓作品變得更好，儘量的使用動態面板或母版，每次更新時要調整的內容就少很多了。儘量做到可復用，簡單修改就能做好每個相關頁，不至於讓更新變得消極，頁面太多確實容易心態爆炸。

四、對比競品

多看看和競品的區別，在相似項目上找經驗，千萬注意度，這裡可不能是臨摹或抄襲。還有一個較重要的是，仔細的看看自己原型與設計師做完後的提高，這會讓自己很快的接收一大波經驗，下次肯定會做得更好。色彩儘量的淡，主要還是找準布局，在前人創作上做迭代沒理由做得很差的。

五、比上一次做得好

請時刻提醒自己，自己的手藝也要有更新迭代。每次開始做的新內容，我們能做出更好設計的話，起點天然會高點，後續接手的同事也會帶來更多優化。

高保真原型的產出也不是一看就會的，這項技能需要我們通過日常工作不斷進步，但請相信，它並不困難，相反非常的簡單。完全可以通過我們日常工作中做的原型進行不斷更新迭代，努力將原型一次做得比一次好。快則三兩月，最終設計高保真原型就如同習慣一般，自然而然的就做出來了。

有些童鞋為什麼做了很長時間都不能產出高保真原型，因為單單練習只能讓自己對工具更加熟練。就如練字，字不用心去寫好，寫多了，反倒是把壞字練成了習慣。當然比喻不恰當，低保真原型本身可是沒錯的。而快速產出高保真原型能夠在我們日常中練成，當然是最好不過的。

心態篇 

1、不要擔心自己沒有藝術細胞

我們是產品經理，天生為創造美好而存在，不一定在色彩上酷炫，但肯定能做出精緻的原型的。尤其像筆者一樣從事ToB產品的童鞋，視覺上更是簡單了些，表現簡單清晰，操作方便簡單，體現專業嚴謹就好。

2、別害怕影響到了設計師

即使公司給配備了各類設計，多數能被自己影響動搖的都是相對「年輕」的，設計比自己還差的，剛好共同進步。當然，多數應該是甩上自己幾條街的設計「爸爸」，可能會被好好教育的，但沒關係的，能夠做出提高的總規是好的。

我們這些產品經理，有個好品質，能夠很快承認錯誤，接受自身不足而去不斷改正雕磨產品。我很佩服一類人，能對自己動刀動槍的那種，書面點，就是常自省的人。很慶幸，常年從事產品工作讓自己也能有機會變成自己佩服的那一類人。

真不要怕影響到設計師，我們本身職責就有相關產品設計的工作，無論處於什麼目的及方向，原型就是要影響到設計師的，如何讓設計更加偏向好的影響而不是負面影響，也是我們工作一個重要職能。

3、熟能生巧

原型的產出總會佔上我們工作的一部分，我們每次要求產品做出提高，我們不斷豐富的經營，不斷累積的設計，也足夠讓自己的原型逐步變成高保真原型了。所以吧，讓每次都比上一次好，讓高品質設計變成習慣，產出高保真原型其實可以變成一個很簡單的過程，經歷了，它自然就提高了。熟練之後，高保真原型花費的時間並不多，還是很合理的。

預祝春節快樂。

 

本文由 @用心的工匠 原創發布於人人都是產品經理。未經許可，禁止轉載。

收藏已收藏 | {{ postmeta.bookmark }} 點讚已贊 | {{ postmeta.postlike }}