理解iPhone和iPad觸摸式交互

2011-10-20    藍(lán)藍(lán)設(shè)計(jì)的小編

轉(zhuǎn)載藍(lán)藍(lán)設(shè)計(jì)(     sillybuy.com    )是一家專注而深入的設(shè)計(jì)機(jī)構(gòu) ,為期望卓越的國(guó)內(nèi)外企業(yè)提供有效的     BS界面設(shè)計(jì)    、     cs界面設(shè)計(jì)        ipad界面設(shè)計(jì)    、    包裝設(shè)計(jì)    、     圖標(biāo)定制        用戶體驗(yàn)    、交互設(shè)計(jì)、     網(wǎng)站建設(shè)    、平面設(shè)計(jì)服務(wù)  

理解iPhone和iPad觸摸式交互

iPhone和iPad都使用支持多點(diǎn)觸摸的電容式觸摸屏。用戶借助手指的輕擊來訪問設(shè)備。這種方式與鼠標(biāo)截然不同。

或許應(yīng)該重點(diǎn)說明:手指并不是鼠標(biāo)。一般來說,手指比傳統(tǒng)定點(diǎn)設(shè)備更大,性也更低。這排除了對(duì)選擇要求較高的某些傳統(tǒng)類型的UI。舉例來說,iPhone和iPad上沒有滾動(dòng)欄。用"粗大的手指"選擇滾動(dòng)欄要么非常困難,要么需要一個(gè)占用大量iPhone珍貴屏幕可用空間的大滾動(dòng)欄。針對(duì)此問題,蘋果公司的解決方法是讓用戶在任何位置輕擊,然后通過向特定方向"輕滑"來完成滾動(dòng)操作。

觸摸屏的另一個(gè)有趣的元素就是:手指不止一個(gè)。還記得iPhone和iPad的觸摸屏是多點(diǎn)觸摸的吧。這允許用戶使用多個(gè)手指的"手勢(shì)"來操作設(shè)備。"掐捏式"縮放就是一個(gè)例子。用兩個(gè)手指觸擊頁(yè)面,然后分開它們來放大頁(yè)面,或收攏它們來縮小頁(yè)面。

最后一點(diǎn),手指不是持續(xù)的。鼠標(biāo)光標(biāo)始終位于屏幕上,但手指并非如此,它可以隨意輕擊多個(gè)位置,而其間不用進(jìn)行移動(dòng)。你將看到,對(duì)于依賴鼠標(biāo)光標(biāo)在屏幕上移動(dòng)的一些傳統(tǒng)Web技巧,這可能會(huì)引發(fā)一些問題。它還提供了一些在SDK程序中經(jīng)??梢姷南拗啤Ee例來說,它沒有剪切和粘貼的標(biāo)準(zhǔn),而這是過去生產(chǎn)的計(jì)算機(jī)所具備的非常普及的特性。

除了對(duì)現(xiàn)有界面的一些更改,輸入界面還引入了許多新的觸摸(單手指輸入)和手勢(shì)(兩手指輸入),如表1-4所示。

表1-4 iPhone和iPad的觸摸和手勢(shì)允許開發(fā)者以新的方式接受用戶輸入

輸入

類型

概述

氣泡( Bubble

觸摸

觸摸并按住不動(dòng)。在可單

擊元素上彈出信息氣泡

輕滑( Flick

觸摸

觸摸并滑動(dòng)。滾動(dòng)頁(yè)面

輕滑,兩個(gè)手指

手勢(shì)

使用兩個(gè)手指觸摸并滑動(dòng)。

滾動(dòng)可滾動(dòng)元素

掐捏

手勢(shì)

移動(dòng)兩個(gè)手指??s小或放大

輕擊

觸摸

單擊。選擇

輕擊,兩次

觸摸

雙擊。放大列

使用SDK進(jìn)行設(shè)計(jì)時(shí),不用擔(dān)心手指鼠標(biāo)操作的許多細(xì)微差異。一些標(biāo)準(zhǔn)控件針對(duì)手指使用進(jìn)行了優(yōu)化,并且你只能訪問iPhone或iPad實(shí)際支持的事件。第6章闡述了如何使用SDK中的觸摸、事件和動(dòng)作。雖然許多事情都不用你擔(dān)心,但作為SDK開發(fā)者,你仍然需要變換方式來考慮輸入,以更好地支持新設(shè)備。

日歷

鏈接

個(gè)人資料

存檔