蘋(píng)果iphone APP界面設(shè)計(jì)尺寸官方版
一:iphone界面設(shè)計(jì)尺寸(640*960)px
該Iphone界面設(shè)計(jì)是從蘋(píng)果官方網(wǎng)站幫助中心提取過(guò)來(lái),這也是我第一次幫公司產(chǎn)品設(shè)計(jì)iphone版的UI使用的尺寸。由于之前接觸的比較少,只知道蘋(píng)果手機(jī)的界面尺寸是640*960,其實(shí)真正的大小是320*480,因?yàn)槿说囊暰W(wǎng)膜關(guān)系,蘋(píng)果公司放大了2倍。
所以,我們?cè)谠O(shè)計(jì)的時(shí)候,需要按照該圖上的尺寸來(lái)放大2倍作為我們?cè)O(shè)計(jì)的尺寸。
或者說(shuō),我們初學(xué)者可以模仿,可以借鑒蘋(píng)果公司成熟的案例。我們導(dǎo)出一張完整的iphone手機(jī)界面。作為我們?cè)O(shè)計(jì)的底版。
25學(xué)堂教程原創(chuàng)二:Android界面通常設(shè)計(jì)尺寸(480*800)px
系統(tǒng)會(huì)根據(jù)你手機(jī)的分辯率分別到如下幾個(gè)文件來(lái)里來(lái)找對(duì)應(yīng)的圖片:
hdpi(hign-dpi) 這個(gè)文件平里放置高分辯率的圖片,即如下尺寸的文件:480×800、480X854
mdpi(middle-dpi)這個(gè)文件平里放置中等分辯率的圖片,即如下尺寸的文件:320×480
ldpi(lower-dpi)這個(gè)文件平里放置低分辯率的圖片,即如下尺寸的文件:240×320
Ipad 和Iphone APPUI設(shè)計(jì)尺寸和參考手冊(cè)
愛(ài)上設(shè)計(jì)之APPUI設(shè)計(jì),在此為大家?guī)?lái)的該設(shè)計(jì)參考手冊(cè)的說(shuō)明是“開(kāi)發(fā)者不懂圖形設(shè)計(jì),設(shè)計(jì)師討厭返工,本參考手冊(cè)旨在幫助設(shè)計(jì)師設(shè)計(jì)超贊的 iPad 和Iphone APP UI 設(shè)計(jì),并且告訴設(shè)計(jì)師如何為開(kāi)發(fā)者提供一個(gè)正確的設(shè)計(jì)文件!北驹O(shè)計(jì)手冊(cè)按照尺寸、圖標(biāo)、小貼士和傳遞這幾個(gè)部分鋪展開(kāi)來(lái),希望能幫到大家~同時(shí)也是初做APP設(shè)計(jì)師的基本寶典!目睹為快吧!
ipad界面設(shè)計(jì)規(guī)范,新手設(shè)計(jì)iPad的必備寶典
平臺(tái)特點(diǎn)
1 大屏幕,分辨率 1024×768
2 再次強(qiáng)調(diào)沒(méi)有固定的方向,必須四個(gè)方向都支持。
3 可以外接鍵盤(pán)
4 可以放置設(shè)備,與臺(tái)式機(jī)同步
iPhone與iPad的共同特點(diǎn)
- 內(nèi)存有限
- 同時(shí)運(yùn)行單個(gè)程序
- 在設(shè)置功能里放置程序選項(xiàng)
- 設(shè)備方向可以改變
- 最小化的幫助,讓用戶(hù)直接就能看懂
- 程序響應(yīng)手勢(shì)而不是鼠標(biāo)
- 運(yùn)行源生程序、Web程序或者二者兼?zhèn)?/span>
- 圖片深度24位(RGB各8位),另帶8位alpha通道,建議使用PNG格式圖片
ipad界面設(shè)計(jì)簡(jiǎn)單建議
1、 支持所有方向
注意要為每個(gè)方向都提供一個(gè)啟動(dòng)圖片
2、 增強(qiáng)交互而非只增加功能
3、 使用split view, 導(dǎo)航和彈出窗口來(lái)平整信息層級(jí)
4、 減少全屏切換,僅僅改變需要改變的部分
5、 支持協(xié)作和互聯(lián)
6、如果可能,增加真實(shí)感以及物理維度到應(yīng)用程序里,盡可能像真實(shí)世界的物品以便用戶(hù)易于上手
7、 界面漂亮 用戶(hù)喜愛(ài)
8、 盡量讓用戶(hù)更關(guān)注內(nèi)容而不是界面
9、 盡可能減少?gòu)?qiáng)制用戶(hù)模式化操作
10、 減少使用列表,改變?yōu)槠渌问?/span>
11、 盡量支持多手指手勢(shì)
12、 讓用戶(hù)模式化操作的地方可以用彈出窗口
13、 限制復(fù)雜的模式化操作
14、 減小文件操作尤其盡量讓用戶(hù)感覺(jué)不到文件系統(tǒng)的存在
15、 僅僅在必須的情況才提示用戶(hù)保存
16、 將工具條整合在界面上部
17、盡可能快速啟動(dòng)程序
盡量使用截圖作為啟動(dòng)畫(huà)面
不要在啟動(dòng)時(shí)顯示關(guān)于或者splash screen
恢復(fù)上次運(yùn)行狀態(tài)
盡量不要讓用戶(hù)提供設(shè)置信息
18、 程序可能隨時(shí)停止
19、 為每個(gè)方向都準(zhǔn)備啟動(dòng)畫(huà)面
20、 建立漂亮的圖標(biāo)
尺寸:72×72
和iPhone程序類(lèi)似,iPad程序的圖標(biāo)會(huì)自動(dòng)增加:圓角、陰影和高光。
圖標(biāo)標(biāo)準(zhǔn):
> 90度直角邊
> 沒(méi)有高光
> 不帶alpha通道透明
另外要提供48×48圖標(biāo)一個(gè),用于spotlight搜索和設(shè)置
|