如何設(shè)計手勢驅(qū)動的用戶界面

2014-10-13    分類: 網(wǎng)站建設(shè)

如何設(shè)計手勢驅(qū)動的用戶界面

成都網(wǎng)站制作還記得那些用鼠標懸停和點擊的時間是與站點或應用程序交互的最常用的觸發(fā)器嗎?那些日子過去了。當蘋果推出第一款iPhone時,多點觸控技術(shù)成為主流,用戶了解到,他們不僅可以在界面上點擊和點擊,還可以進行壓縮、擴展和刷卡。手勢成為新的點擊。

今天,移動UI的成功可以通過它如何有效地使用手勢來實現(xiàn)。

如何選擇好的手勢

當在你的UI中加入手勢時,了解你的市場和你的目標用戶可能使用的其他應用程序是很重要的。嘗試在應用程序中使用相同類型的手勢。這樣,你不僅可以根據(jù)目標市場的行為優(yōu)化用戶界面,而且從一開始就為用戶設(shè)計了一種更舒適的方法。

教學的手勢

手勢在每個移動應用程序中都是必須的,但對于用戶來說,這顯然是一個挑戰(zhàn)。觸摸界面提供許多機會使用自然的手勢,如點擊、刷卡和捏來完成事情,但不同于圖形用戶界面控件,基于手勢的交互常常隱藏在用戶中。因此,除非用戶事先知道手勢存在,否則他們不會嘗試。

因此,設(shè)計發(fā)現(xiàn)是至關(guān)重要的。你需要確保你提供正確的線索,視覺藝術(shù)的價值,幫助用戶發(fā)現(xiàn)很容易他們怎么能與界面相互作用。


避免在入職輔導和演練

教程和演練手勢驅(qū)動程序相當流行的做法。在許多應用程序中包含教程,意味著向用戶顯示一些指令來解釋接口。然而,UI指南并不是解釋應用程序核心功能的最優(yōu)雅的方法。前期教程的主要問題是,用戶一旦進入應用程序,就必須記住使用這些應用程序的所有新方法。過多的信息可能會導致更多的混亂。例如,明確的應用程序從一個強制性的7頁的教程和用戶有耐心地閱讀所有的信息,試圖把它自己的記憶。這是一個糟糕的設(shè)計,因為它要求用戶在實際試用應用程序之前就要進行前期工作。

如何設(shè)計手勢驅(qū)動的用戶界面

在行動的背景下教育

當教用戶使用UI時,我建議主要通過在動作的上下文中進行教育(當用戶確實需要它的時候)。為了給人們一個新的姿態(tài),你必須慢慢地開始。給定一些迭代,指令可以轉(zhuǎn)換成一個更漸進的發(fā)現(xiàn)。使用即時提示,專注于解釋單個交互,而不是試圖解釋用戶界面中的每一個可能的操作。通過提供明顯的上下文線索暗示手勢。

下面你可以看到一個手勢教育屏幕從YouTube應用程序的Android。該應用程序具有基于手勢的交互,但不使用教程來指導用戶。相反,它使用在第一次啟動時出現(xiàn)的新用戶的提示,當用戶到達應用程序的相關(guān)部分時,每次都會出現(xiàn)一個。該技術(shù)基于文本命令,提示用戶執(zhí)行手勢,并用簡短而清晰的描述描述交互的結(jié)果。

如何設(shè)計手勢驅(qū)動的用戶界面

使用動畫來傳達手勢

如果沒有動畫,手勢就可以用得上。作為一名設(shè)計師,您可以利用動畫來傳達關(guān)于可用操作的信息。例如,為了讓用戶意識到它們可以與某個元素交互,可以在交互元素上創(chuàng)建一個文本命令,并對交互結(jié)果進行動畫處理,如下面的示例所示。

如何設(shè)計手勢驅(qū)動的用戶界面

根據(jù)動畫的使用,有三種流行的技術(shù)來幫助教育用戶。第一個是提示動作。提示動作,或動畫視覺提示,顯示了在執(zhí)行動作時如何與元素交互的預覽。它的目的是在手勢和觸發(fā)動作之間建立關(guān)聯(lián)。例如,布丁怪物的游戲機制完全是基于手勢,但他們允許用戶知道該怎么做,而不必猜測。動畫傳達functionality-a情景信息展示與動畫,它立即變得清晰,用戶要做什么。

第三個和最后的技術(shù),我想提及的是啟示。你可以給你的UI高啟示點用戶功能界面中的一些元素,并利用反彈或脈沖作為一個可用的姿態(tài)指示器。這種技術(shù)的一個例子可以在蘋果iOS中找到。當用戶輕敲相機圖標時,鎖定屏幕會反彈,露出攝像機應用程序。

如何設(shè)計手勢驅(qū)動的用戶界面

結(jié)論

雖然觸摸手勢在我們身上幾乎看不見,但是有很多設(shè)計技巧可以讓用戶看到可能發(fā)生的事情。只是在時間的提示,動畫的線索和內(nèi)容逗是一些隱藏的姿態(tài)可以的方式
拼音 雙語對照

分享名稱:如何設(shè)計手勢驅(qū)動的用戶界面
網(wǎng)頁地址:http://www.muchs.cn/news/20403.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供微信小程序、營銷型網(wǎng)站建設(shè)、做網(wǎng)站、外貿(mào)網(wǎng)站建設(shè)、小程序開發(fā)、品牌網(wǎng)站制作

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)

手機網(wǎng)站建設(shè)