三種app開(kāi)發(fā)模式大對(duì)比,三種移動(dòng)app開(kāi)發(fā)模式

移動(dòng)端app設(shè)計(jì) 移動(dòng)端app設(shè)計(jì)以什么尺寸作為視覺(jué)稿作為適配

1.選擇一個(gè)尺寸作為設(shè)計(jì)和開(kāi)發(fā)；的基準(zhǔn)

2.定義一組適配規(guī)則，自動(dòng)適配其余兩種尺寸；

3.特殊的改編效果賦予了設(shè)計(jì)效果。先來(lái)看看我們采用的合作模式，然后慢慢解釋整個(gè)故事。

為數(shù)不多步，在視覺(jué)設(shè)計(jì)階段，設(shè)計(jì)師根據(jù)寬度(iPhone6)制作設(shè)計(jì)稿，除了圖片以外的所有設(shè)計(jì)元素都采用矢量路徑制作。設(shè)計(jì)定稿后，在設(shè)計(jì)稿上標(biāo)注，并輸出標(biāo)注的圖紙。同時(shí)放大1.5倍生成一個(gè)寬度的設(shè)計(jì)稿，在稿中剪切圖片。

第二步，另一個(gè)是寬度的設(shè)計(jì)圖。

第三步是完成iPhone6的界面開(kāi)發(fā)()。在這個(gè)階段，我們不能使用固定寬度的開(kāi)發(fā)接口，而是使用自動(dòng)布局，以方便后續(xù)適應(yīng)其他尺寸。

第四步：自適應(yīng)調(diào)試階段，基于iPhone6的界面效果，分別上下調(diào)試()和()以下的界面效果。從而完成大、中、小屏幕適配。

為什么選擇iPhone6作為基準(zhǔn)尺寸？

面對(duì)三種需要適配的屏幕時(shí)，很容易想到先做一個(gè)屏幕，再適配剩下的兩個(gè)屏幕。為數(shù)不多個(gè)決定是哪個(gè)屏幕應(yīng)該作為設(shè)計(jì)和開(kāi)發(fā)的基準(zhǔn)尺寸我們選擇中型iPhone(/)作為基準(zhǔn)有幾個(gè)原因：

1.從中間尺寸上下擬合時(shí)，界面調(diào)整的范圍小。在設(shè)計(jì)效果下的適應(yīng)性和偏差不會(huì)太大。假設(shè)為基準(zhǔn)做了一個(gè)非常優(yōu)雅的設(shè)計(jì)，可能元素之間的比例就不是這樣了，比如圖片和文字之間的視覺(jué)比例可能會(huì)失衡。

2.有兩種顯示模式，標(biāo)準(zhǔn)模式分辨率為，放大模式分辨率為(即iPhone6的1.5倍)。可以看出，在官方系統(tǒng)中，iPhone6與分辨率之間存在1.5倍的放大關(guān)系。在許多情況下，這兩種尺寸可以以1.5倍的直接等比例匹配。

3.這個(gè)奇妙的數(shù)值是蘋(píng)果官方不愿意公開(kāi)宣傳的分辨率，而且不方便記憶和計(jì)算網(wǎng)格。雖然是廣泛使用的分辨率，但在大屏?xí)r代用小尺寸作為設(shè)計(jì)基準(zhǔn)顯然已經(jīng)過(guò)時(shí)，設(shè)計(jì)師也會(huì)停留在小屏的角度來(lái)設(shè)計(jì)。

【急】基于手機(jī)APP產(chǎn)品的UI設(shè)計(jì)打開(kāi)報(bào)告