輕松看懂規(guī)范!詳解組件控件結(jié)構(gòu)系統(tǒng)之指導(dǎo)類
Echo :指導(dǎo)是帶領(lǐng)用戶更快速更愉悅地達(dá)到目標(biāo)的過程,能在用戶使用產(chǎn)品功能前或碰到停滯之前給予及時(shí)的指導(dǎo)提醒。為了營業(yè)或者產(chǎn)品目標(biāo)的必要,偶然候必要給予一些適當(dāng)?shù)奶嵝逊奖阌脩羧ダ斫猱a(chǎn)品。
為了完成不同的指導(dǎo)內(nèi)容和指導(dǎo)的目標(biāo),移動(dòng)端的指導(dǎo)設(shè)計(jì)會(huì)根據(jù)需求進(jìn)行不同的多樣化處理。常見的指導(dǎo)有:指導(dǎo)頁(幻燈片)式指導(dǎo),浮層式指導(dǎo),嵌入式指導(dǎo)。
三種類型的指導(dǎo)各有各自的特點(diǎn)以及使用場景,本篇文章詳解組件控件結(jié)構(gòu)系統(tǒng)—指導(dǎo)類。
仍舊附上一張腦圖:組件控件分類(假如單純通過組件控件,難以知足功能劃分的需求,所以我將這個(gè)范圍擴(kuò)大,分類里面不僅僅含有組件和控件,所以請(qǐng)不要在意細(xì)節(jié)。)
指導(dǎo)頁(幻燈片)式指導(dǎo)
定義:一樣平常出如今App首次啟動(dòng)的時(shí)候,是一系列宣傳、解說、幫助等網(wǎng)頁的組合。
在移動(dòng)互聯(lián)網(wǎng)的產(chǎn)品的設(shè)計(jì)中,指導(dǎo)頁的設(shè)計(jì)則是在用戶初次使用該移動(dòng)產(chǎn)品時(shí),給予的一些必須性的幫助以使得用戶能快速愉悅地了解這個(gè)產(chǎn)品的功能與詳細(xì)操作體例。
一方面從產(chǎn)品的角度考慮,產(chǎn)品盼望用戶能夠方便的理解產(chǎn)品的特征,削減對(duì)產(chǎn)品的陌生感;另一方面,從用戶角度來看,一個(gè)應(yīng)用里好的指導(dǎo)不僅能使他們對(duì)這個(gè)應(yīng)用有好感,也可能更容易得留住他們。
用途:
- 讓用戶快速了解是一個(gè)什么樣的產(chǎn)品。
- 讓用戶快速了解該產(chǎn)品的主功能、或者要重點(diǎn)宣傳的特色、龐大替換功能。
建議:
- 文案簡單易懂,重點(diǎn)凸起。
- 內(nèi)容可以是圖片、視頻、插畫漫畫等,且內(nèi)容和文案要有肯定的關(guān)聯(lián)性。
- 分頁符一樣平常是2-5個(gè)。
- 提供可以直接跳過指導(dǎo)頁的操作,不強(qiáng)制用戶肯定悉數(shù)欣賞。
使用場景:
- 用戶第一次使用時(shí),產(chǎn)品通過指導(dǎo)頁讓用戶快速了解產(chǎn)品的主功能。
- 用戶更新產(chǎn)品時(shí),產(chǎn)品通過指導(dǎo)頁給用戶傳導(dǎo)更新的新功能。
浮層式指導(dǎo)
定義:一種輕量級(jí)單目標(biāo)性很強(qiáng)的指導(dǎo)體例,一樣平常是浮層結(jié)合文案的,樣式類似氣泡的指導(dǎo)體例。
用途:
- 提醒用戶新增功能或網(wǎng)頁調(diào)整,或如何使用該功能。
- 提醒用戶緊張功能或一些隱蔽操作。
建議:
- 特有文案、帶有指示箭頭的類似氣泡設(shè)計(jì)。
- 一樣平常為非模態(tài)浮層,也許表現(xiàn)3秒左右主動(dòng)消散,對(duì)用戶干擾較小。
- 文案上盡量簡潔,表意清晰,建議控制20字以內(nèi)。
使用場景:
- 有些新增功能不易讓用戶察覺同時(shí)這些功能對(duì)產(chǎn)品自己來說比較緊張,這時(shí)候必要浮層指導(dǎo),讓用戶知道該功能或者使用方法。
- 用于新手指導(dǎo)。
嵌入式指導(dǎo)
定義:將指導(dǎo)內(nèi)容直接嵌入到界面中的指導(dǎo)體例,可以嵌入到狀況欄、導(dǎo)航欄、工具欄,比較常見的是嵌入到主題內(nèi)容界面中。
用途:
- 讓用戶了解當(dāng)前界面或者操作處于何種狀況,并引導(dǎo)接下來如何操作使用。
- 保留當(dāng)前界面的內(nèi)容,同時(shí)增長指導(dǎo)提醒。
建議:
文案簡短表述當(dāng)前狀況并告知用戶如何操作。
使用場景:
- 非常狀況時(shí)使用嵌入式指導(dǎo),目的是提醒用戶非常狀況。
- 初始狀況時(shí),因?yàn)榻缑鏀?shù)據(jù)為空,這時(shí)候通過嵌入式指導(dǎo)提醒用戶操作。
三種指導(dǎo)類型按照緊張度依次為:指導(dǎo)頁(幻燈片)式指導(dǎo) > 浮層式指導(dǎo) > 嵌入式指導(dǎo)。三種指導(dǎo)可相互組合使用。到底使用哪個(gè)?則根據(jù)營業(yè)和對(duì)產(chǎn)品的定位來判斷。
迎接關(guān)注作者的微信公眾號(hào):「UEDC」
本文地址:http://irelandcustomcontracting.com/tutorial/di3914.html
您可能還喜歡
- Macaron 馬卡龍系色譜 ;附HC(16進(jìn)制碼
- 7個(gè)手機(jī)版網(wǎng)頁設(shè)計(jì)的原則
- 折紙多邊形網(wǎng)頁背景效果制作教程
- 龐門正道:好好玩耍的點(diǎn)線面(上)
- 網(wǎng)頁設(shè)計(jì)中的常見頁面布局方式
- WAP APP的柵格設(shè)計(jì)
- 八種很漂亮的排版方法和技巧分享
- 網(wǎng)頁設(shè)計(jì)的首屏標(biāo)準(zhǔn)你了解多少?
- 字體大寶庫:40款為網(wǎng)頁設(shè)計(jì)師準(zhǔn)備的時(shí)
- 視覺設(shè)計(jì)分享—專題頁面設(shè)計(jì)篇
- 專訪:石墨文檔產(chǎn)品總監(jiān)羅穎
- UI設(shè)計(jì)不得不知的移動(dòng)端UI尺寸適
- 光音移動(dòng)設(shè)計(jì)規(guī)范 — 表單類
- 體驗(yàn)設(shè)計(jì)中的排序問題
- 網(wǎng)頁設(shè)計(jì)精粹 網(wǎng)頁中那些迷人的按
- aliued:響應(yīng)式設(shè)計(jì)的現(xiàn)狀與趨勢
- 10個(gè)智能對(duì)象處理的ps技巧
- 網(wǎng)頁UI - 原子設(shè)計(jì)理論(上)
- 如何通過設(shè)計(jì)提升banner點(diǎn)擊率?
- 晉小彥視覺設(shè)計(jì)系列文章(二):全屏