iPhone App的特點(diǎn)及基本設(shè)計(jì)方法

iPhoneApp的特點(diǎn)

　　iPhone有自己的特點(diǎn)和氣質(zhì)，因此他的App不同于其他鍵盤手機(jī)甚至Android這種觸屏手機(jī)。

　　首先iPhone只有一個(gè)物理按鍵Home，而這個(gè)按鈕主要是在系統(tǒng)級(jí)操作上起到一些作用，在一個(gè)應(yīng)用中，絕大多數(shù)情況都是退出功能。在480x320這個(gè)對(duì)手機(jī)而言很大的屏幕上要包括以下3個(gè)模塊，才能對(duì)一個(gè)App進(jìn)行操作。

　　1、虛擬鍵盤

　　iPhone雖然與Android同為觸屏，但沒(méi)有物理鍵盤(而Android有可能有物理鍵盤)，所有的輸入操作都需要屏幕中的虛擬鍵盤來(lái)實(shí)現(xiàn)，同時(shí)需要考慮虛擬鍵盤的遮擋問(wèn)題。

　　2、目錄導(dǎo)航

　　沒(méi)有物理按鍵做為目錄菜單的呼出功能，完全不同于Symbian和Android系統(tǒng)，包括導(dǎo)航也需要屏幕中的虛擬按鈕來(lái)實(shí)現(xiàn)。

　　3、功能操作

　　需要把所有的功能集成在App中，比如我們可以用Tabbar來(lái)做功能的分類，工具欄來(lái)做具體視圖的功能操作集合。

　　我們?cè)賮?lái)看看用戶對(duì)iPhone的使用習(xí)慣

　　顯然支持單手操作并不是iPhone應(yīng)用的特性，當(dāng)然也有一些游戲需要雙手進(jìn)行(沉浸式應(yīng)用)，但因?yàn)閕Phone有一塊非常靈敏支持手指多點(diǎn)觸控的電容屏，所以手指直接在屏幕上的操作更加直觀和更具操控感，不需要任何中間設(shè)備(按鍵或是鼠標(biāo))來(lái)控制。

　　1、自上而下的操作：

　　用戶多數(shù)情況下會(huì)如上圖的姿態(tài)，一手握機(jī)，大拇指做為主要操作和點(diǎn)擊手指，我們可以看到不管是iPhone系統(tǒng)應(yīng)用還是很多其他的優(yōu)秀應(yīng)用，大多使用很多的列表，因?yàn)槟粗冈诨瑒?dòng)列表時(shí)會(huì)非常順暢和方便，而且操作速度非?？?，所以很長(zhǎng)的列表不會(huì)成為iPhone應(yīng)用的障礙，這與其他手機(jī)平臺(tái)上的特性不同，更何況在表格的情況下，單擊頂部的狀態(tài)欄可以快速回到頂部。

　　2、減少輸入

　　這與《移動(dòng)設(shè)備交互設(shè)計(jì)》書中的一些觀點(diǎn)一致，即對(duì)于手持設(shè)備我們要盡量的減少用戶輸入，特別對(duì)于iPhone這種虛擬鍵盤而言，即便電容屏再靈敏，對(duì)于每次都準(zhǔn)確的觸動(dòng)面積很小的虛擬鍵盤也并不是一件輕松的事情，我們要盡量使用選擇器，或是輸入提示suggestion來(lái)減少成本。

　　3、足夠大的按鈕面積

　　對(duì)于iPhone這塊電容屏來(lái)講，雖然很靈敏，但接受的感觸面積并不小，且用戶又是直接用手指操作，所以我們要對(duì)應(yīng)用中的所有按鈕要適合指尖來(lái)操作，跟據(jù)官方給出的設(shè)計(jì)指導(dǎo)，44*44pix是一個(gè)較理想的面積。

　　4、多點(diǎn)觸控手勢(shì)

　　相對(duì)于設(shè)備的軟硬件來(lái)說(shuō)，手指總是保持可用，它是人體的一部分，可以靈活的做各種動(dòng)作，而且直接觸控屏幕非常直觀，且用戶也非常愿意使用這些看上去很酷手勢(shì)動(dòng)作，比如可以對(duì)圖片用兩個(gè)手指拉開來(lái)放大，合并來(lái)縮小，直接拖動(dòng)來(lái)調(diào)換順序，搖晃來(lái)進(jìn)行刷新等。當(dāng)然我們要考慮這些手勢(shì)在不同應(yīng)用的不同使用場(chǎng)景，不要濫用。

　　總之，iPhone應(yīng)用的是線性的，連貫的，直觀的依賴滑動(dòng)操作，手指點(diǎn)擊，以及各種手勢(shì)給人很酷的感覺(jué)。

　　iPhone App的基本設(shè)計(jì)方法

　　1、iPhone應(yīng)用的分類

　　1)高效型

