色www永久免费视频首页在线,欧美电影网站,91麻豆精品久久久久蜜臀

Cezary O?owski ：如今各大公司在產品功能競爭上，比起之前口若懸河的宣傳，現在更多的是將功能直接展示出來。相信你也有過這種經歷，有時用言詞解釋某些 idea，倒不如在白板或者紙上寫下來更省時、易懂。而這張紙上的說明就是原型。

再來想象另一種情況。你對陶器很著迷，打算打造一種新型的噴水壺。此時明智的方法是和朋友快速制作一個簡易模型。因為你不想一上來就開始建立龐大的生產線，而只是希望先檢驗你的想法是否有漏洞。而這個模型正是原型。

無論你是要開發一個新的 App 還是要制作個噴水壺，原型設計作為設計流程中的一步，可以幫助你驗證自己的想法、向他人說明自己的設計、還能在用研中幫助檢驗用戶體驗。如果把設計看作是一種溝通手段，那么經過原型打磨過的設計可以讓用戶每次和你的產品溝通時，都會有一段愉快的對話。用戶會喜歡什么樣的「話題」，也可以通過原型先測試一下，把那些讓人不知所措的冷笑話排除掉。這個打磨溝通的過程，就是原型設計。

那么，應該使用什么樣的工具制作原型？這很大程度上取決于你想要實現的效果以及制作原型的目的。選擇合適的工具對于開發和客戶的溝通至關重要。同時，選擇符合呈現效果復雜度的工具也很重要，如果只是想制作按鈕的簡單懸停狀態，則無需構建整個屏幕。切忌不要用大炮打麻雀。

挑選工具前，我們需要制定一個挑選標準。我關注的幾個因素是：

1. 易用性

學習一款工具有多難？可以不費勁的快速自學還是需要專門費力研究？

2. 協作效率

這點是原型設計的核心價值。原型是否容易分享并留言評論？如何與你的團隊以及客戶溝通？留言管理、鏈接分享、云端文件管理，是否可以快速下載并離線預覽，不同的使用情景需要不同的功能支持。

3. 保真度

原型看起來是否夠逼真？還是像一個線框圖大致展現一下思路？高保真原型更適合做用戶測試，這樣用戶可以更加關注產品的流程或者功能，而不會因為原型的低劣保真度分心。低保真原型更適合設計的初期想法，此時你不需要在意具體細節。

4. 流程銜接

該工具是否適合現在的工作流程？它是否可以很自然地同現在的工作方式銜接？這一點非常重要，沒有什么比穿著不合腳的鞋子更糟心了。

一、Framer X

官網鏈接：https://framer.com/

超詳細評測！2019年值得關注的四個原型制作工具

Framer 已經上線有一段時間了。它的前身——Framer Studio 是用來制作高階且復雜的交互原型，比如可以鍵入信息、調用設備傳感。不過它也有一個缺點，就是需要 CoffeeScript編程基礎。

Framer X——最新上線的版本，功能強大且入門門檻低了很多。現在你僅需點擊幾下就可以制作和之前一樣的高階交互效果。無需任何編程知識仍可達到編程制作的效果。可自定義頁面過渡、輕松創建滾動組件以及可滑動的 UI元素，而且元素還可以快速響應。但是如果你需要在原型上添加一些額外的高大上效果，那你就要到一家商店，里面都是用 React編寫的代碼組件：YouTube播放器，UI工具包，貨幣轉換器，可交互式地圖組件。如果懂 React，你也可以自己建立組件以供自己或他人使用。更棒的是，還可以直接交付代碼給開發套用，減少溝通中的摩擦和誤解。

實際上，Sketch 是靜態設計工具中的老大，但它卻并不理想。因為設計師產出的是圖像，而開發人員需要使用 Invision 或 Zeplin等工具將圖像再轉換為代碼。Framer X 旨在讓設計師不僅可以繪圖，還可以從多個方面考慮設計，從而讓產品的各個環節更加緊密地聯系在一起。

1. 易用性

如果你很熟悉 Sketch，就可以順暢無阻地轉換到 Frame X。兩者的主要不同是在創建布局時，Framer X 使用的是框架而不是組。框架就像是一個 HTML 的容器，可以將素材等放到隱形容器內，這些框架易于操作和調整樣式。Framer X 還有更多強大的功能，比如 Stacks。使用 Stacks 可以輕松創建具有自動分發和對齊功能的自定義列表，非常方便。但是，如果要創建更高級的組件，則需要一些 React 基礎知識。這可能會嚇跑一些設計師，尤其是那些主張「設計師不應寫代碼」的人。

綜上，在易用性方面，Framer X 獲得五顆星中的三顆星。

2. 協作效率

