Projetar interfaces de usuário para iPhone ou iPod Touch é semelhante a projetar interfaces para sistemas operacionais Mac ou Windows, incluindo o uso de wireframes para criar mockups de design de interface (UI). Entender as dimensões e proporções usadas na tela do iPhone e seus apps ajuda a criar wireframes mais precisos.
O iPhone original foi lançado com tela de 3,5 polegadas, 480x320 pixels a 163 PPI. O tamanho físico da tela não mudou até o iPhone 4S, mas com a introdução do Retina Display, as telas do iPhone 4 e 4S possuem 326 PPI a 960x640 pixels. Em ambos modelos, as dimensões da tela são 2,94 x 1,96 polegadas, proporção 1,5:1. O iPod Touch usa a mesma tela do iPhone original até a terceira geração, atualizando para Retina Display na quarta geração.
Se planeja criar seus próprios templates de wireframe, use a proporção 1,5:1 e projete seus elementos UI no tamanho relativo apropriado. Se estiver projetando um site ou web app compatível com iPhone, os elementos UI do navegador Safari podem reduzir as dimensões utilizáveis da tela. A Apple oferece API para ocultar a UI do Safari e permitir que um web app use a tela inteira, e você pode configurar viewport para escalar otimamente suas páginas no Safari.
Aplicativos de wireframe de terceiros como FlairBuilder ou Axure RP, ou templates para softwares comuns como Photoshop ou OmniGraffle, podem ajudar a projetar seu app mais rapidamente. Muitos pacotes de wireframing oferecem elementos UI padrão drag-and-drop e outros recursos, que também ajudam a seguir as recomendações de design da Apple.
A Apple recomenda projetar apps para iPhone usando pontos em vez de pixels para medidas, para dimensões mais consistentes de elementos UI entre modelos. Por exemplo, o tamanho mínimo confortável recomendado para um elemento UI acionável é 44x44 pontos, resultando em 44 pixels quadrados no iPhone original e 88 pixels quadrados no Retina Display. A Apple também sugere que, embora você possa projetar para ambas orientações, seu app deve iniciar em orientação retrato porque a tela Início do iPhone só aparece nessa orientação. Mais orientações em developer.apple.com.
Tecnologia Eletrônica © [www.351231.com]
