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

Dicas Básicas de Design Mobile

Live iDeas
October 29, 2013

Dicas Básicas de Design Mobile

Live iDeas

October 29, 2013
Tweet

More Decks by Live iDeas

Other Decks in Design

Transcript

  1. SEMPRE trabalhar com números pares 75px 53px 76px 54px Isto

    auxilia no alinhamento dos objetos pelo programador, além de evitar problemas nas conversões de tamanho.
  2. SEMPRE trabalhar com Shapes dentro do Photoshop Dará muita dor

    de cabeça reajustar bitmaps para todas as resoluções.
  3. Os Shapes devem obedecer ao grid Este é um dos

    principais cuidados que devem ser tomados e o princípio do Pixel Perfect. Não basta colar/criar um shape, ele deve ter seus pontos alinhados ao grid. Isto evita obter uma imagem borrada. E deve ser revisado para cada resolução. Ler páginas 6-12 PPP™.pdf
  4. x2 = Comece na resolução menor para iOs Depois duplique

    o tamanho para Retina. Isso evita problemas de alinhamento dos elementos, além de não saírem do grid.
  5. x0.75 LDPI MDPI HDPI XHDPI XXHDPI x2 x3 Comece na

    resolução média para Android Depois reajuste e trasforme para as outras resoluções. O cuidado com os Shapes alinhados ao grid deve ser ainda maior. x1,5
  6. Dimensões das telas Smartphone iPhone 5 640x1136px iPhone 4/4S 640x960px

    iPhone 3GS 320x480px XXHDPI Dimensões mais populares 1080x1920px XHDPI 720x1280px HDPI 480x800px MDPI 320x480px LDPI 240x320px
  7. Dimensões das telas Tablets iPad 1 / iPad mini 768x1024px

    iPad 2 / Novo iPad 1536x2048px HDPI - Galaxy Tab 10.1 / Xoom / Nexus 7 Dimensões mais populares 800x1280px HDPI - Galaxy Tab 10.1 / Xoom / Nexus 7 600x1024px
  8. Dimensões dos Ícones Ícones com máscara de bordas arredondadas iOS

    7 Ícones com formato livre Faça a maior dimensão primeiro, depois é so reduzir e realizar ajustes finos. 1024x1024px 144x144px 120x120px 114x114px 72x72px 57x57px 512x512px 144x144px 96x96px 72x72px 48x48px 36x36px
  9. Utilize ferramentas inteligentes para exportar Existem muitas ferramentas e plugins

    muito mais intuitivos e que lhe pouparão um bom trabalho na hora de exportar as imagens. Devem ser utilizadas com cuidado e consciência, respeitando as regras do Pixel Perfect. macrabbit.com/slicy cutandslice.me pngexpress.com GRÁTIS RECO MEN DADO
  10. Estas são as dicas mais básicas. Para obedecer a todas

    as guidelines, é de extrema importância a leitura do handbook PPP™: goo.gl/H7Y9u