Primeiro App em SwiftUI, do design à programação

Relato de experiência do processo de criação do "Pace Ideal", meu primeiro App em SwiftUI.

Camila Xavier
Apple Developer Academy | UFPE
5 min readMay 31, 2024

--

Vocês sabem o que é CBL? Faço parte da Apple Developer Academy da UFPE e lá o processo de aprendizagem é baseado em desafios (CBL), mas o que significa isso?

Resumidamente, o CBL é dividido em 3 etapas, engage, na qual você descobre com qual tema se identifica e quer trabalhar, investigate, na qual você pesquisa e se aprofunda sobre o tema, gerando questionamentos e descobrindo novas coisas até saber em qual ponto do assunto escolhido quer atacar e act, que é a última etapa para "tirar a solução do papel", realmente desenvolver a solução proposta na etapa anterior.

No nosso primeiro challenge passamos por todo um processo de inovação até chegar no ponto em que queríamos atacar no tema que cada um escolheu. Vale ressaltar que esse primeiro desafio possuía 2 restrições: ter apenas uma tela e calcular alguma coisa!

Então depois de todo o processo eu escolhi "Esportes" como meu tema (Big Idea) e resolvi "Calcular o quanto a prática de corridas cotidianamente pode influenciar no dia a dia de uma pessoa" (Challenge). Um pouco curioso né? Mas eu amo esportes e corrida é algo que eu quero muito começar a praticar, então foi algo que me motivou bastante.

No final dessa primeira etapa, minha Solution Concept foi um "Aplicativo na qual o usuário diz a sua idade, o seu peso atual, altura, sua frequência semanal de exercícios aeróbicos, e qual objetivo quer com a corrida (corrida por lazer, para correr maratona ou saúde) e através de um cálculo o aplicativo irá retornar o Pace Ideal para essa pessoa de acordo com essas condições".

Chegamos na segunda etapa, a prototipação, e acredite, durante todo esse processo muita coisa muda. Tudo começou com o Low-fi, que é o protótipo de baixa fidelidade, que você faz no papel mesmo, sem se preocupar com a estética, fonte, cores… apenas nas funcionalidades. Junto dele também fizemos um "User-flow" que acabou mudando muito depois (kkkkk).

Primeiras ideias de protótipos de baixa fidelidade.
Protótipo de baixa fidelidade final.
User-flow.

Depois da prototipação em baixa fidelidade, vem a em média fidelidade (mid-fi), na qual começamos a nos preocupar onde cada componente vai se posicionar e no fluxo de telas, porém ainda sem focar na estética final do produto.

Protótipo de média fidelidade.

Por fim, chegamos no protótipo de alta fidelidade (hi-fi), na qual passamos por um processo que se chama de Style Guide, para pensarmos nas cores, fontes, referências, componentes da HIG (Human Interface Guidelines) que contêm orientações e práticas recomendadas que podem ajudar a criar uma ótima experiência para qualquer plataforma Apple, e toda a estética do App, até conseguirmos aplicar isso no protótipo e chegar a versão final antes de começar a desenvolver.

Inspirações, cores e estilo de texto do meu Style Guide.
Componentes e estilo dos botões do Style Guide.

Assumo que para uma aluna de Engenharia da computação, a parte de design foi um tanto desafiadora, mas eu amei. Aprender prática os princípios e elementos do design (tenho um Medium falando sobre se tiver interesse), entender melhor como usar o Figma (Software para prototipação, arte digital, design visual, entre outros) e chegar em um resultado tão legal como o protótipo de alta.

Algo que eu aprendi bastante durante as etapas de prototipação é que ainda tenho muito para aprender, mas em pouco tempo consegui criar algo muito legal e que me orgulho para uma pessoa que nunca tinha prototipado antes, além de ter tido uma curva de aprendizado bem alta na área para uma iniciante.

Protótipo de alta fidelidade.

Chegamos na parte mais legal do processo, pelo menos para mim hahah, que é tirar tudo isso do papel e desenvolver. Eu adorei "codar" meu primeiro App em SwiftUI, mesmo ele sendo bastante simples, consegui aprender muita coisa e apesar das frustrações durante todo o processo de desenvolvimento (que sempre acontece kkkk) o resultado final é muito gratificante, porque é muito legal ver o aplicativo funcionando como você esperava e bem parecido com o protótipo final, apesar de ter tido algumas alterações no meio.

Fiquei muito feliz com o resultado e muito animada para os próximos challenges e para os aprendizados que virão. Durante todo o processo tivemos rodadas de feedbacks com os nossos colegas e mentores, o que ajudou muito a perceber no que poderíamos melhorar. É extremamente satisfatório trabalhar com algo que lhe motiva e com pessoas que querem ajudar no seu desenvolvimento pessoal e profissional.

Minha turma da Apple Developer Academy (Tarde 24/25) no dia da entrega do challenge.

Espero que vocês tenham gostado de acompanhar o processo desse meu primeiro desafio na Academy e até os próximos! Prometo que venho compartilhar tudo com vocês :)

Referências:

https://www.apple.com/br/education/docs/CBL_Classroom_Guide_Jan_2011.pdf
https://developer.apple.com/design/human-interface-guidelines

--

--

Camila Xavier
Apple Developer Academy | UFPE

iOS Development Student @ Apple Developer Academy | Computer Engineering Undergraduate @ UFPE