

版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進行舉報或認領(lǐng)
文檔簡介
1、第8章 移動界面設(shè)計,山東大學(xué)計算機學(xué)院,主要內(nèi)容提要,移動設(shè)備及交互方式移動界面的設(shè)計原則移動界面要素設(shè)計移動界面設(shè)計技術(shù)與工具移動界面的設(shè)計實例,山東大學(xué)計算機學(xué)院,2,8.1.1移動設(shè)備,介于PDA和筆記本電腦之間的移動互聯(lián)網(wǎng)設(shè)備MID(Mobile Internet Device)超移動個人電腦UMPC(Ultra-Mobile PC)如OQO(圖a)、FlipStart MiniPC(圖b),諾基亞公司推出的采用L
2、inux操作系統(tǒng)的N810移動終端(圖c)與蘋果公司所推出的高端智能手機iPhone(圖d)等。,山東大學(xué)計算機學(xué)院,3,移動平臺應(yīng)用現(xiàn)狀,尼爾森預(yù)測:在美國市場,智能手機將在 2011年 超越普通手機,,世界,,中國,,Google CEO 施密特:未來的移動生態(tài)系統(tǒng)將由3股強大的趨勢匯合:運算能力、連接、云計算,手機將是這一大趨勢的終極設(shè)備“Google的工程師正優(yōu)先為移動考慮,移動應(yīng)用是更好的應(yīng)用,也是頂級工程師最樂意做的,它更
3、加具體、人性化,擁有更強的地理感知能力,這種挑戰(zhàn)讓工程師很興奮?!薄盎ヂ?lián)網(wǎng)的影響極大,關(guān)于出版和微博客的革命影響我們生活的方方面面,今天的年輕一代不再把手里拿著的叫移動電話,而叫手機,這對我們每個人都是個好消息?!靶吕宋⒉?5%內(nèi)容來自手機,Android飛躍發(fā)展,Android 一天新增20萬用戶(5月時一天10萬,6月時一天16萬)施密特說:“Android不只是驚人,是難以置信的驚人?!盇ndroid侵吞Nokia、RI
4、M智能市場份額,,,比較下美國和中國的智能手機市場份額,美國的今天會是中國的未來?美國:RIM、Apple、HTC中國:Nokia、Motorola、Samsung,,相比于PC,Mobile帶來的想象空間更大Micro strategy,新型移動設(shè)備的感知設(shè)計,1.多點觸控iOS及Android系統(tǒng)2.0以上版本可多點觸控2.地理定位GPS:定位到10m精度,耗時2-10分鐘,戶外使用,耗電大Wifi:定位到
5、50m精度,耗時、耗電忽略不計基站:定位到100-2500m精度,耗時耗電忽略不計3.運動方向通過手機內(nèi)置的加速器偵測4.手持定向通過手機內(nèi)置的數(shù)字羅盤實現(xiàn),智能手機可識別用戶是橫向,還是豎向握機,從而自動調(diào)整頁面,,5.語音輸入輸入到手機,輸出到用戶,Google Voice可識別用戶發(fā)出的聲音,進行搜索,解決了手機輸入不便的難題6.視頻/圖片利用照相機捕捉或輸入圖片,新浪微博的手機客戶端已經(jīng)實現(xiàn)拍照上傳功能7.實時
6、通知應(yīng)用程序可實時通知到用戶,如手機報發(fā)送過到手機時的提醒8.設(shè)備連接通過藍牙連接兩個設(shè)備,,9.靠近識別手機靠近其他物體,比如可實現(xiàn)刷卡購物10.環(huán)境識別感知周圍環(huán)境光線的強弱11.電子標簽 (Apple專利)通過射頻信號自動識別目標對象并獲取相關(guān)數(shù)據(jù),圖書館借書、超市購物、物流管理時都可以見到12.觸覺反饋 (Apple專利)手機屏幕各個部分提供不同的觸覺,可以用來為盲人做設(shè)計,比如為音樂播放器設(shè)計時,可以把“播
7、放”按鈕做出凸出的觸覺,,13.生理識別 (Apple專利)視網(wǎng)膜、指紋識別,可以通過指紋實現(xiàn)鎖定手機14.陀螺儀( iPhone4)360度運動感知,iPhone 4已經(jīng)實現(xiàn),對游戲愛好者是個好消息15.雙面攝像( iPhone4)感知用戶持手機的正面還是反面,自動啟用背面或前置攝像頭,8.1.2 連接方式,移動互聯(lián)網(wǎng)的數(shù)據(jù)接入方式無線局域網(wǎng)(WLAN)IEEE制訂的IEEE 802.11無線局域網(wǎng)標準(稱為“
8、Wi-Fi”) 歐洲電信標準協(xié)會 制訂的HiperLAN無線城域網(wǎng)(WMAN)較大的地理區(qū)域內(nèi)無須布線IEEE 制訂的IEEE 802.16和IEEE 802.16a(又稱為WiMAX),山東大學(xué)計算機學(xué)院,17,,無線個域網(wǎng)(WPAN)工作于超短距離的個人操作環(huán)境中,特點是需要相互通訊的設(shè)備可以按需建網(wǎng),并具有動態(tài)拓撲的特點,以適應(yīng)網(wǎng)絡(luò)節(jié)點的移動性?!八{牙”(Bluetooth)技術(shù)高速無線廣域網(wǎng)(WWAN)
9、第三代移動通信系統(tǒng),即3G(3rd Generation)系統(tǒng)的目標是采用數(shù)字技術(shù)實現(xiàn)語音、數(shù)據(jù)以及多媒體信息的高速傳輸目前主要的3G標準包括歐洲的WCDMA、美國的CDMA 2000、中國開發(fā)的時分同步的碼分多址技術(shù)。衛(wèi)星通訊用于多信道廣播、遠程數(shù)據(jù)傳送以及地面多媒體通信系統(tǒng)的接入手段,8.1.3 交互方式,輸入方式鍵盤輸入手機鍵盤的設(shè)計主要還是從手機的主要功能即語音通信考慮的。由于每一個按鍵都是復(fù)用的,如數(shù)字鍵“7”和字母
10、“P”、“Q”、“R”、“S”共用一個按鍵。 T9輸入法就是目前最為著名的一種解決方案。使用T9輸入法的優(yōu)越之處在于輸入一個字以后,會提示一些可以合法組合的常見字,用戶只需要簡單地選擇即可輸入,大大降低了手機文字輸入的疲勞程度,提高了批量文字信息的輸入效率。T9比軟鍵盤輸入法的效率高,輸入方式筆輸入手寫文字識別是一種文本的輸入方式,作為鍵盤輸入的一種替代方式。隨著筆輸入技術(shù)的日益成熟,目前筆輸入技術(shù)的在包括平板電腦(Table
11、t PC)、智能手機、掌上電腦等多種移動設(shè)備中的得到了廣泛應(yīng)用。近年來微軟公司力推Tablet PC,也在一定程度上對于筆輸入的普及起了推波助瀾的作用。 筆輸入是目前掌上電腦最主要的一種輸入方式。特別在中國,由于漢字書寫的復(fù)雜性,手寫筆輸入成為最自然、符合中國人書寫習(xí)慣的輸入方式。,山東大學(xué)計算機學(xué)院,20,,,輸入方式多點觸控“Mulit-Tuch”實際基于紅外捕捉技術(shù),利用特殊紅外燈在桌體內(nèi)部形成均勻紅光照射,再利用多個高效
12、紅外捕捉攝像機,搭建其一個抗干擾的紅外捕捉系統(tǒng),當(dāng)用戶通過手或激光筆觸控桌面時,紅外捕捉系統(tǒng)能迅速捕捉,交由定制的紅外捕捉處理程序處理。從而完成不同手勢的響應(yīng)。,從2008年到2010年,諾基亞手機采用的普通鍵盤的份額逐年遞減,全鍵盤和觸摸屏則逐年增加,到2010年,觸摸屏已占據(jù)主流,基本手勢,,單擊:手指輕擊屏幕后離開,雙擊:手指快速單擊屏幕兩下,拖拽:在屏幕上移動指尖一段距離,期間保持接觸,輕彈:指尖快速劃過屏幕,捏:兩個手指放在屏
13、幕上,中間隔開小段距離,之后靠攏到一起,像捏東西一樣,展開:兩個手指放在屏幕上,先靠在一起,然后劃開,按壓:手指按住屏幕,持續(xù)較長的一段時間,按壓并單擊:一個手指按壓,另一個手指同時單擊,按壓并拖拽:一個手指按壓,另一個手指同時拖拽,旋轉(zhuǎn):兩個手指接觸屏幕,之后順時針或逆時針旋轉(zhuǎn),觸摸手勢—用戶操作,基礎(chǔ)操作切換模式:按壓,例:手機解鎖打開:雙擊,例:打開UC瀏覽器、手機QQ等選擇:單擊,例:比如接電話時單擊綠色小電話圖標即可,觸
14、摸手勢—用戶操作,目標導(dǎo)向的操作調(diào)整:按壓并拖拽刪除:拖拽,將目標拖向垃圾箱或屏幕外復(fù)制:單擊要復(fù)制的目標,然后單擊你想復(fù)制到的其他地方,將該目標復(fù)制移動:拖拽目標,移動到某處后松手,可使用單手指或多手指輕彈某目標,讓其劃動到某區(qū)域按壓并單擊:一個手指放在目標上,另一個手指單擊屏幕其他地方,將目標移動到該處旋轉(zhuǎn):兩個手指按住屏幕,然后順時針或逆時針旋轉(zhuǎn),觸摸手勢—用戶操作,目標導(dǎo)向的操作縮放:捏,兩個手指捏到一起可實現(xiàn)縮
15、放功能,也可同時使用5根手指捏到一起放大:展開,兩個手指先捏在一起,之后反方向彈開,實現(xiàn)放大功能,也可以同時使用5根手指展開調(diào)整視角:旋轉(zhuǎn)調(diào)整視野(縮?。耗螅蛘唠p擊目標調(diào)整視野(放大):展開,或者雙擊目標,一般視野最大化后再次雙擊,可縮小視野;顯示(隱藏的)功能:單擊,比如手機QQ好友分組,單擊即打開,觸摸手勢—用戶操作,目標導(dǎo)向的操作按壓并單擊雙擊單擊屏幕特殊角落列表間移動:比如歌曲列表里移動,想聽下一首歌時兩
16、個手指拖拽,或者旋轉(zhuǎn),觸摸手勢—用戶操作,導(dǎo)航搖動:用整個手掌拖拽 滾動:拖拽滾動條,可顯示更多條目兩個手指拖拽 按壓:你有按壓實現(xiàn)滾動的例子么?快速滾動:輕彈,這個用的比較多,比如翻看手機中的照片時單擊,滾動正在進行中時單擊屏幕,可實現(xiàn)快速滾動拖拽:拖拽滾動條實現(xiàn)快速滾動,觸摸手勢—用戶操作,畫圖操作接受:用手指畫一個對號剪切:用手指畫一個斜杠尋找?guī)椭河檬种府嬕粋€問號拒絕:用手指畫一個“X”取消:用手指劃掉某
17、區(qū)域,輸入方式語音識別 語音識別技術(shù)的研究工作始于20世紀50年代目前這個領(lǐng)域最具代表性的產(chǎn)品是IBM公司的Viavoice和DRAGON公司的Naturally Speaking??梢酝ㄟ^將掌上設(shè)備作為語音門戶網(wǎng)站(Voice Portal)的訪問終端。在這種環(huán)境中,用戶可以在辦公室、家里或旅行途中隨時隨地通過手機等具有語音通信功能的移動設(shè)備與具備語音識別與合成技術(shù)的語音門戶網(wǎng)站進行對話語音識別技術(shù)還可以用于人機界面的語音命
18、令導(dǎo)航,使得用戶可以直接用語音發(fā)出各種操作指令,山東大學(xué)計算機學(xué)院,31,,輸出方式顯示技術(shù) 顯示屏的關(guān)鍵因素:分辨率、色彩、尺寸、功耗及顯示響應(yīng)速度。 多種顯示器:超扭曲陣列(Super-Twisted Nematic STN)、DSTN(Dual STN)、CSTN(Color STN)、薄膜式晶體管(Thin Film Transistor,TFT)以及薄膜二極管(Thin Film Diode,TFD)等。 單色STN液
19、晶屏:用簡單的無源矩陣尋址方案,具有性能可靠、成本低、功耗也極低的特點一些新的顯示技術(shù):有機發(fā)光二極管和硅基液晶。,山東大學(xué)計算機學(xué)院,32,,輸出方式聲音輸出手機與PDA等掌上設(shè)備的聲音輸出功能一般較弱。近年來,逐漸通過引入聲音合成技術(shù),使得其可以播放較為動聽的MIDI(Musical Instrument Digital Interface)電子音樂。移動設(shè)備的音樂合成技術(shù)主要包括兩種:調(diào)頻(Frequency M
20、odulation,F(xiàn)M)合成與波表(Wave Table)合成。 復(fù)音就是俗稱的“和弦”,指的是音樂合成系統(tǒng)中能夠同時發(fā)出的聲音的數(shù)目,而并非音樂理論中的和弦。,山東大學(xué)計算機學(xué)院,33,,移動界面設(shè)計的新問題,資源相對匱乏 高檔手機的顯示分辨率也不過320×240,而且尺寸很小,無法展示網(wǎng)站豐富的多媒體內(nèi)容。 移動界面并非簡單的縮小版的桌面系統(tǒng)的用戶界面。桌面系統(tǒng)用戶界面中采用的一般是并行展示其中各種選擇可以在一個
21、大小可調(diào)的屏幕中同時顯示出來,移動界面中,這些選擇只能采用順序展示的方式 移動界面設(shè)計的難題就是如何在有限的資源條件下有效地為用戶提供信息服務(wù),提供的選擇須根據(jù)重要性排列,山東大學(xué)計算機學(xué)院,34,移動界面設(shè)計的新問題,移動設(shè)備的種類繁多 在開發(fā)移動應(yīng)用時需要專門針對某一型號的一種設(shè)備開發(fā),大大增加了應(yīng)用開發(fā)的復(fù)雜度;在移動界面的設(shè)計中,各設(shè)備的差異是移動應(yīng)用開發(fā)過程中最需要關(guān)注的一個環(huán)節(jié);移動界面具有一定的自適應(yīng)性是解決問題
22、的一種思路,山東大學(xué)計算機學(xué)院,35,移動界面設(shè)計的新問題,連接方式復(fù)雜移動互聯(lián)網(wǎng)的數(shù)據(jù)接入方式形式繁雜,多種標準并存,并在較長的一段時間內(nèi)也很難完全統(tǒng)一。而移動設(shè)備的位置具有很強的移動性,同一設(shè)備可能在不同的時間段處于不同的網(wǎng)絡(luò)連接條件下,網(wǎng)絡(luò)的性能變化范圍可能很大,移動的同時往往需要保持應(yīng)用執(zhí)行的連續(xù)性。應(yīng)將網(wǎng)絡(luò)連接狀況視為一種資源,在設(shè)計時制訂相應(yīng)的策略。,山東大學(xué)計算機學(xué)院,36,移動界面設(shè)計的新問題,移動界面設(shè)計中的最
23、大問題就是界面的定制無論是移動設(shè)備各種資源的匱乏、種類與連接方式的繁復(fù),最終均可以歸結(jié)為根據(jù)需要定制合適的移動應(yīng)用界面。,山東大學(xué)計算機學(xué)院,37,8.2 移動界面的設(shè)計原則,簡單直觀個性化設(shè)計易于檢索界面風(fēng)格一致避免不必要的文本輸入根據(jù)用戶的要求使服務(wù)個性化最大限度地避免用戶出錯文本信息應(yīng)當(dāng)本地化,山東大學(xué)計算機學(xué)院,38,限制往往能帶來創(chuàng)新,確定核心需求當(dāng)你在320*480(iPhone、Palm pre、第1代A
24、ndroid)的分辨率下,意味著你要拋棄原有web頁面80%的內(nèi)容、導(dǎo)航、交互等。這樣做減法很過癮,你必須保證屏幕上的信息對用戶是最重要的。老板想來加點東西?那你可以理直氣壯地說,對不起,沒空間了,我想我們得做更重要的事。,,美國西南航空公司的web站和對應(yīng)的iPhone app比較iPhone app簡潔專注于客戶需求:機票預(yù)訂、登機手續(xù)、查詢航班狀態(tài)、查詢里程等,再沒有其他的多余內(nèi)容。,,瀏覽器也一樣,iPhone和Androi
25、d簡潔比較,Apple的iPhone系統(tǒng)只有一個進入App的界面,每個圖標占據(jù)57*57像素的空間,通過單擊啟動。App啟動之后,界面充滿整個屏幕空間,用戶可以和程序交互。想關(guān)閉某個正在運行的程序,你只需要按下home鍵,程序就自動退出,所有應(yīng)用程序都是如此。,,每個從蘋果商店新添加到iPhone的程序,將被排列到所有程序界面的最后,并顯示為loading,提示用戶程序安裝的狀態(tài)。,,Google的Android系統(tǒng)則為應(yīng)用程序提供了
26、幾個界面入口,App圖標可以被放置到幾個不同的桌面屏幕上,一些應(yīng)用程序也可以用widget的形式展示,見下圖的天氣和時間。你也可以點擊“開始”菜單,進入所有應(yīng)用程序的界面(舉例來自HTC Sense for Android,,當(dāng)你從Android Market下載一個新應(yīng)用,它被悄悄地放置在“開始”菜單的所有程序里,沒有任何安裝成功的提示。接下來你還要決定是否要把它從“開始”菜單里放到桌面,以方便日常使用,同時你還可以決定應(yīng)用程序是
27、顯示為圖標,還是widget,當(dāng)然并非所有App都有widget。擁有widget的程序,占用的屏幕空間也不一樣,只有你把它添加到桌面,設(shè)置成widget模式之后,才能看出它占多大空間,見左圖的Facebook widget和右圖的Music widget。,,一些應(yīng)用程序的widget擁有不同的尺寸供用戶選擇,一些則只有一個尺寸,或者沒有widget,只有一個圖標,Twitter就有下圖這樣兩種尺寸。,,Android平臺應(yīng)用程序
28、可以用圖標、或者不同尺寸的widget顯示在桌面和“開始”菜單里,不管是哪種形式,它們都能在后臺運行,不需要占據(jù)整個屏幕,這滿足了用戶的個性化定制需求。iPhone平臺每個程序都以同樣的方式啟動、運行、關(guān)閉,很好地保持了設(shè)計的一致性,給予用戶清晰可控的感覺。不過這是以犧牲桌面?zhèn)€性化和多任務(wù)等性能為代價(iPhone4添加了有限的多任務(wù))。,,2010年5月下載應(yīng)用程序數(shù)量統(tǒng)計表,8.3移動界面設(shè)計要素,移動界面也包含很多種類的設(shè)計
29、要素,主要界面設(shè)計元素有:菜單 按鈕 多選列表 文字顯示 數(shù)據(jù)輸入 圖標與圖像 報警提示 移動多媒體,山東大學(xué)計算機學(xué)院,50,移動界面設(shè)計要素,菜單主要目的用于提供項目選擇 設(shè)計移動界面可用性好的菜單應(yīng)遵守的規(guī)則 供選擇的項目應(yīng)根據(jù)需要進行邏輯分類,如果沒有邏輯順序,可以按優(yōu)先級分類,將被選擇頻率最高的項目放在列表的最頂端。 每一屏中不宜設(shè)計過多的選項,如果一個菜單上的選擇項目太多,應(yīng)該建立一個“更多”鏈接,將
30、菜單擴展到多個屏幕。 菜單上的每一選項一般應(yīng)當(dāng)簡明扼要,不宜超過一行,山東大學(xué)計算機學(xué)院,51,,山東大學(xué)計算機學(xué)院,52,,,菜單模擬顯示畫面,,移動界面設(shè)計要素,按鈕一般移動界面中的按鈕不經(jīng)常使用圖標 在按鈕屬性的設(shè)置上根據(jù)所顯示的應(yīng)用類型和信息類型,使用風(fēng)格和標注一致的標簽。漢字標簽則一般需要注意字數(shù)的控制 。常見的通用按鈕:OK(確定):可用于菜單項的選擇或表示對某一操作的認可,如確認刪除。Done(完成):可用于
31、結(jié)束當(dāng)前操作,并返回到上一層任務(wù)。Back(返回):使用戶回到前一個操作屏幕。,山東大學(xué)計算機學(xué)院,53,移動界面設(shè)計要素,“尋找航班”是根據(jù)特定的應(yīng)用需要設(shè)定的按鈕,山東大學(xué)計算機學(xué)院,54,,按鈕模擬顯示畫面,移動界面設(shè)計要素,多選列表 在移動應(yīng)用中使用多選列表,可以最大限度地減少文本輸入,山東大學(xué)計算機學(xué)院,55,,多選列表模擬顯示畫面,移動界面設(shè)計要素,文字顯示 文字顯示控件主要用于顯示較多數(shù)量的文字信息根據(jù)顯示的需要,
32、可能使用以下幾種形式的鏈接: View(查看):如果一個數(shù)據(jù)列表中每個項目包含額外的詳細信息,可以使用該鏈接來顯示這些數(shù)據(jù)。 More(更多):一般作為數(shù)據(jù)頁末尾的一個鏈接,使用戶進入下一頁的相關(guān)數(shù)據(jù)。 Skip(跳過):跳過當(dāng)前選項,鏈接到下一個類似的數(shù)據(jù),如下一封電子郵件信息。,山東大學(xué)計算機學(xué)院,56,移動界面設(shè)計要素,文字顯示的一般可用性建議:每一屏幕顯示內(nèi)容不宜過多,如果信息較多,應(yīng)定義一個More鏈接。 一般情況下
33、文字信息應(yīng)當(dāng)使用換行方式進行顯示。,山東大學(xué)計算機學(xué)院,57,移動界面設(shè)計要素,,山東大學(xué)計算機學(xué)院,58,,,文字顯示模擬顯示畫面,移動界面設(shè)計要素,數(shù)據(jù)輸入:針對數(shù)據(jù)輸入的可用性原則包括: 對于數(shù)據(jù)輸入一般應(yīng)該進行長度、數(shù)據(jù)類型以及取值范圍等形式的格式化,以指導(dǎo)用戶輸入合法的可用信息。 建立數(shù)據(jù)輸入標題,并根據(jù)需要在標題中加入所要求的輸入格式。 如果已經(jīng)可以確定數(shù)據(jù)的某些輸入部分,可以預(yù)先填好,且不允許用戶修改。 應(yīng)當(dāng)具有檢
34、錯機制,如某些信息必須填寫,應(yīng)當(dāng)可以設(shè)置成禁止提交空數(shù)據(jù)。 在格式設(shè)置中適當(dāng)?shù)靥砑臃指舴蕴崾居脩糨斎牒戏ǖ男畔ⅰ?山東大學(xué)計算機學(xué)院,59,移動界面設(shè)計要素,,山東大學(xué)計算機學(xué)院,60,,格式化模擬顯示畫面,移動界面設(shè)計要素,圖標與圖像 圖像、圖標可以增強顯示信息的效果在移動設(shè)備上使用圖像,需要注意的問題包括: 了解目標設(shè)備所支持的圖象格式 注意調(diào)色板的設(shè)置使其達到最佳顯示效果 對于不支持圖像的設(shè)備,應(yīng)當(dāng)提供替換的信息展示
35、方式 進行圖像瀏覽時,圖像缺省地應(yīng)當(dāng)充滿整個可用區(qū)域,如必須滾屏?xí)r,盡量使用垂直滾屏。 盡量使用戶在上下文中直接瀏覽嵌入的圖像,而不必使用獨立的顯示工具。,山東大學(xué)計算機學(xué)院,61,移動界面設(shè)計要素,,山東大學(xué)計算機學(xué)院,62,,圖像模擬顯示畫面,移動界面設(shè)計要素,報警提示 警報提示,可以將用戶所關(guān)心的最新信息通知給用戶,或向用戶提供有關(guān)當(dāng)前狀況的信息。一般使用文字信息,可能加入一定的圖標。常用的提示類型有: 確認提示信息
36、提示 警告提示 出錯提示 持久性提示 等待提示,山東大學(xué)計算機學(xué)院,63,移動界面設(shè)計要素,移動多媒體技術(shù) 目前移動設(shè)備的多媒體支持進步很大,已經(jīng)可以播放幾種類型的音頻和視頻文件,還可以使用內(nèi)置或外接的攝像頭來抓取圖像。移動應(yīng)用開發(fā)平臺開始提供支持多媒體數(shù)據(jù)的編程接口。,山東大學(xué)計算機學(xué)院,64,移動界面設(shè)計要素,制作能夠在移動設(shè)備進行播放的多媒體音頻或視頻文件,應(yīng)注意以下問題: 盡量使用標準的文件格式根據(jù)平臺的計算能力
37、特點,選擇合適的格式 不必一味追求動態(tài)視頻,有的應(yīng)用場合下靜態(tài)圖像也可以達到很好的展示效果; 根據(jù)平臺的多媒體回放能力制作相應(yīng)質(zhì)量的多媒體數(shù)據(jù)。 視頻內(nèi)容應(yīng)該精練,沒有必要包含太多的特技效果。 如果在應(yīng)用中使用音頻增強效果,音頻的使用與否應(yīng)當(dāng)不改變程序的運行結(jié)果; 錄制音頻時應(yīng)當(dāng)盡可能的提高音量,以保證回放時的效果,山東大學(xué)計算機學(xué)院,65,移動界面設(shè)計要素,移動界面導(dǎo)航確定移動界面導(dǎo)航一般應(yīng)該在應(yīng)用設(shè)計完成后,建立導(dǎo)航流程
38、圖表,規(guī)劃移動應(yīng)用的導(dǎo)航流程。導(dǎo)航設(shè)計的基礎(chǔ)是按傳統(tǒng)的樹結(jié)構(gòu)編排的層次狀態(tài)結(jié)構(gòu)。,,,在這種層次狀態(tài)結(jié)構(gòu)中,每一節(jié)點代表一個狀態(tài),具體體現(xiàn)在移動界面開發(fā)中,往往是一個新的顯示畫面。在層次狀態(tài)結(jié)構(gòu)中,用戶點擊按鍵打開一個可選項,或從菜單中選中一項,就實現(xiàn)了狀態(tài)轉(zhuǎn)換的過程,而返回功能(手機應(yīng)用中常用右功能鍵實現(xiàn)返回功能)一般返回到層次樹的上一級。而在應(yīng)用的初始狀態(tài)下(如圖8-6中的狀態(tài)1),返回功能的實現(xiàn)就變成了退出功能,將會關(guān)閉該應(yīng)用。,
39、移動界面設(shè)計要素,移動界面導(dǎo)航加入標簽導(dǎo)航的層次狀態(tài)結(jié)構(gòu)如果內(nèi)容相關(guān)的幾頁信息無法在單屏或單個列表顯示時,通過標簽可以將其合并稱為一個單一狀態(tài)。用戶可以通過左右移動鍵來切換這些標簽。,,采用了標簽進行導(dǎo)航的視圖一般應(yīng)當(dāng)遵循以下原則:從一個標簽視圖轉(zhuǎn)到另一個并不影響這些視圖中的返回鍵功能;它們中的任何一個返回功能指向同一個地方,即該應(yīng)用的上一層。如在上例中,這兩個標簽視圖之間并沒有返回功能; 如果從這兩個中的任何一個返回都將退回到狀
40、態(tài)1。 當(dāng)某個狀態(tài)擁有標簽視圖時,如果用戶從上一層進入到該狀態(tài),打開的將是默認視圖。 如果用戶從某個標簽視圖進入到其下面一層,這時的返回功能將導(dǎo)致返回到原先的視圖(不一定是上面提到的默認視圖)。,移動界面設(shè)計要素,移動界面導(dǎo)航有同層次之間相互訪問的導(dǎo)航種關(guān)系使得這種層次狀態(tài)結(jié)構(gòu)不再是嚴格的樹形結(jié)構(gòu),而變成了一種圖結(jié)構(gòu)。,一個手機游戲的導(dǎo)航流程圖表,山東大學(xué)計算機學(xué)院,71,圖 9-9 示例導(dǎo)航流程圖表,8.4移動界面實現(xiàn),開發(fā)移
41、動應(yīng)用考慮各種復(fù)雜的網(wǎng)絡(luò)連接方式,考慮各種不同的硬件設(shè)備甚至不同型號的設(shè)備之間的差異,與現(xiàn)有的應(yīng)用體系盡可能的集成,因此選擇適當(dāng)?shù)拈_發(fā)平臺也很重要。對各種不同的移動應(yīng)用開發(fā)體系結(jié)構(gòu)、移動設(shè)備操作系統(tǒng)和移動應(yīng)用標準等等,需要在綜合考慮多種因素。,山東大學(xué)計算機學(xué)院,72,8.4.1移動應(yīng)用開發(fā)技術(shù)架構(gòu),.Net 精簡框架 屬于微軟的.net架構(gòu)中的一部分,是專用于移動設(shè)備的開發(fā)工作的精簡版的.Net 開發(fā)框架;包括部分.NET
42、 架構(gòu)類庫和部分獨有的類庫;.net精簡框架同樣包含一個受控的運行時環(huán)境,能使用多種自己熟悉的語言如C++、Basic、C#等語言;目前僅能運行于微軟的Windows系列操作系統(tǒng)。,山東大學(xué)計算機學(xué)院,73,移動應(yīng)用開發(fā)技術(shù)架構(gòu),J2ME架構(gòu)Sun的J2ME(Java 2 Micro Edition)是專門針對移動設(shè)備和其他資源受限的設(shè)備專門設(shè)計的Java版本,專門針對屏幕、電能和內(nèi)存等受限資源進行了優(yōu)化。 采用J2ME技術(shù)開發(fā)
43、的移動應(yīng)用,可以通過無線下載或數(shù)據(jù)線傳輸?shù)确绞皆谝苿釉O(shè)備中進行安裝。 J2ME技術(shù)的細分主要由配置(Configuration)、概要(Profile)兩個概念來控制。,山東大學(xué)計算機學(xué)院,74,移動應(yīng)用開發(fā)技術(shù)架構(gòu),J2ME架構(gòu)配置就是不同的規(guī)范,規(guī)定了相應(yīng)的設(shè)備至少需要達到的運算能力、供電能力以及存儲容量的大小等要求,同時也定義與設(shè)備無關(guān)的Java虛擬機和核心類庫,提供了基本的語言特性 概要在一種配置的基礎(chǔ)上進一步對設(shè)備類型進
44、行細分,提供針對設(shè)備特定功能的API和擴展類庫,能夠更好地適應(yīng)特定類別的設(shè)備,使其充分發(fā)揮設(shè)備的功能。 J2ME的最大優(yōu)勢是優(yōu)良的跨平臺特性,同一個應(yīng)用程序采用J2ME架構(gòu)可以在多種軟硬件平臺上使用。,山東大學(xué)計算機學(xué)院,75,移動應(yīng)用開發(fā)技術(shù)架構(gòu),,山東大學(xué)計算機學(xué)院,76,圖 9-16 J2ME架構(gòu),移動應(yīng)用開發(fā)技術(shù)架構(gòu),BREW BREW(Binary Runtime Environment for Wireless)是美國高
45、通公司(QUALCOMM)為無線應(yīng)用開發(fā)和執(zhí)行提供的一種平臺;能夠與可能駐留在設(shè)備中的其它應(yīng)用和軟件協(xié)調(diào)使用,適用于多種類型和層次的手機等無線設(shè)備;可以支持包括Java在內(nèi)的各種編程語言;可以支持J2ME架構(gòu)的CLDC/MIDP組合;開發(fā)人員還可以直接在BREW平臺上開發(fā)應(yīng)用程序,與J2ME程序相比,具有一定的速度優(yōu)勢。,山東大學(xué)計算機學(xué)院,77,8.4.2 移動設(shè)備操作系統(tǒng),Palm OS 微軟的系列移動操作系統(tǒng) 嵌入式L
46、INUX Symbian OS/EPOC OS 其他,山東大學(xué)計算機學(xué)院,78,移動設(shè)備操作系統(tǒng),Palm OSPalm OS是一套專門為掌上電腦編寫的操作系統(tǒng),充分考慮到了掌上電腦的資源受限等特點,本身所占的內(nèi)存很小,其上所編寫的應(yīng)用程序的內(nèi)存占用也很小,可以運行眾多的應(yīng)用程序。目前專門為Palm OS編寫的應(yīng)用程序非常豐富,也使得Palm 系統(tǒng)一直受到較多的關(guān)注; 第一部Palm系列的掌上電腦是1996推出的Palm Pi
47、lot 1000,使用Palm OS 1.0操作系統(tǒng),顯示屏幕為單色STN,160×160象素,2級灰度,處理器采用MOTOROLA Dragonball 16MHz,通過串口通訊,內(nèi)存128KB。,山東大學(xué)計算機學(xué)院,79,移動設(shè)備操作系統(tǒng),微軟的系列移動操作系統(tǒng) Windows公司最早推出的掌上設(shè)備的操作系統(tǒng)是Widnows CE;微軟公司在Windows Mobile的概念下,發(fā)展了Pocket PC和SmartPh
48、one兩大平臺體系,分別針對手持電腦和智能手機兩個領(lǐng)域。最大優(yōu)勢是圖形用戶界面功能強大,開發(fā)工具比較完善,使用者也容易入門,操作起來較為熟悉;同時提供了較強的多媒體功能,如視頻、音頻回放等;缺點是本身對內(nèi)存等資源的消耗較大,需要配置很高的移動設(shè)備加以支持,成本較高,較適合一些高端的企業(yè)應(yīng)用場合。,山東大學(xué)計算機學(xué)院,80,移動設(shè)備操作系統(tǒng),嵌入式LINUX 嵌入式Linux在開放源碼的LINUX系統(tǒng)之上發(fā)展而來,具備了Linux的
49、諸多優(yōu)點,如支持多任務(wù)等,也可以對應(yīng)用軟件提供良好的支持;由于開放源碼,也比較容易移植, 可擴展性和可移植性是該類系統(tǒng)的最大優(yōu)勢;目前支持嵌入式Linux的移動設(shè)備正在逐漸增多,但還遠未達到成熟的地步,仍然有很大的發(fā)展空間。,山東大學(xué)計算機學(xué)院,81,移動設(shè)備操作系統(tǒng),Symbian OS/EPOC OS EPOC OS是一種專門為掌上設(shè)備而設(shè)計的開放式操作系統(tǒng),特別是針對智能手機應(yīng)用。在其上發(fā)展起來的SymbianOS目前得到
50、了諾基亞等移動終端廠商的支持,功能日益完善,在智能手機領(lǐng)域占有較大的份額。Symbian OS的設(shè)計非常靈活,特別是其用戶界面框架可以支持眾多不同配置和輸入輸出手段的智能手機,是其最大的優(yōu)勢。,山東大學(xué)計算機學(xué)院,82,移動設(shè)備操作系統(tǒng),AndroidGoogle于2007年11月5日宣布的基于Linux平臺的開源手機操作系統(tǒng)的名稱,該平臺由操作系統(tǒng)、中間件、用戶界面和應(yīng)用軟件組成,號稱是首個為移動終端打造的真正開放和完整的移動軟件
51、。目前,最新版本為Android 2.4 Gingerbread和Android 3.0 Honeycomb。Android以Java為編程語言,從接口到功能,都有層出不窮的變化,其中Activity等同于J2ME的MIDlet,一個 Activity 類(class)負責(zé)創(chuàng)建視窗(window),一個活動中的Activity就是在 foreground(前景)模式,背景運行的程序叫做Service。,8.4.3 移動瀏覽標準,采用J
52、2ME等技術(shù)開發(fā)的應(yīng)用軟件需要運行程序的用戶終端上進行安裝和配置,同時也對終端的性能具有一定的要求---一般應(yīng)用程序。移動應(yīng)用的開發(fā)還有一種模式,就是采用類似于Web應(yīng)用的開發(fā),用戶端僅需支持一定的移動瀏覽標準協(xié)議,一般通過移動瀏覽器的方式,就可以通過網(wǎng)絡(luò)訪問移動應(yīng)用服務(wù)器,獲取信息或完成某些操作---web應(yīng)用程序,山東大學(xué)計算機學(xué)院,84,移動瀏覽標準,WAPWAP( Wireless Application Protocol)
53、是專門為移動系統(tǒng)設(shè)計的一種通信協(xié)議和應(yīng)用環(huán)境,由一個稱為“WAP論壇”的組織負責(zé)制訂,目前已推出了2.0標準,不過全面支持WAP2.0的設(shè)備還需要一定的時間才能得到普及。在WAP 2.0版本中增加了對IP、TCP和HTTP等標準協(xié)議的支持,而且在支持用戶向服務(wù)器端發(fā)出請求的PULL模式之外,還增加了PUSH模式,可以支持服務(wù)器端的應(yīng)用程序通過一個PUSH代理(Push Proxy)向客戶端發(fā)送信息,特別適合向用戶發(fā)送定制的新聞等。,山
54、東大學(xué)計算機學(xué)院,85,移動瀏覽標準,WMLWML專為移動設(shè)備設(shè)計,因而其開發(fā)也具有相應(yīng)的特點,開發(fā)WML應(yīng)用需要重新設(shè)計其內(nèi)容,特別是其用戶界面,需要考慮移動設(shè)備的屏幕大小以及計算能力進行特別的設(shè)計,因此需要專門的網(wǎng)站加以支持,如中國移動的移動夢網(wǎng)Wap網(wǎng)站。目前的問題是這種專門的網(wǎng)站相當(dāng)少,因為需要重新制作網(wǎng)站內(nèi)容,特別是大型網(wǎng)站的成本很高,通過采用中間件和服務(wù)器端生成技術(shù)對現(xiàn)有的HTML頁面內(nèi)容進行動態(tài)的轉(zhuǎn)換是一種有效的解決手
55、段。,山東大學(xué)計算機學(xué)院,86,移動瀏覽標準,XHTML Basic 與XHTML MP 2000 年12月,W3C發(fā)布了XHTML Basic 規(guī)范作為面向移動應(yīng)用的瀏覽頁面語言的推薦規(guī)范。在其上通過增加部分功能模塊設(shè)計的XHTML MP(XHTML Mobile Profile)目前得到了廣泛的支持。XHTML Basic和XHTML MP是在XHTML的基礎(chǔ)上發(fā)展起來的,而XHTML也將是目前的主流頁面語言HTML的換代技術(shù)
56、,因此基于XHTML MP開發(fā)的移動應(yīng)用具有良好的兼容性,前景廣闊。,山東大學(xué)計算機學(xué)院,87,8.4.4開發(fā)工具,很多開發(fā)工具特別是設(shè)備廠商提供的開發(fā)包和硬件密切相關(guān),使得互相之間的兼容性較差。 要有針對性地對各種可能運行的平臺進行測試,以便充分保證移動應(yīng)用的運行效果。,山東大學(xué)計算機學(xué)院,88,模擬器軟件,模擬器就是在一種平臺上采用軟件模擬另外的軟硬件環(huán)境:移動設(shè)備的模擬器主要由相應(yīng)的開發(fā)商推出。模擬器有幾種不同的形式:單純的
57、模擬界面,不同的設(shè)備的差別就在于采用了不同的貼圖,J2ME環(huán)境中的模擬器很多屬于此列。 硬件與軟件環(huán)境分別模擬,即使用模擬器引擎模擬硬件環(huán)境,然后再針對特定的設(shè)備使用專門的ROM實現(xiàn)軟件環(huán)境的模擬。Palm、Windows Mobile等模擬器屬于這一類。簡單的軟硬一體式的模擬工具,一般為每一款移動產(chǎn)品設(shè)計一種模擬器,應(yīng)用分為較窄,國內(nèi)文曲星的模擬器就是這種形式。,山東大學(xué)計算機學(xué)院,89,幾種不同形式的模擬器,,山東大學(xué)計算機學(xué)院
58、,90,,,,Openwave WAP SDK提供的模擬器,PALM模擬器,諾基亞的WAP模擬器,幾種不同形式的模擬器,,山東大學(xué)計算機學(xué)院,91,,,J2ME模擬器,幾種不同形式的模擬器,,android模擬器,8.4.5應(yīng)用實例分析,是一個航空旅行服務(wù)程序,采用WML編寫;提供查詢功能幫助用戶安排旅行計劃,特別是機票的購買或預(yù)訂;其設(shè)計使用了Openwave公司的WAP SDK中的移動瀏覽器(Mobile Browser)所提供
59、的多種用戶界面設(shè)計要素應(yīng)用中用到的times.wmls是WML Script腳本語言編寫的輔助程序,其作用是隨機地產(chǎn)生航班號和起飛時間等模擬數(shù)據(jù),需要自己根據(jù)程序中使用的情況編寫。,山東大學(xué)計算機學(xué)院,93,應(yīng)用實例分析,該應(yīng)用界面的設(shè)計過程包括以下步驟:明確用戶群 經(jīng)常旅行的用戶,一般旅行的目的是商務(wù)事宜,此類用戶對飛行時刻表、機場代號以及航班非常熟悉。不常旅行的用戶,一般旅行的目的是處于個人原因,可能幾周甚至幾個月可能會安排
60、一次旅行,這些用戶可能就不太熟悉具體的航線或航班代號等信息。,山東大學(xué)計算機學(xué)院,94,應(yīng)用實例分析,明確用戶需求確定用戶的主要操作是設(shè)計用戶界面導(dǎo)航流程并進行優(yōu)化的基礎(chǔ)。經(jīng)常旅行的用戶的主要操作包括了解航班情況(準時或延誤)、查找航班時刻以及預(yù)定機票等;不常旅行的用戶的主要操作包括查看某一特定航線的票價或查找特價機票信息等;第一次使用的用戶可能需要適當(dāng)?shù)膸椭崾尽?山東大學(xué)計算機學(xué)院,95,應(yīng)用實例分析,確定界面的設(shè)計目標經(jīng)
61、常旅行的用戶有一個常飛人員號碼,可以用于實現(xiàn)用戶使用界面的個性化,包括航班預(yù)訂情況的保存和修改等。對于不常旅行的用戶來說,重點是提供快速的目標航班、票價以及可能的特價機票信息,在設(shè)計中需要簡化這些內(nèi)容的訪問。,山東大學(xué)計算機學(xué)院,96,應(yīng)用實例分析,建立導(dǎo)航流程界面設(shè)計的實現(xiàn)需要導(dǎo)航流程的建立。應(yīng)當(dāng)允許經(jīng)常旅行的用戶用戶登錄后立刻能夠查看快速訪問航班的預(yù)訂和自己的旅行計劃信息,這一選項需要安排在菜單項的突出位置。對于不常旅行的用
62、戶來說,需要使其可以迅速查看和其個人喜好相關(guān)的機票優(yōu)惠等信息。從導(dǎo)航流程的設(shè)計來說,就是安排這些狀態(tài)的訪問路徑應(yīng)當(dāng)盡可能的短,使用戶可以在最短的時間內(nèi)獲得其最重要的信息。,山東大學(xué)計算機學(xué)院,97,應(yīng)用實例分析,可用性設(shè)計要點 界面中各種元素如菜單、標簽、文字輸入等的風(fēng)格樣式和操作方式在整個應(yīng)用中保持一致;使文字錄入的工作降到最低程度 ;預(yù)防用戶可能出現(xiàn)的各種錯誤操作,一旦用戶出錯,應(yīng)當(dāng)盡可能地給用戶修正錯誤的余地。,山東大學(xué)計
溫馨提示
- 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
- 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
- 5. 眾賞文庫僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負責(zé)。
- 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請與我們聯(lián)系,我們立即糾正。
- 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。
最新文檔
- 暑期社會實踐報告 - 山東大學(xué)課程中心30
- 材料力學(xué)實驗指導(dǎo)書 - 山東大學(xué)課程中心30
- 每日經(jīng)濟研究 - 山東大學(xué)課程中心0
- 甲狀腺功能亢進癥山東大學(xué)課程中心
- 山東大學(xué)課程中心助教管理辦法試行
- 山東大學(xué)精品課程
- 山東大學(xué)課程聽課記錄表
- 山東大學(xué)課程聽課記錄表
- 風(fēng)力發(fā)電設(shè)備技術(shù)及產(chǎn)業(yè) - 山東大學(xué)課程中心0
- 山東大學(xué)雙語教學(xué)課程認定表
- 山東大學(xué)藥物分析課程試卷b
- 山東大學(xué)雙語教學(xué)課程信息表
- 山東大學(xué)藥物分析課程試卷c
- 山東大學(xué)藥物分析課程試卷c
- 世界貿(mào)易組織與中國經(jīng)濟發(fā)展 - 山東大學(xué)課程中心30
- 非平衡態(tài)熱力學(xué)山東大學(xué)課程中心
- 山東大學(xué)通識教育核心課程項目
- 山東大學(xué)通識教育核心課程項目
- 山東大學(xué)通識教育核心課程項目
- 山東大學(xué)授課教案
評論
0/150
提交評論