Como criamos para iOS pela primeira vez
Em agosto de 2023, criamos um aplicativo para iOS pela primeira vez!
Nosso time de produto é formado por:
A Badico é uma empresa de tecnologia especializada em desenvolvimento de software e atua no mercado brasileiro e internacional.
O ponto de partida
Nossa jornada começou com o desafio de criar uma solução de app mobile para um produto existente. Nesse projeto, pudemos explorar e sugerir funcionalidades que fossem interessantes ao contexto do produto e usuários.
Considerando a flexibilidade que o time tinha no momento, a nossa designer, Camilla, trouxe a ideia de fazermos uma solução em iOS que foi bem acolhida pelo time e gestores.
Nós temos uma mentora do time com experiência em produtos e interfaces para iOS, que nos auxiliou a entender algumas diferenças e particularidades do sistemas, como padrões, nomenclaturas e dimensões. O suporte dela foi imprescindível para o sucesso do nosso projeto.
Nesse artigo vamos compartilhar sobre a nossa experiência criando um projeto para iOS pela primeira vez, nossos desafios coletivos e individuais, recursos que nos ajudaram nesse processo e como nos sentimos ao longo dessa jornada.
Desafios do time explorando iOS pela primeira vez
Durante a execução do projeto enfrentamos desafios coletivos e individuais.
Os principais desafios que enfrentamos como equipe foram:
- Pouco contato anterior com o sistema iOS
- Aprendizado de padrões e normas
- Não ter um dispositivo para testar
Pouco contato anterior com o sistema iOS
“Sem nunca ter sido uma usuária de iOS e ter pouquíssimo contato com o sistema operacional, garimpar material na internet sobre os comportamentos e definições de interface foi algo, de certa forma, difícil.”
“Sempre tive dispositivos Android, então raramente tinha contato com um iPhone para poder conhecer a interface e os detalhes. Por isso, logo quando surgiu o desafio de projetar para iOS, isso foi algo que gerou uma breve preocupação.”
Sempre utilizei o sistema Android e, por isso, na minha memória recente e repertórios há mais exemplos de comportamento, componentes e navegação do Android. Também, não havia projetado telas em iOS antes, então, foi um aprendizado completamente novo.”
2. Aprendizado de padrões e normas
“A Apple conta com o Apple Interface Guidelines, onde podemos encontrar algumas instruções acerca da interface. Mas devo dizer que o Material Design sempre deixou muito claras suas especificações, dimensões e posicionamentos de elementos. Talvez por isso, senti muita falta de algo parecido quando fui buscar produzir o protótipo de maneira própria para o iOS. Contamos com ajuda de nossa mentora, que já havia produzido apps para iOS, além de prints de amigos que possuíam e muuuuuita pesquisa no Mobbin.
Ainda assim, algumas coisas foram difíceis de encontrar. Não era um bicho de sete cabeças, mas queríamos ter certeza de que o app estaria em conformidade com os padrões.”
“Até o momento do projeto, eu só tinha projetado/trabalhado em interfaces Android, que possuem suas diretrizes e normas bem organizadas no material.io — o que ajuda os designers em seus protótipos. Porém, quando falamos de interfaces iOS, as normas e diretrizes usadas são outras, o que significa que tivemos que procurar aprender como desenvolver de acordo com os padrões Apple.
Mesmo a prototipação para iOS já existindo há muito tempo, encontrar conteúdos específicos para esse tipo de projeto é muito complicado. Porque além de poucas pessoas falarem sobre o assunto de forma separada, a própria Apple não facilita muito a vida dos designers, pois mesmo que eles possuam um design system grande e completo, muito do conteúdo fica confuso e ambíguo, por conta do design system não ser tão intuitivo quanto o do Material Design, por exemplo.”
“Acessei o Human Interface Guidelines da Apple e fui explorando todas as páginas para ter uma visão geral do conteúdo. À medida em que ia acessando cada página, coletava prints do que me chamava atenção. Quando fui criar as telas e tinha dúvidas específicas, voltava a consultar as diretrizes da Apple e pesquisava no Google e no Mobbin.
Consultar as diretrizes da Apple e avaliar as soluções de outros aplicativos que já estão na Apple Store, em contextos semelhantes ao que eu estava, me ajudaram a conectar a teoria com a aplicação prática.”
3. Não ter dispositivo para testar
De um modo geral, quando eu prototipava para Android, eu tinha sempre à mão o Figma Mirror pra sentir de modo tátil os comportamentos do protótipo e como estava a visualização no celular. Mas quando fizemos esse projeto pra iOS, por mais que eu ainda pudesse testar no celular e afins, eu não tinha como comparativo outros aplicativos nativos para iOS, não tinha de fato os comportamentos iguais.
“Não possuir um iPhone foi algo que me impedia de poder ver comportamentos, animações e transições nativas do iOS para poder entender melhor como funcionavam os comportamentos de interações em um iPhone (precisa estar no padrão da apple), por conta disso, muitas dessas duvidas foram tiradas pela Karla - nossa mentora - que é usuária iOS e mandava prints de exemplos de componentes semelhantes ao que estávamos testando/aplicando, o que ajudou definirmos melhor as soluções quando precisasse.”
“Não pudemos testar em um dispositivo iOS. Seria interessante conseguir ter o apoio de um iPhone para investigar outros apps e avaliar/testar a solução que estava sendo construída, contudo esse foi um desafio que não impediu a criação das soluções.”
Outros desafios importantes para pontuar
- Viabilidade das Soluções
“Assim como tudo que foi dito anteriormente, outro probleminha que tivemos foi relacionado às soluções que pensamos. Pois, como se trata de normas e padrões Apple, muitas das features, componentes e telas que pensávamos, primeiramente devia passar por um filtro de viabilidade, uma vez que fosse possível fazer seguindo as diretrizes do iOS, aí sim seria desenvolvido. Tivemos que ter atenção também quanto a viabilidades dessas soluções em código, uma vez que o conhecimento sobre as limitações da linguagem Swift (desenvolver iOS) era pequeno.”
- Criatividade
“Sabemos que há componentes e comportamentos que são amplamente conhecidos por muitos usuários e devem ser utilizados para reduzir a carga cognitiva das pessoas ao utilizar aquele aplicativo.
Mas é interessante também pensar em usuários avançados e pensar no que pode diferenciar um aplicativo do outro. Quanto a isso, senti uma certa limitação quanto à criatividade, por exemplo, na possibilidade de poder dar formas diferentes a componentes.”
Como nos sentimos durante a criação do aplicativo
“Não vou mentir, foi um pouco assustador, num primeiro momento, imaginar toda a organização e os outros desafios necessários para fazer algo que eu nunca tinha feito e liderar o projeto ainda assim, mesmo tendo sido minha ideia (haha).
Mas ao mesmo tempo foi muito bom ter a sensação de, com a evolução do projeto, perceber que éramos capazes de algo novo. Que novamente buscamos iterar nosso processo e ainda expandir o repertório.”
“Admiro muito a estética minimalista, elegante e inteligente que a Apple utiliza. Mas também penso que há um limite tênue entre o minimalista interessante e o minimalista simplista e entediante. Nesse caso, acredito que a Apple se atenta a detalhes sutis, para construir boas experiências e ultrapassar uma simplificação exagerada em seus produtos. Contudo, ao seguir as diretrizes e criar, precisamos de atenção no equilíbrio entre texto, espaços vazios e elementos visuais.”
“Sempre admirei os produtos da Apple e todo o empenho que eles têm com o design de forma geral. Mesmo para produzir produtos Android, sempre gosto de ver referências do iOS, seja de apps, novos dispositivos ou itens digitais diversos. Por se tratar de uma marca gigante, é notável o cuidado em manter os padrões e diretrizes do design em harmonia nos seus produtos. Design esse, que traz minimalismo e modernidade de forma bem arrojada. Então desde o início, quando soube que faríamos um app para iOS, a motivação maior era aprender como funcionava a criação nesse estilo e conseguir projetar um app que tivesse a cara do nosso projeto, mas que ainda fosse de acordo com os padrões apple.”
Recursos para design em iOS
- Diretrizes e recursos da Apple — Human Interface Guidelines (HIG) (https://developer.apple.com/design/human-interface-guidelines) e UI Kit (https://www.figma.com/community/file/1248375255495415511)
As diretrizes estão disponíveis na web e organizadas em Foundations, Patterns, Components e Inputs com explicação mais textual sobre como cada elemento funciona. Enquanto o UI Kit é um arquivo disponibilizado na comunidade do Figma e produzido pela própria Apple com componentes e estilos configurados de acordo com as recomendações e diretrizes do HIG.
2. Mobbin (https://mobbin.com/)
Plataforma que reúne imagens das telas de aplicativos que estão no mercado. As imagens são organizadas por padrões ou elementos de UI, categoria dos aplicativos, fluxos e sistema operacional. A versão gratuita limita a quantidade de telas para visualização, mas utilizando os filtros e busca conseguimos acessar informações relevantes.
3. Vitaly Friedman (no Linkedin, https://www.linkedin.com/in/vitalyfriedman/)
Criador da Smash Magazine (acompanhar ele no linkedin e ver o site com as publicações)
4. Medium (https://medium.com/)
Como está sendo o nosso caso agora, muitos outros designers também escrevem conteúdos para essa plataforma. Um texto que foi super útil foi esse aqui:
Considerações finais
Como todo bom desafio, esse projeto foi muito interessante para nosso time! Tivemos as dificuldades mas, sobretudo, também superações. Temos, agora, mais um tipo de projeto no portfólio do nosso time e agora, certamente um repertório muito maior em iOS do que quando iniciamos o projeto.
Poder experimentar de diferentes design systems, diferentes sistemas operacionais e suas especificações derivadas é uma experiência que certamente enriquece o designer, e nós recomendamos!
