什么才是正確的原型設計?
草圖,線框圖,設計草稿,高分辨率的可視效果:原型對交互式應用發展的作用是必不可少的。下面跟大家一起探討一下其中的聯系和區別,哪些方式適用于哪些項目。
在電子產品的開發中沒有一個最終目的是原型。原型的目標是將想法,功能,內容形象地表達出來,以此得到反饋并改進產品。交互設計中最重要的挑戰往往是界面:它應該是友好的,直觀的,最好是一目了然的。
在開發的過程中會不斷地出現一些必須用原型的方式來解釋的問題:用戶感知到了什么元素?組件是如何交互的,整個系統背后的邏輯是怎樣的?這種邏輯用戶是否能快速的理解?操作是否會令人困惑?原型能夠幫助解答建立在使用價值之上的實際問題,以此做出最好的設計方案。
但是什么樣的原型適合一個交互項目的什么階段呢?它應該盡量精致還是應該簡易、快速?是否還能用工具對原型做一些快速的交互呢?
從低保真到高保真
原型根據外觀和功能有不同程度的保真度。Sketches或者Scribbles通常足以應付第一階段的草稿。在這種類型的低保真原型中線框也只用保持簡練和單色,只用突出框架和功能。這些簡略的草圖不用色彩豐富絢爛,不用太多的可視化的元素。
用Axure,Balsamiq或者Mockplus等帶有許多組件的原型軟件工具能讓你快速地制作界面。通過進一步地集成設計元素,線框圖能夠打造得更為精致。
在高保真原型階段,原型和產品同步完成
這種情況下設計稿已經充斥著色彩,圖形,文本,間距和字體。對于高保真的程度是沒有統一的標準的,可以用PowerPoint展示,可以用HTML,亦或是圖表的形式。你也可以用Photoshop組合你找到的視覺元素。如果網站或APP是動畫的,用比如說After Effects這樣的軟件就可以清楚地向客戶展示產品的思路是怎樣的。
團隊討論和概念測試中效果不用奪目
測試過程并不會像實踐一般簡單,合適的原型取決于幾個因素:目標組,技術背景和開發階段?!皼]有比手繪草圖更好的了”,漢堡的UX設計師Miriam Scheibe說到,“像乒乓球一樣在概念和開發之間不斷來回打磨構思?!盨cribbles也能用被用來展示行為和交互,比如說展示當用戶完成登出的流程后會發生什么。在這個階段只有概念需要被印證,沒有視覺設計的必要?!跋敕ㄓ卸嗄:途蛻撚卸嗪唵巍?,Miriam說到。這些草圖應該盡量地遠離產品,因為針對早期測試它們還需要修改成特殊的形態,能夠形成模板,利用原型軟件能夠方便的變為簡單的交互網站或APP。
內部細節溝通
Wireframe有助于內部溝通,以傳達在設計,視覺,開發方面的架構信息。盡管這種工作可以由PDF完成,但是其自帶的豐富的工具能提供更多。取代了大量難以閱讀的任務列表,越來越多的的機構都在使用可以模擬應用效果的交互線框圖。快速的原型工具Mockplus也能提供幫助。
視覺工作是有必要的?!叭绻麍F隊在概念階段達成了一致,想要得到部門經理的認可,展示形式需要更為具體”,Miriam Scheibe解釋到,“因為這些人通常沒有太多時間,你可能需要在電梯里闡述你的想法。在沒有時間和預算用于Photoshop設計的情況下,Wireframe也能夠用于集成背景,圖案,字體和色彩?!?/p>
甚至如果代理人是代表風險投資的客戶的話,最好依靠高保真的原型而不是在觀眾前表述抽象事物的能力。在這種情況下爆炸式的美學和令人印象深刻的觸感更加為你的表達加分。
綜上所述,不同的設計階段和設計需求有很多合適的工具,線框圖適用于內部細節溝通,包括頁面結構/導航/交互細節等,草圖用于捕捉想法,不必糾結細節的構思階段。原型圖則是針對原型測試和改進,關于行為和邏輯的驗證階段,選擇適合的工具可以為極大地提高設計的效率和質量,更好地完成產品。
本文由 @jongge?原創發布于人人都是產品經理。未經許可,禁止轉載。
摩客工具做原型非常快,贊一個