提交需求
賽事與廣告咨詢合作,請(qǐng)?zhí)顚?xiě)需求表單,我們會(huì)在第一時(shí)間與您聯(lián)系!
掃一掃:有效連接線上世界和真實(shí)世界的方式,溝通線上和線下世界,把跨界體驗(yàn)變簡(jiǎn)單。
前言:掃一掃前生今世
日常生活中,掃一掃作為連接線上線下的橋梁變得越來(lái)越復(fù)雜和多功能。從微信推行二維碼,到如今掃描二維碼,條形碼,以及身份證,快遞,AR掃描,以圖搜圖,識(shí)別印刷文字,圖片信息,網(wǎng)站鏈接等各種各樣均可從線下掃到線上。
有效連接線上世界和真實(shí)世界的方式,溝通線上和線下世界,把跨界體驗(yàn)變簡(jiǎn)單。
掃描二維碼可以快速把用戶指向目的頁(yè)面,不需要輸入任何東西,尤其移動(dòng)設(shè)備輸入難度較大,而且達(dá)到信息源確保準(zhǔn)確無(wú)誤,類似web時(shí)代的網(wǎng)址。但它又比網(wǎng)址更多功能,可以增加物品本身信息量,人們通過(guò)掃碼和物品產(chǎn)生交互,使用幫助,記憶信息,包括視頻音頻多媒體各式各樣的信息。
除去未來(lái)的人臉識(shí)別,指紋識(shí)別,語(yǔ)音識(shí)別,是目前線下與線上連接最穩(wěn)定快捷主要通路
掃一掃得以流行傳承的三個(gè)原因:
1.有效性,存在使用價(jià)值
2.易用性,無(wú)需學(xué)習(xí)成本,或低成本學(xué)習(xí)掌握后即操作
3.可發(fā)現(xiàn)性,易于傳播,大范圍的被使用宣傳,個(gè)人商家商戶互相傳播使用
今天搜索幾大常用不同應(yīng)用來(lái)分析探討當(dāng)下掃一掃界面主要有哪些功能,提供哪些服務(wù),何種設(shè)計(jì)更方便快捷,以及成功掃描,失敗掃描情景提示。幫助之后設(shè)計(jì)中若涉及掃一掃功能,更全面了解。
一.掃一掃界面內(nèi)容有哪些?
1.掃描的頭部標(biāo)題
標(biāo)題有采取“掃一掃” 或無(wú)標(biāo)題,以及根據(jù)掃描場(chǎng)景寫(xiě)標(biāo)題
2.掃描界面的功能入口
相冊(cè),手電筒,歷史記錄,關(guān)閉(或返回首頁(yè)),切換AR掃描,圖片搜貨,付款碼,我的二維碼,使用幫助
3.可掃描的內(nèi)容
二維碼,條形碼,圖片,以圖識(shí)文,以圖搜圖
4.二維碼掃描框的大小以及位置
位置普遍居中偏上,大小根據(jù)掃描內(nèi)容不同而變化
5.錯(cuò)誤異常狀態(tài)提示,以及提示文字
在頂部底部中間彈窗,提示異常的掃描結(jié)果,提示文字會(huì)根據(jù)掃描的時(shí)長(zhǎng)變化,幫助用戶操作,減少等待焦慮
二.“掃一掃”前中后狀態(tài)交互提示
以支付寶中掃一掃為案例:
整個(gè)掃描過(guò)程,根據(jù)情景和用戶心里活動(dòng),針對(duì)性提醒,常規(guī)正常狀態(tài)安靜的隱蔽,操作受阻出現(xiàn)情緒化時(shí)即使撫慰;需要幫助主動(dòng)尋找方案,支付寶整體交互細(xì)節(jié)深鉆用戶深層需求,預(yù)見(jiàn)洞察需求不做馬后炮,多嘴舌。
知識(shí)點(diǎn):參照案例,如何在自己項(xiàng)目中深度挖掘情景化設(shè)計(jì)?
思考:針對(duì)上述案例,在感慨他人思考深入完善同時(shí),我們?cè)撊绾伟阎R(shí)點(diǎn)運(yùn)用到自己項(xiàng)目中,通過(guò)哪些方法策略能夠接觸挖掘到用戶的設(shè)計(jì)點(diǎn)呢?
首先了解什么是情景化設(shè)計(jì)?在場(chǎng)景中的用戶,與情境互動(dòng),孕育、改變著需求。用戶場(chǎng)景是某時(shí)間(when)某地點(diǎn)(where)特定類型用戶會(huì)(who)會(huì)通過(guò)某種手段(method)來(lái)滿足(do)這種欲望。
例如:用戶根據(jù)趣味功能選擇社群-場(chǎng)景,社群的氛圍、構(gòu)造、規(guī)則定義了用戶;百事可樂(lè)典型場(chǎng)景是年輕人聚會(huì),可口可樂(lè)在中國(guó)典型場(chǎng)景是過(guò)年回家。
再次如何根據(jù)場(chǎng)景做設(shè)計(jì),通過(guò)翻看查閱交互書(shū)籍和分享的文章
總結(jié)出主要分為三步:
第一步:列出設(shè)計(jì)場(chǎng)景,通過(guò)流程圖,故事板,頭腦風(fēng)暴整理出關(guān)鍵場(chǎng)景。例如編寫(xiě)場(chǎng)景故事,包含誰(shuí)在哪些時(shí)候做哪些事情,當(dāng)前環(huán)境是怎樣,有何外界因素影響 ,用戶的情緒是怎樣
第二步:深度分析列舉場(chǎng)景,發(fā)掘機(jī)會(huì)點(diǎn);通過(guò)故事板,流程圖列出關(guān)鍵場(chǎng)景,通過(guò)分析當(dāng)前場(chǎng)景用戶的操作,和預(yù)見(jiàn)下一步的操作尋找發(fā)掘機(jī)會(huì)點(diǎn),有針對(duì)性性滿足不同用戶需求。
第三步:設(shè)計(jì)宗旨在于解決問(wèn)題,通過(guò)設(shè)計(jì)策略方法想出最優(yōu)方案,將機(jī)會(huì)點(diǎn)轉(zhuǎn)化成設(shè)計(jì)點(diǎn)。
在這分享下來(lái)自阿里設(shè)計(jì)師的策略方法高效,5種思考方向:
● 行動(dòng)點(diǎn)前置插入:預(yù)期到用戶下步操作,縮短關(guān)鍵流程。微信發(fā)圖,手機(jī)截圖時(shí)彈出分享編輯等
● 行動(dòng)點(diǎn)替換:一般是指當(dāng)前場(chǎng)景下某個(gè)行動(dòng)點(diǎn)的功能不再適合當(dāng)前場(chǎng)景,因而將其替換為另外的需求較強(qiáng)的行動(dòng)點(diǎn),位置不發(fā)生變化,而功能變化,為用戶提供當(dāng)前場(chǎng)景需要的或與下一步意圖相關(guān)的行動(dòng)點(diǎn)能夠幫助用戶提高操作效率。例如底部Tab欄常規(guī)時(shí)顯示首頁(yè),上下滑動(dòng)時(shí)則變成返回頂部。
● 行動(dòng)相關(guān)推送:指根據(jù)用戶當(dāng)前或下一步的行為提供相關(guān)推送或提示,以輔助用戶進(jìn)行決策行動(dòng),提高用戶操作效率。縮短關(guān)鍵步驟。
● 突出行動(dòng)點(diǎn):預(yù)期到用戶下一步的行為后通過(guò)顏色或提示等方式對(duì)行動(dòng)點(diǎn)進(jìn)行突出,吸引并提醒用戶點(diǎn)擊,減少思考成本,提高操作效率;掃一掃光線較暗時(shí),自動(dòng)打開(kāi)手電筒。
● 自動(dòng)執(zhí)行:適用于一些需求較為明確的行動(dòng)點(diǎn),做用戶之所想,提高操作流暢性及效率
另外情感化,和貼心同樣是情感化設(shè)計(jì)的目的,和思考切入點(diǎn),產(chǎn)品設(shè)計(jì)本質(zhì)是讓用戶更容易,更愉悅地使用產(chǎn)品。
三.異常狀態(tài)提示的不同樣式
異常狀態(tài)的文字提醒,展示位置,上中下,跳轉(zhuǎn)界面均有不同案例。
注:支付寶掃描微信二維碼時(shí)會(huì)明顯阻止無(wú)法掃描,其他應(yīng)用掃描微信二維碼時(shí)會(huì)提醒是否跳入對(duì)應(yīng)鏈接。
知識(shí)點(diǎn):關(guān)于容錯(cuò)機(jī)制
界面設(shè)計(jì)中會(huì)出現(xiàn)各種極端狀態(tài),錯(cuò)誤提醒,如何合理設(shè)計(jì)容錯(cuò)機(jī)制,適當(dāng)情景給予合適的提醒,又允許用戶微微犯錯(cuò),有返回余地呢?
容錯(cuò)性:是產(chǎn)品對(duì)錯(cuò)誤操作的承載性能,即一個(gè)產(chǎn)品操作時(shí)出現(xiàn)錯(cuò)誤的概率和錯(cuò)誤出現(xiàn)后得到解決的概率和效率。容錯(cuò)性最初應(yīng)用于計(jì)算機(jī)領(lǐng)域,它的存在能保證系統(tǒng)在故障存在的情況下不失效,仍然正常工作。產(chǎn)品容錯(cuò)性設(shè)計(jì)能使產(chǎn)品與人的交流或人與人借助產(chǎn)品的交流更加流暢。
容錯(cuò)性設(shè)計(jì)原則:
1.合適的引導(dǎo)和貼心提示
無(wú)論針對(duì)新手用戶或老用戶,以及新功能上線,重要操作是,能給出詳盡文字說(shuō)明和指導(dǎo)方向,以及智能預(yù)測(cè)用戶出錯(cuò)原因。并且引導(dǎo)內(nèi)容簡(jiǎn)單容易理解,引起用戶注意時(shí)快速獲得信息幫助,降低錯(cuò)誤發(fā)生概率。
在結(jié)果不可逆操作是,例如退出編輯,取消支付等,詢問(wèn)用戶讓其指導(dǎo)操作的后果
2.限制操作
增加不可逆操作的難度,適當(dāng)限制用戶的某些交互操作,例如不可點(diǎn)擊時(shí) 變灰色,表單未填寫(xiě)內(nèi)容時(shí),按鈕呈灰色不可點(diǎn)擊狀態(tài)
3.用戶錯(cuò)誤發(fā)生時(shí),及時(shí)提供糾錯(cuò)幫助
4.錯(cuò)誤恢復(fù)
允許犯錯(cuò),并存在撤銷以前的命令,盡可能保留操作信息,能幫助用戶發(fā)送錯(cuò)誤后迅速回到正確狀態(tài)
5.減少負(fù)擔(dān),盡可能減少記憶負(fù)擔(dān),減少認(rèn)知混淆,讓用戶啊單次只執(zhí)行唯一操作,減少不必要操作步驟
四.掃一掃中的幫助頁(yè)面
解釋說(shuō)明主要能夠掃描的內(nèi)容,引導(dǎo)用戶操作,同時(shí)宣傳相關(guān)掃描活動(dòng),根據(jù)實(shí)際使用場(chǎng)景,合情合理的插入運(yùn)營(yíng)活動(dòng)信息
圖三圖五幫助頁(yè)面:進(jìn)入后直接提供拍照傳圖的入口以及輸入入口,把幫助說(shuō)明和實(shí)際功能操作結(jié)合在一起,不僅是圖片演示,無(wú)需再次返回掃描界面
知識(shí)點(diǎn):如何讓幫助頁(yè)面深入人心,起到真正幫助作用呢?
1.用戶錯(cuò)誤或不懂如何操作時(shí),及時(shí)提供糾錯(cuò)幫助,減少挫敗感,例如當(dāng)下空白頁(yè)面,錯(cuò)誤頁(yè)面的情感化設(shè)計(jì),友好提醒不能責(zé)備或威脅用戶
2.出現(xiàn)錯(cuò)誤的提示詞用簡(jiǎn)潔易懂清晰的詞匯表達(dá),不要使用術(shù)語(yǔ)
3.出錯(cuò)后提出的建議,應(yīng)該有建設(shè)性幫助,智能糾錯(cuò)減少二次輸入,以及提供快速入口,避免返回重新操作
五.掃圖識(shí)字
常見(jiàn)于以掃描為主的應(yīng)用,類似掃描全能王,翻譯,通過(guò)以圖識(shí)別文字,并直接翻譯
文字識(shí)別出后可允許復(fù)制,編輯,翻譯保存照片
設(shè)計(jì)點(diǎn):實(shí)時(shí)反饋掃描結(jié)果,讓結(jié)果和原圖處于同一視覺(jué)界面內(nèi),便于對(duì)照檢測(cè)內(nèi)容正確性
六.掃描證件、卡片、文件等
同掃圖識(shí)別文字相似,主要是固定類似的文字,識(shí)別賬號(hào)卡號(hào),在界面展示上要求信息操作一體化,直觀看到掃描的結(jié)果,允許編輯修改內(nèi)容,掃描作為輔助輸入工具
七.掃一掃 和 手動(dòng)輸入 如何高效切換
掃一掃獲取信息,鏈接線上線下方便快捷,但容易受外界因素影響,例如掃描卡號(hào),掃碼開(kāi)鎖等,同樣可手動(dòng)輸入;
如何快捷切換輸入與掃一掃呢
1.掃描框底部明確提示可以掃描內(nèi)容
2.輸入入口命名清晰直觀
3.自動(dòng)根據(jù)輸入內(nèi)容調(diào)出相關(guān)鍵盤(pán)類型,減少點(diǎn)擊
4.輸入和掃描處在同一界面,沉浸同一場(chǎng)景,減少頁(yè)面跳轉(zhuǎn),快速互相切換
八.掃一掃 的那些廣告
掃一掃逐漸被普及,用戶習(xí)慣凡事掃一掃,界面曝光機(jī)會(huì)增加,內(nèi)容簡(jiǎn)潔,在不引起用戶注意下,順帶增加廣告信息
不浪費(fèi)每一處的廣告位,多使用電商行業(yè)
在設(shè)計(jì)中我們也要思考如何合情合理的插播廣告,看到廣告讓用戶感受到的不是反感,而是貼心的正合我意。
尾言:糕小糕的思考
掃描雖然頻繁被使用,但目前用戶習(xí)慣使用微信掃一掃,或手機(jī)自帶掃一掃,對(duì)軟件應(yīng)用自身攜帶掃一掃缺乏使用場(chǎng)景和常識(shí)
但市面上應(yīng)用基本把掃一掃當(dāng)做標(biāo)配,放在首頁(yè)最頂部,用戶多不知此處掃一掃和“微信” “手機(jī)自帶”有何區(qū)別。設(shè)計(jì)產(chǎn)品時(shí)也應(yīng)避免為了做功能而做功能,如何讓掃一掃發(fā)揮最大價(jià)值,而非擺設(shè)。
首先從應(yīng)用本身屬性分析,軟件需要哪些來(lái)自線下的信息,和外界產(chǎn)品有何不同?如何更好地使用掃一掃提升交互體驗(yàn)?zāi)兀?/strong>
例如掃描前提示語(yǔ),掃描后信息展示,可以被修改
不如在 輸入卡號(hào)時(shí),加入掃一掃;輸入地址時(shí);復(fù)制文字
作為UI設(shè)計(jì)師,除了提供專業(yè)技能的輸出,同時(shí)多思考如何讓現(xiàn)有技術(shù)價(jià)值最大化,向產(chǎn)品設(shè)計(jì)師精進(jìn)。
參考文獻(xiàn):
1.阿里設(shè)計(jì)師:如何根據(jù)用戶場(chǎng)景設(shè)計(jì)產(chǎn)品? http://uxren.cn/?p=45575
2.產(chǎn)品容錯(cuò)性設(shè)計(jì)原則 http://www.htnj110.cn/detail/96826.html
作者:糕小糕,正所謂:書(shū)宜雜讀,業(yè)宜精鉆
希望我的分享對(duì)你有所幫助
密碼登錄
大牛,別默默的看了,快登錄幫我點(diǎn)評(píng)一下吧!:)
登錄 立即注冊(cè)