轉(zhuǎn)載藍(lán)藍(lán)設(shè)計(jì)(   www.alimai.net  )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(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ù)

來源：http://www.cocoachina.com/iphonedev/iPadkaifa/2013/0423/6054.html

如果您想訂閱本博客內(nèi)容，每天自動(dòng)發(fā)到您的郵箱中，   請(qǐng)點(diǎn)這里

 

 

在做APP的iPad版本設(shè)計(jì)時(shí)，我們常常需要考慮：如何在延續(xù)iPhone版本設(shè)計(jì)特色和優(yōu)點(diǎn)同時(shí)，充分利用iPad的特性更好地進(jìn)行設(shè)計(jì)。本文從iPad和iPhone的差異性入手，試圖總結(jié)這一設(shè)計(jì)過程中需要注意的問題。

一、視圖之變

屏幕尺寸的差異直接影響到用戶可見的視圖范圍和應(yīng)用的信息布局。
iPhone5: 屏幕4.0英寸 分辨率1136×640； New iPad：屏幕9.7英寸， 分辨率 2048×1536

1.1全屏切換與視覺穩(wěn)定性。

由于屏幕空間限制，iPhone上不同內(nèi)容之間的切換通常通過全屏切換（full-screen transitions）來實(shí)現(xiàn)，但全屏切換會(huì)帶來視覺穩(wěn)定性的降低和位置感的丟失。而iPad的屏幕尺寸和獨(dú)有的UI框架則可以很方便地解決這一問題。
在iPad應(yīng)用設(shè)計(jì)時(shí)要善用浮動(dòng)窗口(popover)、頁面分割(split view)等UI元素。他們能能減少全屏切換，方便用戶在主要界面中快捷地完成任務(wù)。
在蘋果設(shè)計(jì)指南中也特別提到：
“When you perform fewer full-screen transitions, your application has greater visual stability, which helps people keep track of where they are in their task.”（摘自iOS人機(jī)交互指南）
最經(jīng)典的案例莫過于系統(tǒng)日歷、備忘錄、Evernote和Mobile RSSS的例子。通過頁面分割和浮動(dòng)窗口，用戶可以在一個(gè)頁面內(nèi)完成多封郵件或文章的操作。

-浮動(dòng)窗口(popover)

-頁面分割(split view)

常見的處理方式為從左向右依次層級(jí)加深。在同一屏之內(nèi)可以顯示2-3個(gè)層級(jí)的內(nèi)容，方便用戶在不同層級(jí)之間切換和查閱。例如Kayak iPad版通過視圖分割一個(gè)界面內(nèi)呈現(xiàn)了iPhone上3個(gè)層級(jí)的內(nèi)容。

1.2卡片和卷軸

卡片和卷軸是移動(dòng)設(shè)備上兩種主要的信息展現(xiàn)形式，在iPhone上由于頁面空間的限制，多個(gè)信息的展現(xiàn)一般采用卷軸的形式，上下滑動(dòng)并點(diǎn)擊更多展現(xiàn)全部信息內(nèi)容。在iPad上則可以將卷軸轉(zhuǎn)換會(huì)卡片式展現(xiàn)，一屏之內(nèi)左右滑動(dòng)展現(xiàn)更多內(nèi)容，提升交互效率。例如Ted iPad客戶端:

二、操控之變

物理尺寸的差異還引起操控方式的顯著變化。

iPhone5 : 外觀尺寸123.8×58.6×7.6mm，112g;  iPad ：外觀尺寸241.2×185.7×9.4mm，  652g

2.1單人操作

-把持方式
iPhone:  UX matters 報(bào)告稱，人們基本上以三種方式持握手機(jī)：1）49%的人會(huì)單手持握，15%的人會(huì)雙手持握，還有36%的人會(huì)“抱握”，即雙手握住手機(jī)，但僅用一只手去觸摸屏幕或鍵盤；2）在單手持握手機(jī)的人當(dāng)中，67%的會(huì)用右手大拇指觸摸屏幕，33%的會(huì)用左手大拇指觸摸屏幕。

iPad：雙手操作或靜置為主。根據(jù)尼爾森的調(diào)研，半數(shù)以上用戶并非在動(dòng)態(tài)環(huán)境中使用iPad,常用操作姿勢(shì)主要有以下四種：

百度iPad輸入法在延續(xù)用戶iPhone使用習(xí)慣基礎(chǔ)上結(jié)合iPad特性進(jìn)行了創(chuàng)新：充分利用左右雙手協(xié)助進(jìn)行操作。

-橫豎屏

iPhone：桌面只有豎屏模式，用戶默認(rèn)會(huì)以豎屏為主。實(shí)際產(chǎn)品中，除了視頻、游戲和一些特殊的應(yīng)用外，豎屏基本能滿足需求。

iPad：桌面有橫豎屏兩種模式，橫豎屏切換頻繁。在iPad應(yīng)用中，設(shè)計(jì)師通常需要考慮兩種屏幕定向方式以及對(duì)應(yīng)的界面設(shè)計(jì)方案。例如Path的豎屏采用了timeline形式，而橫屏則采用了以天為單位的圖片流形式。兩種設(shè)計(jì)互為補(bǔ)充，相得益彰。

-手勢(shì)

用戶使用特定的手指運(yùn)動(dòng)，稱之為手勢(shì)。

iPhone：點(diǎn)選（Tap）\ Drag（拖曳）\Flick（輕拂）\ swipe （快速滑動(dòng)）\double Tap（雙擊）\ pinch open （雙指放大）\pinch close（雙指收縮）\touch and hold(長按)\ 搖動(dòng)(shake)

iPad：由于尺寸和重量的關(guān)系，需要考慮適用最適合的手勢(shì)，例如shake的手勢(shì)避免使用。

2.2考慮多手或多人操作

iPad的屏幕特性更適合多手或多人操作，許多在iPhone 上施展不開的游戲界面在iPad上都可以實(shí)現(xiàn)。在設(shè)計(jì)iPad應(yīng)用時(shí)可以適當(dāng)多手或多人的操作模式，提升操作體驗(yàn)。

三、氛圍之變

3.1 更廣大渲染空間

我們?cè)谠O(shè)計(jì)應(yīng)用時(shí)如果利用iPad的優(yōu)勢(shì)而對(duì)界面元素進(jìn)行適度的優(yōu)化，注意氛圍的渲染，往往能取得更好的效果。
例如 NBA應(yīng)用court side，在iPad版中增加了渲染氣氛的球員、球場(chǎng)等元素。

3.2 擬物化界面的調(diào)整

iOS界面最大的一個(gè)特點(diǎn)是界面的擬物化，在由iPhone向iPad設(shè)計(jì)時(shí)需要擬物化元素的調(diào)整。例如備忘錄在iPhone中我們可能看到的是一個(gè)小小的記事頁面，而在iPad中我們可以完整展現(xiàn)一個(gè)筆記本全貌。日歷、時(shí)間顯示、播放器、手寫板、閱讀器、名片夾的設(shè)計(jì)也是同理。