這一點，Framer X 做的很不好。除非把源文件發給對方，否則無法將項目轉交給客戶或開發人員，這真是太不友好了。Framer Studio 有個很贊的功能，就是你可以將原型上傳到云端，這樣就可以在任何地點訪問該鏈接。此外 Framer Studio 還支持下載后離線使用。而 Framer X 則沒有這些功能。雖然仍可以生成共享鏈接，但一旦關閉文件或手動停止實時預覽，它將自動變為無法訪問。我相信 Framer 團隊有能力解決這個問題，但現在我只能給一顆星。我是認真的，Framer團隊！

3. 保真度

這點可以彌補剛剛 Framer 失去的分數。制作高保真原型從來不是一件容易的事情，而 Framer 絕妙地在工具內添加了組件商店。這個功能將讓 Framer 在近一段時間內脫穎而出。使用 Framer X 進行原型設計，可以讓設計人員更加接近產品設計的高峰——UI設計體系。像 Airbnb、Shopify團隊已經在使用 UI體系為各個平臺產品提供統一的設計服務。所以在這里我將給出5分滿分。

4. 流程銜接

最后一點，但卻是很重要的一點：流程銜接。雖然 Framer 僅適用于 Mac，但我們不會因此而責怪它。在 Framer 的網站上，寫著用戶可輕松導入 Sketch畫板，你需要做的就是復制和粘貼。但事實上并不像他們所說的那么容易，而且還無法導入完整的畫板。即使可以完整導入，但還存在一個問題：Sketch 導入選項設置十分有限，且不支持與除 Sketch 以外的其他工具銜接。所以在這里不得不將分數降低到兩顆星。

最終分數11分（滿分20）。總體看來 Framer 還是不錯的，但有些方面需要提高。它是一個值得信賴的軟件，并為其他工具提供了可遵循的方向。

更全面的評測 →?《大概是東半球最詳盡的 Framer X 深度評測》

二、ProtoPie

官網鏈接：http://www.protopie.cn/

超詳細評測！2019年值得關注的四個原型制作工具

ProtoPie 是一款比較年輕的產品，不過在這個快速變化的市場中，一年半的上線時間感覺已經不短了。ProtoPie 和 Framer X有一個相似之處，就是他們都意識到了設計師厭惡寫代碼，所以都試圖縮小設計和代碼間的縫隙，而最終 ProtoPie 找到了答案。ProtoPie 將交互簡化成了三個基本的要素：動作對象、觸發動作和反應動作。有一個登錄按鈕（動作對象），用戶點擊它（觸發動作）后，歡迎界面出現（反應動作）。通過這種方式，您可以使用大量的觸發動作庫（基本動作，條件和傳感器）拼接出保真度非常高的原型。雖然制作過程中點擊操作比較多，但產出效果都非常好。

1. 易用性

ProtoPie 并不復雜，只是頭次使用時可能會令人感到困惑。不過他們有大量的教程幫助你熟悉界面、了解功能，并教導如何制作交互。完全不需要學習代碼，所有用代碼可以制作的動作，在 ProtoPie 里可以用觸發動作和反應動作拼接完成。ProtoPie 支持多手指手勢，還可以調用手機內部傳感器，從而讓你的原型和真正的 App 看起來相差無幾。用戶使用文檔的內容非常豐富，幫助你輕松學習并制作高大上的交互原型，整個過程不涉及任何代碼。不過因為第一次使用的時候，看起來并不直觀，所以我要在這點上減掉一分，最終易用性得分4分。

2. 協作效率

首先，你可以使用 Wi-Fi 或 USB連接手機后，在手機上預覽原型，甚至可以在本地保存并離線測試。不僅如此，還可以上傳作品到云端后分享鏈接給客戶或團隊成員，他們可以在電腦或手機上測試交互動作。不過很遺憾，你沒有辦法添加留言評論并導出開發說明文檔。盡管如此 ProtoPie 的協作功能還是很實用，所以這項至少可以獲得三顆星。

3. 保真度

ProtoPie 提供了諸多強大的功能，不過這并不影響它的易用性。創建精致的交互原型其實并不復雜，任何專業的產品設計師都可以快速地制作出來。從微交互到逼真的全套交互，最終效果都非常棒。只是與 Framer X 相比，ProtoPie 無法導入代碼組件，所以可創建的效果有限。最終此項分數為4分。

4. 流程銜接

ProtoPie 適用于 Mac和 Windows。還可以導入 Sketch 和 Adobe XD（包括Windows平臺），而且導入效果很贊，你有多種導入方式：整個畫板或個別圖層。ProtoPie Player（演示端）支持安卓和 iPhone。以上這些可以說幾乎涵蓋了所有需求。最后，我想提一下跨平臺交互功能，有了它，你可以創建多個設備之間的通信交互，例如聊天或匯款交易。這真是太前衛了，當之無愧的滿分。

最終 ProtoPie 獲得了16分（滿分20）的高分。如果你需要快速地創建高保真原型，并分享給客戶來做用戶測試，那么 ProtoPie 就是你的不二選擇。

