1 一些設(shè)計(jì)原則

避免用戶使用產(chǎn)品時(shí)的挫折感，我們需要提供：用戶易于理解的信息，避免專業(yè)術(shù)語(yǔ)；提供有用的信息；提供下一步操作，引導(dǎo)用戶繼續(xù)其他操作。“易懂”、“有用”、“引導(dǎo)”

尼爾森十大可用性原則? ??

拇指區(qū)域設(shè)計(jì)原則??

避免用戶產(chǎn)生跳離感

下方區(qū)域的設(shè)計(jì)

記憶塊原則

記憶塊原則實(shí)例

2 一些視覺(jué)規(guī)律

格式塔心理學(xué)：人眼在觀看時(shí)，將各個(gè)部分組合起來(lái)，使之成為一個(gè)更易于理解的統(tǒng)一體。眼腦作用是一個(gè)不斷組織、簡(jiǎn)化、統(tǒng)一的過(guò)程從而產(chǎn)生出易于理解、協(xié)調(diào)的整體

格式塔心理學(xué)5項(xiàng)法則??

接近

接近實(shí)例

相似

用顏色表達(dá)相似-同模塊的信息??

閉合

閉合實(shí)例

連續(xù)性

頁(yè)面間的連續(xù)性表達(dá)同組信息??

簡(jiǎn)單

簡(jiǎn)單法則-合并、刪除、弱化、隱藏??

視覺(jué)規(guī)律-視覺(jué)流

視覺(jué)流規(guī)律

3 開(kāi)發(fā)知識(shí)

APP的實(shí)現(xiàn)方式-本地 or H5頁(yè)面? or 混合??

混合方式的性能優(yōu)化方法??

緩存，減少、優(yōu)先加載??

減少請(qǐng)求數(shù)、優(yōu)化圖片??

壓縮HTML

H5頁(yè)面設(shè)計(jì)要點(diǎn)-以展示為主??

4 頁(yè)面設(shè)計(jì)

App包括功能模塊、組件、元素??

頁(yè)面尺寸

頁(yè)面顏色，交互稿應(yīng)使用灰度圖，以便不影響視覺(jué)設(shè)計(jì)?？墒褂肁xure色板中預(yù)設(shè)的黑白灰色，注意層次美觀，根據(jù)重要程度區(qū)分黑白灰，形成對(duì)比。

字體字號(hào)設(shè)置

文案分類

圖片與圖標(biāo)

5 交互說(shuō)明

交互說(shuō)明原則：由大到小、明確細(xì)節(jié)、務(wù)求全面

全局性說(shuō)明

設(shè)計(jì)師需沉淀全局性元件庫(kù)，提高統(tǒng)一性及效率，避免重復(fù)繪制元件。

交互說(shuō)明樣式1

交互說(shuō)明樣式2

元素及文字說(shuō)明一一對(duì)應(yīng)

交互動(dòng)作

界面動(dòng)效

交互說(shuō)明示例

交互說(shuō)明維度

6?內(nèi)部評(píng)審和用戶測(cè)試

交互稿做完后，可以在設(shè)計(jì)部門內(nèi)組織內(nèi)部評(píng)審或小測(cè)試。

內(nèi)部評(píng)審

用戶測(cè)試