2013年9月15日 星期日

[Android] App的UI尺寸大小?

最近在設計一款Android app,在開發的過程中Survey了不少相關資料,在這裡將一些UI設計上的心得與大家作分享。在此我主要針對介面的尺寸大小作說明,讓相關設計人員可以快速的了解到應用程式開發時,在UI及ICON尺寸的部份需要如何進行設計。
 
在此之前我們必須了解到以下幾個觀念:

  • Resolution(pixel):一般針對電腦螢幕所使用的圖像尺寸計算單位。
  • Density-independent pixel(dp):Android所使用的圖像計算單位,和我們一般使用的"解析度(pixel) "不同,原因在於Android的開發跨及多種螢幕尺寸,因此圖像的計算單位以"尺寸(size)"和"密度(denity)"間之對應關係所構成。
  • Dots per inch(dpi):單位區域內的pixel數量,就一個320dpi的手機螢幕規格而言,即為每"320pixel / 平方英吋"。

初步了解上述的觀念後,接著我們要說明的是目前Android SDK(ver. 17)內共預設了五種圖像尺寸,而系統會依據裝置的螢幕大小自動挑選最合適的圖像size(如Samsung S4的螢幕規格為480dpi,則預設大小即為xxhdpi),藉此滿足市售多種螢幕規格之裝置,其預設的尺寸規格如下:

  • ~120dpi:ldpi(low-density screen)
  • ~160dpi:mdpi(medium-density screen)
  • ~240dpi:hdpi(high-density screen)
  • ~320dpi:xhdpi(extra-high-density screen)
  • ~480dpi:xxhdpi(extra-extra-high density screen)

在開發應用程式時,設計師必須分別針對上述五種預設的圖像尺寸提供相對應解析度的UI,根據Android官方的說法一個160dpi的螢幕規格對應pixel剛好為1:1,換句話說mdpi(medium-density screen)的圖像尺寸和螢幕所看到的圖像大小相當。因而在設計UI時我們可以拿mdpi為基準(或依據手邊現有的裝置),再依照不同的圖像尺寸作縮放,其相對應的比例如下:

  • ldpi(120dpi):0.75
  • mdpi(160dpi):1
  • hdpi(240dpi):1.5
  • xhdpi(320dpi):2
  • xxhdpi(480dpi):3

同樣的再ICON設計的部分也是依照其大小比例作縮放即可,在此列出ICON的設計大小:

  • ldpi:36x36(pixel)
  • mdpi:48x48
  • hdpi:72x72
  • xhdpi:96x96
  • xxhdpi:144x144

若需了解更多關於Android設計的guideline可以參照Android官方說明文件,待我的App上架後還請各位多多支持一下。

沒有留言:

張貼留言