　　這類應(yīng)用可以幫助用戶快速完成一個(gè)任務(wù)，注重內(nèi)容的組織邏輯功能和信息架構(gòu)的展現(xiàn)，以方便用戶快速高效的使用，最終完成任務(wù)。此類應(yīng)用一般包含大量的列表及每個(gè)列表中的任務(wù)功能。最典型的就是系統(tǒng)自帶的“Mail”應(yīng)用，這是一個(gè)非常典型的高效型應(yīng)用。

[!--empirenews.page--]
此類應(yīng)用給用戶的感覺(jué)是層層進(jìn)入，內(nèi)容逐步具體化，直到可以完成用戶的任務(wù)。

　　另外一個(gè)非系統(tǒng)應(yīng)用且典型的就是QQ，可以看一下是不是也遵循這個(gè)特點(diǎn)。

　　2)實(shí)用工具型應(yīng)用

　　此類應(yīng)用一般交互操作非常少，也沒(méi)有很深的層次結(jié)構(gòu)，往往都是直接了當(dāng)?shù)恼故拘畔?，一般?huì)在“背面”(通常會(huì)有一個(gè)翻轉(zhuǎn)的效果)展示設(shè)置功能。最常見的就是“天氣”和“股票”兩個(gè)系統(tǒng)自帶的應(yīng)用。

　　3)浸入式應(yīng)用

　　大多指游戲類應(yīng)用，但也有一些實(shí)用工具，比如電子羅盤，所謂浸入式應(yīng)用一般是全屏模式，專注一個(gè)任務(wù)或是娛樂(lè)的深入體驗(yàn)，沒(méi)有過(guò)多的文字，而將用戶的注意力放在如何使用它。

　　2、設(shè)計(jì)iPhone應(yīng)用

　　1)iPhone應(yīng)用的基本結(jié)構(gòu)

　　狀態(tài)欄：這是ios系統(tǒng)的一部分，除了浸入式應(yīng)用外，其他應(yīng)用一般都會(huì)保留這個(gè)bar。

　　導(dǎo)航欄：這里包括當(dāng)前的title，當(dāng)前的主要操作的控件和返回的導(dǎo)航功能

　　工具欄：對(duì)當(dāng)前內(nèi)容區(qū)可執(zhí)行的功能動(dòng)作。

　　標(biāo)簽欄：可以理解為全局導(dǎo)航，方便快速切換功能或是導(dǎo)航。工具欄和標(biāo)簽欄在一個(gè)視圖中只能存在一個(gè)。

2)移植你的應(yīng)用

　　大多數(shù)情況下我們都是把web端的應(yīng)用移植到手機(jī)上，而在web端的應(yīng)用，如果我們列出一個(gè)功能結(jié)構(gòu)圖，可能會(huì)包含100項(xiàng)以上的功能點(diǎn)，你可以做如下工作：

　　①考慮這個(gè)web端的產(chǎn)品，核心功能是什么。任何一個(gè)產(chǎn)品都會(huì)有核心功能，以及附加功能，比如QQ，核心功能就是IM，即時(shí)通信，可能截屏是一個(gè)附加功能，盡管用的人非常多。確定核心功能后，以及圍繞核心功能盡可能少的擴(kuò)展功能和邏輯。

　?、趯?duì)確認(rèn)的功能結(jié)構(gòu)考慮在iPhone上的信息架構(gòu)模型。上文說(shuō)過(guò)，iPhone應(yīng)用是線性的連貫操作，一層一層進(jìn)入直到完成最后的任務(wù)，所以你要按這個(gè)思路去整理信息架構(gòu)，一般來(lái)說(shuō)，操作的深度不要超過(guò)3層，如果超過(guò)3層就要對(duì)產(chǎn)品形態(tài)進(jìn)行扁平化處理，即由深度改為廣度，因?yàn)殡S著深度的增加，每一級(jí)別都會(huì)有不同的功能，甚至有承載上一級(jí)的功能或邏輯，深度越多，這些功能就會(huì)越復(fù)雜，而在手機(jī)如此小的空間上就很難進(jìn)行合理組織。

　?、酆侠砝胕Phone應(yīng)用的結(jié)構(gòu)及標(biāo)準(zhǔn)控件。

　　標(biāo)簽欄，可以理解為web應(yīng)用中的全局導(dǎo)航或是主要子功能的切換，這個(gè)bar可以貫穿于主要視圖的底部，方便用戶快速跳轉(zhuǎn)，比如下圖這個(gè)標(biāo)簽欄。

　　導(dǎo)航欄，可以理解為web應(yīng)用中的局部導(dǎo)航，子導(dǎo)航或是面包屑，顯示當(dāng)前位置，同時(shí)還承載了1個(gè)或兩個(gè)主要功能操作。可以方便用戶返回，或是對(duì)當(dāng)前視圖進(jìn)行1-2個(gè)最重要的操作。如下面這個(gè)導(dǎo)航欄。