設(shè)計(jì)并不是隨心所欲，也不是每時(shí)每刻都需要?jiǎng)?chuàng)意擎鸠。你需要一個(gè)向?qū)槟阒该鞣较? 這就是原型。
什么是原型缘圈？
原型可以概括的說(shuō)是整個(gè)產(chǎn)品面市之前的一個(gè)框架設(shè)計(jì)劣光。設(shè)計(jì)師可以利用它引導(dǎo)每個(gè)人都參與到項(xiàng)目中來(lái)。原型展示了各個(gè)部分之間的比重以及各個(gè)部分之間的聯(lián)系糟把。原型不僅僅只是表面的東西绢涡，它能夠說(shuō)明用戶將如何與產(chǎn)品進(jìn)行交互。舉個(gè)栗子遣疯，一個(gè)下拉菜單垂寥，通過(guò)原型設(shè)計(jì)，你可以直觀的感受到每次點(diǎn)擊或者鼠標(biāo)劃過(guò)時(shí)菜單如何相應(yīng)另锋。
高效的原型設(shè)計(jì)工具
與其他工作一樣滞项，完成原型設(shè)計(jì)需要相應(yīng)的工具協(xié)助。在眾多原型工具中夭坪，這里推薦5款高效的工具文判。
-
簡(jiǎn)單易上手，摩客已經(jīng)逐漸成為很多設(shè)計(jì)師們的選擇室梅。寫代碼是很討厭的事情戏仓。因此，摩客給大家提供了拖拽設(shè)計(jì)原型的功能亡鼠。
對(duì)于還在使用紙和筆的設(shè)計(jì)師來(lái)說(shuō)赏殃，摩客提供了更多的靈活性。你可以使用素描風(fēng)格的組件來(lái)畫原型间涵。摩客豐富的組件庫(kù)和圖標(biāo)也讓設(shè)計(jì)更加快捷仁热。
摩客的易用性還表現(xiàn)在創(chuàng)建原型的速度。如果使用其他工具勾哩，你可能需要花大量的時(shí)間完成一個(gè)原型抗蠢。但使用摩客举哟，只需5分鐘。你還可以通過(guò)掃描二維碼迅矛，快速的預(yù)覽原型妨猩。
今年摩客團(tuán)隊(duì)推出了2.1版本，這就意味著你可以使用簡(jiǎn)單的拖拽完成交互功能的設(shè)計(jì)秽褒。高度封裝的交互組件（例如彈出面板壶硅、彈窗、彈出菜單销斟、抽屜庐椒、內(nèi)容面板、輪播票堵、滾動(dòng)區(qū)等）讓原型設(shè)計(jì)變得更加簡(jiǎn)單扼睬，快速。想了解摩客更多功能悴势，請(qǐng)查看摩客官方教程窗宇。文章中提到的功能只是很小的一部分，摩客還有更多簡(jiǎn)單好用的功能等著你去挖掘特纤。 -
UXpin
Uxpin军俊，另外一款值得推薦的原型設(shè)計(jì)工具。這款工具的優(yōu)點(diǎn)就是簡(jiǎn)單易用捧存。它的界面十分簡(jiǎn)潔粪躬，你可以輕易的把圖片和文件合并到你的設(shè)計(jì)中去。這款工具的預(yù)覽功能也很好用昔穴，不僅可以預(yù)覽原型镰官，也可以預(yù)覽點(diǎn)擊時(shí)或者鼠標(biāo)劃過(guò)時(shí)各個(gè)頁(yè)面的狀態(tài)。其他人也可以對(duì)原型進(jìn)行評(píng)論吗货，方便了同事間的協(xié)作泳唠。
談到評(píng)論功能，如果UXpin 能夠在有新評(píng)論的時(shí)候增加一個(gè)提醒就更好了宙搬。目前沒(méi)有這個(gè)功能笨腥，如果有新的評(píng)論，你需要手動(dòng)的去檢查勇垛。 -
Proto.Io
與其他原型工具不一樣脖母，Proto.io 是一款在線工具，因此使用它的時(shí)候需要聯(lián)網(wǎng)闲孤。如果你經(jīng)常在線谆级，那么使用這款工具就沒(méi)什么問(wèn)題。其中很重要的一個(gè)功能就是內(nèi)置的組件庫(kù)，設(shè)計(jì)師都知道從第三方尋找組件是很痛苦的事情哨苛。即使軟件中沒(méi)有你想要的組件鸽凶，你也可以輕易的從第三方導(dǎo)入币砂。
如果你只是需要一個(gè)常規(guī)的布局建峭，proto.io 的啟動(dòng)項(xiàng)目能夠讓你的工作變得簡(jiǎn)單。你也可以保存不同的變量决摧，并且能夠預(yù)覽用戶與各個(gè)頁(yè)面之間的交互亿蒸。 正因?yàn)檫@是一款在線的功能，在使用的時(shí)候有一些局限掌桩。例如边锁，不能單獨(dú)備份某一個(gè)頁(yè)面，而只能備份整個(gè)項(xiàng)目波岛；不能添加需求文檔茅坛。 -
MockFlow
MockFlow簡(jiǎn)單的界面讓原型設(shè)計(jì)十分容易。它沒(méi)有花哨的東西—為你提供了一個(gè)整潔的設(shè)計(jì)界面则拷。頂部是標(biāo)準(zhǔn)的菜單和工具欄贡蓖。如果需要更多的設(shè)計(jì)空間，可以隱藏菜單和工具欄煌茬。這款工具也提供了內(nèi)置的組件斥铺。
你可以使用這款工具免費(fèi)創(chuàng)建一個(gè)原型，這樣就可以在購(gòu)買之前體驗(yàn)所有的功能坛善。簡(jiǎn)單的拖拽和雙擊功能讓你很容易的添加組件晾蜘，不需寫任何代碼。導(dǎo)出功能同樣也很簡(jiǎn)單眠屎。
MockFlow 也提供了協(xié)作功能剔交，以便你邀請(qǐng)其他人預(yù)覽項(xiàng)目或者查看項(xiàng)目進(jìn)度嘱朽。它提供了聊天功能锣杂，這樣就可以交流意見(jiàn)叙身。但是有一個(gè)問(wèn)題霜浴，如果有一個(gè)人在刷新頁(yè)面兰绣，其他人就不能刷新該頁(yè)面膘螟。 -
InVision
這款工具很大的一個(gè)優(yōu)勢(shì)就是它可以讓你免費(fèi)創(chuàng)建一個(gè)項(xiàng)目虽惭。這對(duì)于學(xué)生和初學(xué)者來(lái)說(shuō)是一個(gè)不錯(cuò)的福利敌蚜，這樣一開(kāi)始的時(shí)候就不用擔(dān)心預(yù)算問(wèn)題了候衍。這款工具的付費(fèi)版本也是比較便宜的笼蛛。 功能的分享和協(xié)作功能也很簡(jiǎn)單。你的團(tuán)隊(duì)成員或者客戶都可以給你的設(shè)計(jì)添加評(píng)論蛉鹿，并且你能夠很輕松的追蹤評(píng)論滨砍。
項(xiàng)目狀態(tài)是此工具另外一個(gè)強(qiáng)大的功能，你可以向你的整個(gè)團(tuán)隊(duì)分享項(xiàng)目進(jìn)度。每一個(gè)進(jìn)程都可以標(biāo)為“進(jìn)行中”或者“需測(cè)評(píng)”或者某部分也可以標(biāo)為“積壓”或者“通過(guò)”惋戏。
Invison提供了版本控制功能领追。你也可以與其他工具進(jìn)行協(xié)作，例如 DropBox响逢，PS绒窑，Sketch等。
以上五款原型設(shè)計(jì)工具都有自身的優(yōu)劣點(diǎn)舔亭，但它們是目前市場(chǎng)上最高效的原型設(shè)計(jì)工具些膨。
更高效的設(shè)計(jì)原型盡管有很多原型設(shè)計(jì)工具可以為你的工作帶來(lái)便利，但是也還會(huì)有不少的工作需要我們?nèi)プ銮掌獭Ｏ旅嬗幸恍┬〗ㄗh订雾，希望可以讓你的原型設(shè)計(jì)更優(yōu)秀。
尋找靈感
盡管各個(gè)原型設(shè)計(jì)工具都提供了大量的組件矛洞，你只需要簡(jiǎn)單的拖拽洼哎，但是如果沒(méi)有靈感，原型設(shè)計(jì)也是做不好的沼本。不停的尋找靈感噩峦，學(xué)習(xí)其他設(shè)計(jì)者的項(xiàng)目，找出你喜歡的地方和不喜歡的地方擅威。清楚的知道你的原型中需要避免的東西壕探，這樣可以更容易畫出自己需要的原型。
形成自己的工作流程
每個(gè)人的工作方式都不一樣郊丛，對(duì)別人適用的方法對(duì)你不一定適用李请。形成最適合自己的工作流程，最大化的利用好時(shí)間和精力厉熟。某些人可能覺(jué)得先畫線框圖导盅，然后畫原型，最后再進(jìn)行視覺(jué)設(shè)計(jì)是很有效的流程揍瑟。但是你可能覺(jué)得畫完線框圖就直接寫代碼更高效白翻。這些都取決于你自己。
選擇適合自己的工具
大部分設(shè)計(jì)師都在使用同一款原型工具绢片，并不意味著你也需要使用這款工具滤馍。由于每個(gè)人的工作流程不一樣，其他人使用的工具不一定適合你底循。對(duì)比市場(chǎng)上不同的工具巢株，尋找一款與你性格和風(fēng)格最匹配的工具。擔(dān)心其他人都不用你使用的工具熙涤？ 但此工具可以給你帶來(lái)最好的效率才是最重要的阁苞。
層次清楚的大綱
每個(gè)頁(yè)面都有一個(gè)焦點(diǎn)困檩。大綱可以讓你知道每個(gè)頁(yè)面中應(yīng)該重點(diǎn)突出哪一部分。如果沒(méi)有大綱那槽，想要畫出理想的原型很困難悼沿。如果你很清楚的知道頁(yè)面中哪部分最重要，那你就很容易判斷某些文字是否需要加粗骚灸。
從灰度圖開(kāi)始
顏色很重要糟趾，但是需要謹(jǐn)慎。從灰度圖開(kāi)始設(shè)計(jì)逢唤，然后添加圖片拉讯，然后再添顏色涤浇。如果你一開(kāi)始就使用顏色鳖藕，很有可能你的頁(yè)面看起來(lái)像一個(gè)小丑。
原型設(shè)計(jì)并不簡(jiǎn)單只锭，但是會(huì)一次比一次好著恩。通過(guò)不停的練習(xí)，選擇正確的工具蜻展，你就可以設(shè)計(jì)出讓客戶滿意的原型喉誊。