更全面的評測和獨家福利 → 《誰說交互原型制作難？那是你還沒用過這個神器！》

三、Flinto

官網鏈接：https://www.flinto.com/

超詳細評測！2019年值得關注的四個原型制作工具

這是一款很有名的軟件。但是你肯定也很清楚，和其他競爭對手比，Flinto 還是存在一些問題的。Flinto 提供了最基礎的功能，對初學者來說非常直觀。你可以創建復雜的頁面流程，也可以創建簡單小巧的交互。Flinto 不支持任何編碼，也沒有時間線，如果剛好你就需要這些基本功能，那么這個工具絕對適合你。

1. 易用性

Flinto 沒有任何學習成本，你需要做的就是知道你想要的效果是什么，以及 Flinto 能否實現。創建交互很容易——選擇對象或畫板并添加鏈接或手勢。此外還可以添加頁面切換效果、添加音效、調整時間，就這些，一個原型就搞定了。網上有很多教程，Flinto 官網上還有說明文檔來幫助你創建原型。無需代碼，滿分。

2. 協作效率

Flinto 允許在手機上預覽您的原型，但只支持 iOS。將 Mac和 iPhone連接到同一網絡后就可以直接在設備上測試原型。不過很可惜，Flinto 共享功能十分有限，沒有鏈接分享，也沒有任何與開發及客戶協作的功能。雖然可以錄制預覽窗口分享視頻文件，或直接將其上傳到 Dribbble，但這個分享方式很不方便，這也是該工具的一個很大缺點。很遺憾，一顆星。

3. 保真度

Flinto 在基本交互的制作上雖然還是不錯的，但是如果想制作中高階交互，如：文本輸入、視頻等，很遺憾 Flinto 并沒有這些功能。不過它支持 Sketch導入，快速讓靜態素材動起來，這點還是很贊的。因為 Flinto 會限制你的技能和想象力，所以保真度這項兩顆星。

4. 流程銜接

Flinto 的局限性在于它僅支持 Mac，預覽端 App 也僅適用于 iOS設備。而且只能導入 Sketch文件，要不就在 Flinto 里面自己設計，顯然這可不是一個好主意。一顆星。

最終得分9分（滿分20）。Flinto 做到了所見即所得，雖然沒有什么高級功能，但如果你只是想串聯多個頁面，加一些簡單的交互，然后展現給你的團隊或者分享到 Dribbble，Flinto 可以滿足你的需要。當然 Sketch插件也能達到這些要求。

四、Atomic

官網鏈接：https://atomic.io/

超詳細評測！2019年值得關注的四個原型制作工具

和之前提到的工具不同，Atomic 是在網頁端操作的軟件。個人其實更喜歡安裝型應用，但是我還是要感謝 Atomic 提供了強大協作功能，比如團隊可以遠程協作同一個項目。不過 Atomic團隊宣布他們正將把注意力轉移到其他項目上。如果你有 Atomic 的賬戶，你可以一直使用到2019年6月30日，在此之后你將無法再使用 Atomic。真是個壞消息！不過你還有一些時間試試這款工具。

1. 易用性

Atomic 有著非常不錯的新手引導：無需閱讀任何說明文檔，引導會帶領你完成幾個任務，這對工具的學習非常有幫助。了解基本原理后，你就幾乎可以制作所有的效果。Atomic 具有直觀的界面，高階動效庫以及可嵌套的組件。此項得分4分。

2. 協作效率

在協作這項上，Atomic 無疑是最棒的。你可以邀請團隊成員同時編輯同一個項目（就像Figma），制作完成后，可以簡單快速地分享鏈接并添加留言評論。還可以創建類似于 Sketch 的共享庫，這樣整個團隊可以共用同一個設計資源。該功能對于那些需要為不同平臺設計響應式產品的團隊至關重要。Atomic 此項得分5顆星。

3. 保真度

Atomic 在多種手勢動作、表格交互、轉場效果、鍵盤交互（方向鍵等）等效果的使用上非常簡單，效果也很逼真。你也可以將交互與微動效相結合，以實現更真實的效果。基于線上編輯的工具里，如果將 Atomic 與其他后起之秀相比，你也會和我一樣認定 Atomic 的表現更為突出。四顆星。

4. 流程銜接

你可以在瀏覽器上使用 Atomic，所以電腦系統變得無關緊要。不過在我撰寫這篇文章的時候，Atomic 只支持 Sketch導入，所以除非你選擇在 Atomic 上自己繪圖，否則繪圖階段會受到 Mac系統的限制，3顆星。

最終得分16分（滿分20）。如果你不介意在網頁端制作原型，那么對于整個團隊來說，Atomic 無疑是最強大的工具，尤其是在大公司或者遠程工作的團隊，協作功能非常有用。