Upgrade to Pro — share decks privately, control downloads, hide ads and more …

如何設計 Android UI

Bing
October 06, 2015

如何設計 Android UI

Android UI 基礎概念介紹

Bing

October 06, 2015
Tweet

More Decks by Bing

Other Decks in Design

Transcript

  1. MDPI HDPI XHDPI XXHDPI XXXHDPI DPI 160 240 320 480

    640 SCALE 1x 1.5x 2x 3x 4x DP 100dp 100dp 100dp 100dp 100dp px 100px 150px 200px 300px 400px
  2. Skala Preview 1. Macᒒ Sketch plugin牏ಋ秚ᒒ ӥ斉 Android APP 2.

    ಋ秚膏襎脲ֵአፘݶጱ Wifi 翕᪠ 3. ࣁ Sketch 螡䢔ᥝ毆薩ጱ Artboard 4. 毆薩盠蝧棎物CMD + P 5. ෝಋ秚Ӥ毆薩向ᶎ
  3. Grid Baseline grid 傶 8dp * 8dp
 
 MDPI 1x物

    8px * 8px
 XHDPI 2x物 16px * 16px
 XXHDPI 3x物 24px * 24px
  4. Height • Status bar: 24dp • Toolbar(ActionBar): 56dp • Title

    and list items: 72dp • Subtitle: 48dp • Space between content areas: 8dp
  5. Font • sp 傶ਁ羷ጱ㻌֖ • 1px = 1dp = 1sp

    • sp 䨝狅ᆙֵአᘏጱ羬翄戔 ਧ㬵婘硯牐