線框圖?原型圖?為何總是傻傻分不清楚

7 評論 35165 瀏覽 113 收藏 6 分鐘

什么是線框圖?什么是原型?什么時候使用線框圖?什么時候使用原型?本文作者將為你一一作答。

首先,我們需要搞清楚的一點就是線框圖不是真正意義上的原型。許多設計師和產品經理,甚至是經驗豐富的設計大牛往往也很容易混肴這些專業(yè)術語。什么是線框圖?什么是原型?什么時候使用線框圖?什么時候使用原型?

我們都看過小說,小說呈現給我們的只是文字表達,由作者賦予的人物形象。我們常常在語文考試中都會這樣回答“本文中的人物形象生動、鮮明”,這里的“生動”指的只是我們通過作者的視角想象出來的,我們并沒有看過真實的人物。但當這部小說被拍成電影或電視劇,導演根據自己的理解選角,演員們賦予了他們鮮活的生命,這就是原型,小說中人物的原型。

  • 提供信息和功能——線框圖
  • 我該如何互動或如何使用——原型

什么是線框圖?

線框圖是一種低保真且靜態(tài)的呈現方式,設計師通常使用紙筆來表達自己的想法。只要能明確表達內容大綱,信息結構,布局,用戶界面的視覺以及交互行為描述即可。就像建筑藍圖一樣,藍圖也就是施工方案,詳細描述改如何建造建筑。繪制線框圖重點就是要快,明確表達自己的設計想法,它不是美術作品,無需過多的視覺效果。黑白灰則是它的經典用色。

什么時候使用線框圖?

線框圖(Wireframe)是軟件或者網站設計過程中非常重要的一個環(huán)節(jié)。線框圖常常適用于非正式場合,用于團隊內部的討論。

花費成本

線框圖的花費成本可以說是零,只要有紙筆,或白板就能完成你的想法的構建。不過有的產品經理用Word,有的用Photoshop等。但一般不作為用戶測試。

什么是原型?

原型通常是中高保真的呈現形式。以接近最終產品的形式來考量產品的可用性。它能夠實現和驗證你的設計理念。原型是程序開發(fā)過程中的重要步驟,并且允許我們進行一些初步的測試。

什么時候使用原型?

原型常用于做早期測試,以確保你的想法符合目標市場。在產品發(fā)布之前,沒有原型和對用戶的測試,這個產品注定是失敗的。在原型設計階段花費的時間,可以避免額外的工作和成本。相對于紙上的產品設計文檔,產品原型更加有效,這樣可以讓所有的測試人員以及用戶知道你產品的創(chuàng)意所在。

花費成本

原型比線框圖耗時且花費成本高,市面上的原型工具,價格和方式不等。Axure現在沒有了盜版之后購買包年要495美元,終身版 899美元并僅限于大版本;Justinmind包年228美元;終身版495美元,第二年后,每年需要支付99美元保持更新。Mockplus包年129美元;終身版399美元,Mockplus實現了真正意義上的終身版,無需再為新版本付費。 工具是為我們服務的,要看它是否易操作,易上手,學習成本高低,價格是否親民。

原型的可交互,可點擊和可操作的設計為用戶提供了最終產品的真實想法。通過原型設計工具中的高級UI功能和元素,您可以添加視頻,html,flash以及廣泛的動畫,效果,轉換和移動手勢。原型越現實,反饋越準確!原型圖是最終系統的代表模型或者模擬,比線框圖更加真實、細致。所以原型工具的花費是值得的,就看哪一種工具符合你的預期。

總結

 

本文由 @安靜的熊先生?原創(chuàng)發(fā)布于人人都是產品經理。未經許可,禁止轉載。

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 對原型理解就是錯的。把文章撤下來,別誤導人。

    來自浙江 回復
  2. 沒什么價值

    回復
  3. 流程圖如何制作?

    回復
  4. 應該把線框圖、原型圖、高保真原型圖放在一起比較一下,而且實際工作中,產品經理很少輸出高保真原型圖,如果讓產品經理做高保真原型圖(有交互的),無疑是在增加產品經理的勞動成本,那UI干嘛去?高保真原型圖非常耗時,那樣的話產品經理就沒時間跟研發(fā)跟UI跟運營撕逼了。拙見

    回復
    1. 是的

      來自山西 回復
  5. 不錯啊~

    來自上海 回復
  6. 文章很棒

    回復