Gráficos, Ícones, Resoluções e Tamanhos #AppleHIG
Ícone do Aplicativo (App Icon)
O ícone do seu aplicativo deve ser bonito e único para que fique na memória do usuário e se destaque na tela inicial e na App Store. O ícone deve de cara representar a finalidade do aplicativo.
Simplicidade é tudo
Escolha apenas um elemento que represente a essência do seu aplicativo e trabalhe nesse elemento para que o torne simples e exclusivo, adicione detalhes suavemente para que o ícone não fique muito detalhado e consequentemente complexo, pois os detalhes podem ser difíceis de enxergar se em tamanhos pequenos.
Faça um ícone com apenas um ponto de foco e trabalhe apenas nesse ponto, para que a atenção do usuário seja captada apenas nesse ponto e identifique de imediato qual é o app e o propósito do mesmo.
O ícone deve ser facilmente identificável, o usuário não deve ter que analisá-lo para saber o propósito do aplicativo, isso deve ser reconhecido logo de cara.
Dê preferência à ícones opacos, com o plano de fundo simples e dispense a transparência, pois isso dificulta a compreensão do ícone,
Só utilize palavras no ícone se elas fizerem parte do logotipo ou sejam realmente essenciais para a compreensão, lembre-se sempre de que o nome do seu aplicativo vem logo abaixo do ícone.
Faça o ícone com os cantos quadrados, pois o sistema cuida de aplicar uma máscara que arredonda os cantos automaticamente.
O que é evitável?
Opte por não utilizar fotos, capturas de tela ou elementos que são utilizados na interface, pois os detalhes de fotografias não são visíveis quando em tamanhos pequenos, capturas de tela não conseguem expressar a finalidade do aplicativo e elementos existentes na interface tornam o usuário confuso.
Não use representações de produtos Apple em seu ícone, pois todos os produtos Apple são protegidos por direitos autorais e não podem ser reproduzidos em ícones ou imagens no aplicativo.
Não replique o ícone do aplicativo para dentro da interface, pois torna estranho ver o ícone usado para funções além da principal dele.
Faça testes
Antes de aprovar a versão final de seu ícone, faça testes do mesmo com aplicação em diferentes planos de fundo e cores, pois não é possível saber qual plano de fundo cada usuário irá utilizar, portanto, prever uma boa gama de opções é uma boa prática para que o ícone tenha uma boa visibilidade independente do plano de fundo do usuário.
Ícones personalizáveis pelo usuário
Ícones personalizáveis não são frequentemente vistos no sistema, porém quando aparecem, demonstram cuidado e preocupação do desenvolvedor para com o usuário, fazendo com que o aplicativo se adeque ao estilo do mesmo e o deixa com uma conexão mais pessoal.
É recomendável que o ícone seja personalizável apenas quando houver a opção de mudança de tema dentro do próprio aplicativo, fazendo assim uma conexão do tema do ícone personalizado com o tema da interface em si.
A opção de personalização deve estar o mais natural possível dentro do aplicativo, para que a experiência do usuário seja de estar fazendo uma ação normal dentro do aplicativo.
Custom Icons (Ícones Personalizados)
O sistema disponibiliza diversos ícones de sistema que você pode utilizar em seu aplicativo, entretanto, caso esses ícones disponibilizados não se encaixem no estilo do aplicativo, você pode criar seus próprios ícones.
Seja simples
Uma boa recomendação é criar ícones com desenhos simples e que sejam facilmente reconhecíveis pelo usuário, pois muitos detalhes tornam o ícone pesado e de difícil entendimento. Tente fazer um ícone que seja facilmente reconhecido pela maioria dos usuários e que não sejam ofensivos à nenhum deles.
Faça ícones com cores solidas e com transparência, pois o iOS ignora todas as informações de mais de uma cor, portanto utilize apenas uma e faça o uso de transparência para diferenciar quando estiverem selecionados ou não, anti-aliasing e não utilize sombras.
Mantenha um padrão de design dos ícones de sistema, sejam eles personalizados ou alternados entre personalizados e de sistema, todos devem ter o mesmo tamanho, nível de detalhamento ,perspectiva e largura da borda iguais.
Tenha duas versões do mesmo ícone para estados de selecionado e não selecionado, geralmente o ícone selecionado é a versão preenchida do ícone não selecionado.
Ofereça etiquetas de texto alternativas em todos os ícones do aplicativo, elas não são visíveis na tela e funcionam permitindo que o VoiceOver descreva para pessoas com deficiências visuais o que está na tela, facilitando a navegação dos mesmos no aplicativo.
O que não fazer
Não utilize texto como ou em ícones da Tab Bar, se o texto for necessário, exiba-o como titulo logo abaixo do ícone na Tab Bar.
Não use representações de produtos Apple em seu ícone, pois todos os produtos Apple são protegidos por direitos autorais e não podem ser reproduzidos em ícones ou imagens no aplicativo.
Tamanho e Resolução da Imagem (Image Size and Resolution)
O sistema do iOS utiliza coordenadas para colocar e posicionar o conteúdo na tela. O sistema de coordenadas se guia em pontos (pt), que são mapeados para pixels na no visor. Em telas com a resolução padrão, um ponto (pt) (1/72 polegada) é igual a um pixel (px).
Por esse motivo, é importante que você forneça todas as imagens usadas no aplicativo em alta resolução, para que o aplicativo mantenha a qualidade em todos os dispositivos que suportarem o aplicativo. Dependendo do dispositivo, é possível fazer essa “conversão” multiplicando o número de pixel de cada imagem utilizada pelo fator de escala certo.
Para entender o fato de escala, pense que uma imagem com a resolução padrão tem o fator de escala 1,0, logo é uma imagem @1x. Imagens com alta resolução tem o fator de escala 2,0 ou 3,0, logo são imagens @2x ou @3x.
Tela de Inicialização (Launch Screen)
A tela de inicialização é mostrada na mesma hora em que o aplicativo é aberto e depois é rapidamente substituída pela primeira tela do aplicativo, o que dá ao usuário a impressão de que o aplicativo é bem rápido e fluido. Objetivo da tela de inicialização não deve ser um momento para expressar algo artístico ou fazer propagandas dos desenvolvedores ou do aplicativo. O objetivo dela é apenas dar a sensação ao usuário de que o seu aplicativo fica pronto para o uso imediatamente após ser aberto.
Como os tamanhos de tela mudam dispositivos para dispositivos, os tamanhos das telas de inicialização variam também, por conta disso, você tem algumas alternativas para que a tela de inicialização fique padrão em todos os dispositivos, uma das opções é usar a tela de inicialização como um storyboard do Xcode, que é a mais recomendada por conta dos storyboards serem totalmente flexíveis e adaptáveis, mas também é possível usar imagens estáticas com os tamanhos ajustados de cada dispositivo.
O que é recomendado
Utilize uma tela de inicialização quase idêntica à primeira tela de seu aplicativo, pois isso faz com que o carregamento do aplicativo pelo sistema seja quase que invisível.
Não coloque textos em sua tela de inicialização, pois como as telas são estáticas, qualquer texto utilizado não será localizado.
Ícones do Sistema (System Icons)
O iOS disponibiliza uma serie de ícones de sistema para os desenvolvedores, esses ícones podem ser usados em navigation bars, tab bars, toolbars e ações rápidas da tela inicial. O uso destes ícones é altamente recomendável por conta deles sempre aparecem no sistema e serem familiares aos usuários.
Veja a lista completa dos ícones disponibilizados pelo iOS em: System Icons
