你真的會畫線框圖嗎？2015.8.7課件_第1頁
你真的會畫線框圖嗎？2015.8.7課件_第2頁
你真的會畫線框圖嗎？2015.8.7課件_第3頁
你真的會畫線框圖嗎？2015.8.7課件_第4頁
你真的會畫線框圖嗎？2015.8.7課件_第5頁
已閱讀5頁，還剩15頁未讀， 繼續免費閱讀

下載本文檔

版權說明：本文檔由用戶提供并上傳，收益歸屬內容提供方，若內容存在侵權，請進行舉報或認領

文檔簡介

你真的會畫線框圖嗎？什么是線框圖線框圖是產品設計的低保真呈現方式。它有三個簡單直接而明確的目標：1、呈現主體信息群2、勾勒出結構和布局3、用戶交互界面的主視覺和描述正確地創建了線框圖之后，它將作為產品的骨干而存在。它就像一幢建筑的藍圖一樣，將細節規定地明明白白。畫好線框圖的幾件小事通過明暗對比表達不使用截圖與顏色合理的布局及間距遵守柵格規范標記第一屏高度了解視覺趨勢表達清楚UI邏輯使用真實、符合邏輯數據內容不遺漏特殊狀態的描述避免流水賬式的說明關于重復出現的模塊透過明暗對比表達線框圖案例：不使用截圖與顏色優點：

制作的線框圖更規范，不會對視覺設計師產生設計干擾使用截圖與顏色線框圖案例：

說明：這樣雖然能表達產品的想法，但是會對視覺設計師造成干擾，整體感覺讓人覺得很不規范。合理的布局及間距優點：保持簡單合理的布局結構，符合用戶的使用習慣，能減少視覺設計的時間。布局要點：

考慮布局標準及美觀程度不出現2列3列混排的布局避免文字使用密集符合用戶使用習慣

遵守柵格規范什么是柵格？柵格設計系統，是一種平面設計的方法與風格，運用固定的格子設計版面布局，風格工整簡潔，是當今出版物設計的主流風格之一。使用柵格規范的優點：用柵格原理確定網站布局及具體尺寸，減少了思考寬度或高度的煩惱；頁面規范可重用，節約開發成本。

標記第一屏高度為什么要標記第一屏高度？

我們都知道，最重要的內容，重要的操作按鈕一定要在第一屏內完全顯示，否則用戶第一眼看不到，就會放棄這個頁面，從而影響轉化率。第一屏應該多高？詳情看下圖：

說明：在1024*768的分辨率下第一屏的高度可以用570px,有時候也可600px.融入最新UI風格的線框圖亮點：留白增多、通過空隙和留白分隔區域，布局更規整使用真實、符合邏輯數據內容優點：

使用真實、符合邏輯的數據內容能有效的減少溝通本，讓人一目了然。

圖1圖2通過下圖1，圖2對比，圖1的優勢不言而喻。不遺漏特殊狀態的描述

在設計過程中我們更多地考慮正常情況的狀態，而忽略了特殊狀態。但這往往對后續的工作很重要，因此不遺漏特殊狀態的描述對線框圖設計過程是十分重要的。解決方案看下圖：避免流水賬式的說明避免流水賬式的三種解決方案：流程圖代替文字巧妙組織文字說明制作動態效果

避免流水賬式的說明流程圖代替文字說明

用流程圖表述更清晰，更有條理性避免流水賬式的說明巧妙組織文字說明

利用“if、else、case”邏輯性強的文字表述在訂單確認滿足以下條件，返回購物車頁面案例：case1：庫存下降，且少于用戶購買量case2：價格變動case3：case1&case2

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網頁內容里面會有圖紙預覽，若沒有圖紙預覽就沒有圖紙。
  • 4. 未經權益所有人同意不得將文件中的內容挪作商業或盈利用途。
  • 5. 人人文庫網僅提供信息存儲空間，僅對用戶上傳內容的表現方式做保護處理，對用戶上傳分享的文檔內容本身不做任何修改或編輯，并不能對任何下載內容負責。
  • 6. 下載文件中如有侵權或不適當內容，請與我們聯系，我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論