線框圖是幾乎所有網(wǎng)站設(shè)計和應用程序設(shè)計中必須經(jīng)歷的過程之一。 想想你在一個項目上草擬了多少個關(guān)于頁面版塊的草圖？ 你在最終方案定下來以前和客戶以及經(jīng)過了多少次的頭腦風暴？

不管是什么類型的線框圖，都是設(shè)計和迭代過程中同樣重要的部分。

不管是哪種類型的線框圖，都需要花費較多的精力來創(chuàng)建，這就是線框模板的用處。以下我們整理了一些你在使用它們的時候應該注意的一些事項，以及它們?nèi)绾螏椭愎?jié)省時間，提高線框圖質(zhì)量并為你提供幫助，以物理形式記下你的想法。

什么是網(wǎng)站線框模板？

線框圖是網(wǎng)站設(shè)計過程中概念匯總的基本示意圖。 每種頁面類型可能都有自己的線框圖。 這些設(shè)計通常以草圖的形式開始，最終可以演變?yōu)槟Ｐ突蛟汀?/p>

網(wǎng)站線框模板是具有線框圖元素而非用戶界面組件的偽UI套件。 許多模板的名稱中都使用了“線框UI套件”，但并非完全如此。

線框模板可能適用于Sketch或Adobe XD或Photoshop。 你選擇的模板應與你的工具和工作流程相對應。

好的線框模板應具有用于不同類型頁面，圖形以及形狀等元素，并且不要過于花哨。 你需要有圖像塊，文本塊，按鈕塊和畫布上的一些（臺式機，移動設(shè)備）常見的部件。

你不需要在線框圖階段就使它看起來像完成設(shè)計的東西。 選擇黑白線型線框。 保真度過高或包含顏色和圖像的任何事物都可能使客戶感到困惑，使他們認為他們正在考慮實際的設(shè)計概念（再說，你一定不會想在線框圖階段就考慮這些東西）。

使用線框模板的5個原因

它可能是設(shè)計過程中的絕佳工具。 模板只是加快了一切。

· 線框模板可以節(jié)省時間，幫助你以新穎的方式快速構(gòu)思你的想法。

· 線框可幫助你及早發(fā)現(xiàn)設(shè)計缺陷和可用性問題。

· 線框模板可幫助你考慮不同類型的頁面和頁面元素，因此你不會遺漏任何東西。

· 線框為設(shè)計奠定了堅實的基礎(chǔ)。

· 從長遠來看，線框模板可以幫助你節(jié)省費用，可以幫助客戶理解設(shè)計而無需投資完整的模型。

如何使用線框模板？

大多數(shù)線框模板的工作原理類似于UI套件，其中包含可以在所選軟件中移動的元素。

確切用法取決于你具體使用的工具。

大多數(shù)線框模板都帶有通常結(jié)構(gòu)良好的頁面，因此你只需對項目的總體布局進行簡單的更改即可。

我傾向于那些可以使用拖放功能的選項。 Photoshop圖層文件也很好，就像我所說的，這主要取決于個人喜好和工作流程。

有效使用線框模板的關(guān)鍵是選擇能夠反映你的工作流程，支持你要使用的軟件并在整個過程中始終堅持不懈的工作。 許多工具可讓你將線框開發(fā)并發(fā)展為高保真模型。 如果這是計劃的工作流程的一部分，請相應地選擇一個模板。

如何獲取線框模板？

在使用網(wǎng)站線框模板時，有兩種選擇：

· 創(chuàng)建屬于你自己的；

· 下載預制模板。

第一個可能是最具自定義的解決方案，但可能會很耗時。

后者提供了多種不同的模板類型，并提供免費和高級選項供你選擇。

具體選擇哪個選項可能取決于時間，以及需要多長時間才能使用模板。 使用預制模板通常是快速入門。 最困難的部分可能是你需要對搜索中的所有可用的內(nèi)容進行選擇，以找到正確的。

5種你可以嘗試的線框模板

準備開始使用網(wǎng)站線框模板了嗎？ 你可以通過以下五個不同的模板來測試，以了解將其用于項目的感覺。

1.Clean UI Kit for Rough Sketching

這種極簡類型的線框模板包含有可互換的零件，這些零件具有近似草圖的樣式，可用于快速設(shè)計。

2.Flow iOS Wireframe Kit

此Sketch線框模板是應用程序或移動網(wǎng)站設(shè)計概念的良好入門。 線框元素簡單實用。

3.Wirey Wireframe Kit

Wirey包括Photoshop和Sketch模板，為你提供了一些線框圖的靈活性。 該模板包含200多個組件和1,000個元素，因此你所需的一切幾乎都在這里。

4.Responsive Wireframe Kit

用于Figma and Sketch的線框模板，旨在幫助你從早期的線框制作一直到原型制作。 它包括大量的塊和模板，適用于臺式機，移動設(shè)備和平板電腦，以幫助你專注于響應式思維過程。

5.UX Workflow Wireframe and Sitemap Creator

該線框模板包含了可供選擇的頁面和站點選項。 如果你需要一些入門幫助，則這樣的模板可以幫助你從一開始就計劃你的整個項目。

總結(jié)

網(wǎng)站線框模板是可以簡化設(shè)計的快捷方式之一。

你可以在選擇直接在紙上畫草圖，但這不是為客戶準備的。 因此，你最好使用模板將亂七八糟的東西轉(zhuǎn)換為看起來很漂亮的東西。 模板使此操作變得更快，更容易，并且使我不喜歡做的事情更易于管理。

如果你還沒有嘗試使用線框模板，出于這個原因，我強烈建議你嘗試它。 抓住上面的示例之一，甚至考慮創(chuàng)建自己可以使用和重用的示例。

----圖文來自：design shack 

----由深圳網(wǎng)站建設(shè)公司-Clh翻譯編輯整理，為您提供更多有關(guān)深圳網(wǎng)站建設(shè)、網(wǎng)站設(shè)計、網(wǎng)頁設(shè)計及其他互聯(lián)網(wǎng)應用服務(wù)