如何讓你的原型製作看上去更專業?

在原型設計過程中,養成一些良好的習慣不僅可以使得我們的原型更加專業、規範,同時也能夠提高我們的設計效率。本文從元件、頁面導航、頁面樣式、母版、用例等多個方面講述養成怎樣的一些習慣,可以快速提高我們的原型設計效率,並且看上去更專業。

如何讓你的原型製作看上去更專業?

做好元件命名,方便查找

我們知道,原型是由很多個元件以及它們的交互構造而成的。在繪製線框圖的階段,我們應該為每個元件命名,這樣有助於我們準確查找元件,特別是在製作交互用例時,大家應該深有體會,在這裡就會明白元件命名的重要性。很多朋友建議元件的命名用英文,個人認為中英文都可以,因為並不是每個人的英文水平都很好,只要方便我們查找和記憶就可以了。

藉助輔助線,原型設計更美觀

設計中我們應該學會使用輔助線和網格的習慣,這樣可以完美的處理好很多對其排列的問題,使得我們的頁面元素排列更整齊、更美觀,而不是看上去像一個手繪的草圖。輔助線通常一般分為全局輔助線和局部輔助線,全局輔助線需要按住Ctrl按鈕從設計區域的頂部刻度線或左側刻度線拖拽到目標位置,局部輔助線直接拖拽即可完成。

統一頁面樣式,設計更規範

在開始設計前,我們要設計好統一的頁面格式以及字體,確保每個頁面的樣式風格都是統一的,包括顏色和字體等。要養成給每個頁面命名的習慣,不同狀態的線框圖儘量放置在一個頁面呈現,學會給頁面進行排序以及歸類,必要時可以建立一個頁面文件夾,將同一類型的頁面移動到文件夾中。在整理頁面導航時,不僅要注意頁面的排序及分類,同時各頁面的層級關係也需要我們梳理清楚,這樣製作的頁面導航才能夠更直觀,邏輯更清晰。

學會製作元件,提高設計效率

當自制的元件越來越多時,比如移動端的常用元件、web端的常用元件,我們將這些同類型的元件歸類到一個元件庫中,自制的元件建議大家養成一個良好的命名習慣,這樣對於我們查找自制元件也很方便。對於那些使用率很高的交互效果,可以製作成元件,方便以後的複用,在以後的設計工作中,可以極大的提高我們的工作效率。

善於使用母版,讓你事半功倍

在一個項目的原型設計過程中,對於那些複用性較高的部分,如頁面的導航、分類標籤都可以製作成母版,善用母版也會讓你的工作效率大大提高,為你節省很多的設計時間,多一點時間思考產品的需求。關於如何運用不同的母版來提高工作效率,可以參考

必要的時候,為用例命名

當同一個交互事件可能存在多個並列的用例時,這類情況通常對應一個元件、組合或動態面板,根據不同的狀態存在多個交互方案。此時,建議為每個用例進行不同的命名,可以使用觸發條件或狀態的關鍵字來命名,用以區分名稱,默認的case1、case2不方便在演示原型時區分不同方案。

相信大家在設計原型時,如果在潛意識裡養成這些良好的使用習慣,一定會讓你的原型看上去更規範、更美觀、更專業,讓你的原型設計工作事半功倍,完成一份合格的低保真或高保真也會更容易。


分享到:


相關文章: