適用於您的應用程序的最佳線框圖工具
已發表: 2018-03-23我們為您列出了一系列線框圖工具，這些工具可以幫助您創建應用程序或網站時不那麼令人生畏。 如果您正在尋找一款出色的原型工具，我們也為這些工具提供了一些建議。
創建一個新的應用程序或網站是一項可敬的壯舉，沒有多少人會在他們的生活中完成。 這並不意味著您應該放棄這樣做，而是您應該先研究並理解它，然後再深入研究。 許多新手很難弄清楚線框、原型和模型之間的區別，所以這篇文章是為了幫助你理解每一個。
指數
什麼是線框？
2018 年最佳線框圖工具
什麼是原型？
2018 年最佳原型製作工具
創建您的產品模型
什麼是線框？
您對新的應用程序或網站有一個天才的想法，但您如何開始將其變成實際產品？ 帶線框！ 這是計劃過程中的第一步，因此您不要跳過它，這一點很重要。
線框基礎
在做出任何重大設計決策之前，您的應用程序或網站首先需要一個有意義的功能佈局。 這就是線框的用武之地。大多數人從手繪草圖開始，描繪他們希望他們的應用程序或網站看起來像什麼。 下一步是將這個草圖變成看起來更有條理和專業的數字佈局或輪廓。
您的線框將需要傳達頁面的基本結構，而不包括任何設計元素或實際內容。
在開始修飾任何東西之前通過線框工作將使您能夠發現可用性中的任何錯誤，這些錯誤將在以後處理時很痛苦。 在這個階段，更重要的是確保所包含的元素有意義且實用，尤其是對於您的目標受眾。 如果您想吸引投資者的注意力，線框圖也將幫助他們更輕鬆地了解您的產品。 事實上，至少沒有準備好線框會使投資者很快失去興趣。 包含在線框中的元素往往是標題框、按鈕、文本框和圖像框。
線框與樣機
線框與模型很容易混淆，因為它們確實包含非常相似的元素。 但是，當與開發人員、設計師和投資者團隊合作時，您需要了解是什麼讓他們與眾不同。
首先，使用線框來組織應用程序的內容和功能，但以非常簡單的方式。 將其視為一個大綱，顯示您的應用程序中將包含的基本結構。 一旦你開始添加其他元素，例如顏色、圖標、圖像、字體和照片，它就會開始變成模型。
模型提供了您正在開發的應用程序或網站的中等保真度表示。 這是您的應用程序正在形成的更真實的表示。 將流程中的這一步想像為為您的準系統線框添加一些內容或賦予它更多生命。
最好的線框圖工具
香脂
模擬加
起訂量
線框.CC
模擬流
香脂
適用於所有操作系統，因為它是基於 Web 的。
主要特點： Balsamiq 是一個強烈推薦的線框圖工具，它允許用戶為桌面應用程序、移動應用程序、網站、對話框窗口、網絡應用程序、平板電腦應用程序等製作線框圖。 通過 Balsamiq 創建線框類似於在白板上繪圖，並且該程序還允許您拖放 UI 元素、從團隊那裡獲得對草圖的反饋、修改設計並實時改進您的工作。
定價：此工具的價格將根據多種情況而有所不同。 您可以從 30 天免費試用開始，但之後您必鬚根據您選擇的平台支付月費或年費。 例如，雲版本將花費您每月 9 美元或每年 90 美元最多兩個項目。 桌面版的單用戶許可證費用為 89 美元。
獎勵： Balsamiq 通過 Udemy 和 Skillshare 提供免費課程，幫助您學習如何使用他們的產品並從中獲得最佳效果。
模擬加
適用於 Mac OS、Windows、Android 和 iOS。
主要特點：由於項目可以鏈接到雲存儲，MockPlus 允許整個團隊在單個項目上輕鬆協作。 用戶可以直接對項目進行評論並標記以供其他人查看。 您還可以向您的團隊發送通知電子郵件，以就更改保持聯繫。 最好的部分是您無需編碼或編程即可完成所有這些工作，因此更容易專注於您面前的工作。
定價：有一個免費選項可供單個用戶使用，其中包括無限的產品，儘管它在其他方面受到限制。 之後，價格將從個人每年 199 美元到企業每年 2999 美元不等。 您還可以購買許可證，價格從單個用戶 399 美元到企業（30 個用戶）的 5999 美元不等。
獎勵： MockPlus 最大的吸引力在於它允許開發人員以更快的速度創建線框，這要歸功於他們設計的工具來加速流程。
起訂量
可用於所有操作系統，因為它是基於 Web 的。
主要特點： Moqups 是一個基於 Web 的平台，可用於為 iOS、Android 和 Bootstrap 的 Web 應用和移動應用創建線框。 由於該平台是基於網絡的，您可以在任何地方連接和工作。 該平台不僅適用於線框，您還可以製作圖表和原型。 您可以輕鬆拖放元素，使用他們的模板工具包，從不同的字體中進行選擇，選擇對象，並將您自己的圖像拖放到您正在處理的任何內容中。
定價：與大多數線框圖工具一樣，Moqups 提供免費試用。 之後，價格將取決於許多因素。 例如，包括無限項目、對象、存儲和評論的年度訂閱，單個用戶每月收費 13 美元，創意團隊（3 人）每月收費 19 美元。 您必須直接聯繫 Moqups 以獲得企業帳戶的報價。
獎勵：如果您屬於非政府組織、學校或非營利組織，Moqups 將免費為您提供高級帳戶。
線框.CC
由於它是基於 Web 的，因此可在所有操作系統上使用。
主要特點： Wireframe.CC 被認為是可用的最基本的線框工具之一。 這不一定是壞事，特別是如果你是初學者。 事實上，由於其簡單的設計，開發人員可能會發現更容易專注於手頭的工作。 這個基於 Web 的程序可用於線框瀏覽器窗口、移動應用程序或平板電腦應用程序。
定價：Wireframe.CC 提供7 天免費試用和免費基本帳戶。 之後，單次使用每月 16 美元或每年 144美元，三個用戶每月 439 美元或每年 390美元，企業（無限用戶）每月 99 美元或每年 990 美元。
獎勵：這個程序的簡單性使得它很難分心和拖延。 事實上，UI 元素只會在需要時作為選項出現。
模擬流
可用作 Mac OS 和 Windows 的桌面應用程序或 Web 應用程序。
主要特點：該程序可用於設計網絡應用程序、移動應用程序、界面和軟件以及其他選項。 他們為您選擇的界面提供組件包，以使您的工作更輕鬆。 MockFlow 還提供協作功能，允許您團隊的所有成員實時查看更改，同時還允許您為每個人製作帶註釋的評論。 您可以以多種格式導出文件，包括 DOC、PDF 和 HTML。
定價：一個基本帳戶，每個工具中最多包含一個用戶和一個項目，是免費的。 一位用戶的高級帳戶每月收費 14 美元。 它唯一的缺點是共享限制。 三個用戶的團隊包每月收費 29 美元，但您可以將用戶添加到此帳戶，但需額外付費。 企業帳戶在用戶方面沒有限制，每月將花費您 160 美元。
獎勵：使用 MockFlow 的好處之一是他們的 MockStore，它出售各種界面的UI 模板。 如果您沒有靈感，您可以瀏覽他們的商店以獲取想法，甚至購買模板。
什麼是原型？
原型還不是成品，但它應該與它的外觀和一般功能非常相似。 您的應用程序或網站的這種高保真原型應該用於測試您的產品並獲得一些用戶反饋，以幫助您改進可能出現的任何問題。
原型基礎
原型通常出現在設計過程的最後，並充當最終產品的橋樑。 在這個階段，設計師將能夠展示他們的作品並使用它來獲得有用的反饋。 原型不僅應包括設計元素，還應演示項目完成後將如何工作。
原型可能不包括最終項目的所有動畫和交互，但它應該能夠展示應用程序的流程。 讓您測試它的性能。
您可以讓用戶對其進行測試並向您提供反饋，以改善用戶體驗。 你可能覺得你在使用一個真正的應用程序，但原型只是相互連接的圖像的集合。 這些類型的原型，即交互式原型，是理想的，因為您可以看到完成的設計，同時還可以與之交互。 創建一個好的交互式原型可能需要時間和成本，但絕對值得投資。
最佳原型製作工具
PROTO.IO
MARVELAPP
普羅特
AXURE RP
遠見
PROTO.IO
適用於 Mac OS 和 Windows。
主要特點： Proto.io 的標語是“感覺真實的原型” ，並且有充分的理由。 他們的產品使設計師能夠創建盡可能接近真實事物的高保真原型。 它可以用來 為移動應用程序和網絡應用程序創建原型。 他們的屏幕錄製工具可以讓您的團隊準確地看到您的觀眾如何與原型進行交互，離線模式允許您在沒有互聯網連接的情況下與原型進行交互，所有這些都無需編寫任何代碼。
定價：您可以通過 15 天的免費試用開始您的 Proto.io 體驗，然後可以選擇獲得免費帳戶，儘管它非常有限。 付費帳戶的範圍從每月 24 美元（一個用戶的年度訂閱，包括 5 個項目）到每月 160 美元（每年訂閱，10 個用戶，包括 30 個活動項目）不等。
獎勵：他們的一些最新工具包括矢量動畫，您可以自己導入或從他們的矢量動畫庫中選擇。 他們最近還推出了一個 VR 組件庫，可讓您輕鬆集成 360 度圖像。
MARVELAPP
作為適用於 Mac OS、iOS、Android 和 Windows 的 Web 應用程序提供。
主要特點： MarvelApp 是一個 適合經驗最少的設計師的出色原型工具。 它簡單的界面可能看起來很基本，但這是它的吸引力的一部分。 它不僅是新設計師的良好起點，還提供了更多經驗豐富的設計師所尋求的專業成果。 由於可以選擇從 Slack 或 Asana 導入您的團隊，Marvel 可以輕鬆掌握更改、新評論和進度。 雖然它是一個應用程序，但您可以使用它來為 Web 或移動設備創建原型。
定價：MarvelApp 對單個用戶免費提供，包括兩個項目。 他們的付費訂閱起價為單個用戶每月 12 美元、無限項目、受密碼保護的原型以及下載原型的選項。
獎勵： MarvelApp 適用於所有 iOS 設備，這意味著您可以在 iPhone、iPad、Apple Watch 甚至 Apple TV 上快速輕鬆地查看您的作品。
普羅特
可作為 iOS 和 Android 應用程序使用。
主要特點：使用移動應用程序創建原型可能聽起來有點限制，但 Prott 證明不必如此。 事實上，這個平台包含了很多功能和工具，可用於創建 UI 模型、桌面軟件原型、網站佈局、交互式線框和原型。 如果您與一個龐大的團隊合作，Prott 可以輕鬆地與他們分享更改並實時獲得反饋。
定價：Prott 提供免費試用，在 30 天期限結束後變為免費訂閱。 此選項適用於單個用戶和單個項目。 他們的付費計劃起價為每月 19 美元，適用於單個用戶、三個項目、無限屏幕和無限評論者。
獎勵： Prott 平台允許您在項目的任何地方發表評論，幫助您更輕鬆、更清晰地與團隊溝通。 您的團隊成員可以直接回复您的評論，確保在此過程中不會丟失任何內容。
AXURE RP
適用於 Mac 和 Windows。
主要特點： Axure RP 被認為是最全面的原型製作工具之一，因此他們擁有多少用戶也就不足為奇了。 雖然它是一個非常完整的界面，但對於經驗豐富的人來說，它是一個更好的選擇。 它在業界如此知名的另一個原因是它已經存在了很長時間，並且是大多數設計師在 2000 年代初期學習技能的工具。 值得一提的是，你需要一些編碼知識才能從這個工具中獲得你需要的東西。
定價：您可以從 30 天免費試用開始。 之後，訂閱從 Pro 級別開始，每位用戶每月 29 美元，而企業級別的訂閱費用高達每位用戶每月 99 美元。 永久許可證起價為每位用戶每月 49 美元，但在企業級別不可用。
獎勵：與其他原型製作工具相比，Axure RP 為設計師提供了最多的選擇。 雖然它的界面確實提供了最多的功能，但它確實以更複雜的系統為代價。 一旦掌握，Axure RP 會給你很好的結果。
遠見
由於它是基於 Web 的，因此可在所有操作系統上使用。
主要特點： InVision 是業內知名且備受推崇的工具，允許設計師為 Web、iOS 和 Android 製作原型。 該平台的設計考慮了大型團隊，因此協作輕而易舉。 它非常易於使用，您只需上傳您的設計文件並向其中添加動畫、手勢和過渡等元素。 最終結果是一個可靠的高保真原型。
定價：InVision 提供一個免費計劃，其中包括一個活動原型，之後付費計劃起價為每月 15 美元，單個用戶可購買三個原型。 五個用戶的團隊訂閱，包括無限原型，每月費用為 100 美元。
獎勵： InVision 最近發布了備受期待的 Studio，它號稱是“世界上最強大的屏幕設計工具”。 這個新工具希望簡化設計和創建功能原型之間的過程。 最好的部分是它是免費的！
創建您的產品模型
一旦你的原型已經準備好並且你已經回去解決你在測試過程中遇到的任何問題，你可能離發布日期越來越近了。 但是，在您上線之前，請確保您擁有正確的工具來正確推銷您的應用程序或網站。 使用展示您的新應用程序或網站在真實設備上的外觀的模型有助於吸引更多注意力。
什麼是樣機？
我們之前討論了線框和模型之間的區別，但是我們在這裡討論的模型類型是完全不同的。 一旦您的應用程序或網站準備好上線，這種類型的模型就會在最後出現。 這些基本上是您可以使用最終產品的圖像或屏幕截圖自定義的照片。 例如，您可以截取應用程序的屏幕截圖並將其拖放到 iPhone X 的屏幕上。
樣機很重要，因為它們可用於營銷和推廣您的應用程序或網站。 在為 App Store 或 Play Store 創建應用程序的屏幕截圖時，也可以使用它們。 Placeit 的模型易於使用且範圍廣泛。 您可以找到各種模型，包括 iPhone 模型、iPad 模型、MacBook 模型、瀏覽器模型和 Android 模型。
在樣機上展示您的作品
您可能很高興終於完成了您辛苦工作了這麼久的項目。 我們知道您可能沒有大量資金用於廣告，這就是 Placeit 的模型發揮作用的地方。 它們易於使用，可以為您的產品製作精美的圖像，而且非常實惠！ 無論您要宣傳什麼，iPhone 應用程序、iPad 應用程序或新網站，Placeit 都有最新的小工具模型供您參考！
如果您喜歡這篇文章，請嘗試這 10 個應用商店優化工具列表或查看 7 個提示來推廣您的應用。