Projetando e Pensando em Design

http://facebook.com/eloijr @eloijr http://eloisjr.blogspot.com

Eloi Jr

Iniciou na rea mobile em 2005 Palestrou em diversos eventos de TI Escreveu artigos tcnicos Java ME, Android, Windo s P!one e etc" Possui uma a## no $etJar com % &0' do nloads $oogle Pla(, Windo s P!one )tore, *o+ia )tore, ,#era )tore, Tim A## )!o# e Java"net

,b-etivo Apresentar informaes e dicas importantes sobre como projetar a camada visual de uma aplicao Android e como melhorar o dilogo com o profissional de design.

.is#ositivos Androids

Telas com densidade de #i/els variadas .#i 0dots1#er1inc!2

$ru#os3 4ogical Pi/el .ensities

.ensidade de Pi/el3 5ierar6uia de #astas

.ensit(1Inde#endent Pi/el

7nidade virtual de #i/el E6uivalente a um #i/el em 890 d#i 0M.PI2 Escalando #ro#orcionalmente de acordo com a densidade da tela d# ou di# Permite 6ue elementos da inter:ace #ermane;am com o mesmo taman!o :<sico, a#ro/imado, inde#endente da resolu;=o

A #onta de um dedo !umano ocu#a a#ro/imadamente 50 d#

>alculando .P
8 #/ 8 d# 890 d#i 890 d#i ???????? @ ????????

2 #/ 8 d#

A20 d#i 890 d#i

???????? @ ????????

>alculando .P
*e/us &Bs3 &C, D5.PI, 8E20/8200 #/ ou E90/900 d#i

2 #/ 8 d#

A20 d#i 890 d#i

???????? @ ????????

.P de Alguns .is#ositivos Android

$oogle *e/us 80 )amsung $ala/( ) II )amsung $ala/( ) III )amsung $ala/( Tab &F )amsung $ala/( *ote 2 )on( D#eria G

1 D5.PI 1 5.PI 1 D5.PI 1 M.PI 1 D5.PI 1 DD5.PI

)amsung $ala/( Tab 2 80F 1 M.PI

Hesolu;=o em .P3 7so

<ImageView android:id="@+id/btngrava" android:layout_width="65dp" android:layout_height="65dp" android:background="@drawable/grava" android:layout_alignParentRight="true " />

Hesolu;=o em .P0te/to23 7so

<TextView android:layout_width= match_!arent android:layout_height= wra!_content android:text"i#e= $%&! />

4aunc!er Icons

Iormato3 P*$

Automatic )caling

Evite esse recurso com imagens es#ec<:icas #ara cada densidadeJ

*ine1Pat! Kitma#s

Ar6uivos P*$ 0trans#arentes2 :ormatados com indicadores das reas 6ue #odem e n=o #odem ser redimensionadas Kitma#s utiliLados em com#onentes 6ue #oder=o ter taman!o variado .ra E#atc!3 demarca as reas da imagem original do designer E/tens=o3 "E"#ng

*ine1Pat! Kitma#s
android3bac+ground@FMdra ableNbuttonF

,utros Princ<#ios

,b-etos reais inter#retam mel!or sua inten;=o do 6ue menus e botOes Iorne;a temas de:aults suaves e bonitos mas #ermita a customiLa;=o Iiguras s=o mel!ores do 6ue #alavras A#resente a#enas o necessrio #ara o momento In:orme ao usurio onde ele realmente est

Google Developers Group: https://developers.google.com/?hl=pt br

>omunidade MobiliLa;=o3 reuniOes e eventos .esta6ue .esa:ios Programas #ara .esenvolvedoresN)tartu# Poutube3 *eto Marin 0.evelo#er Advocate2 .evK(tes 0#ortuguQs2 $.$ Im#eratriLJJJJJJJ

!efer"ncias: http://developer.android.com #outube: Design$%tes: Densit% independent Pi&els !oman 'urik (mail: eloimuon@gmail.com http://facebook.com/eloijr

@eloijr http://eloisjr.blogspot.com