desenvolvi o cosmodex em cinco dias durante um desafio de fundamentos de UIKit na Apple Developer Academy. o projeto foi uma oportunidade de aprender UIKit de forma programática, evitando o uso de Storyboards, e de compreender os fundamentos do posicionamento de elementos na tela, navegação entre Views e manipulação de dados básicos (neste caso, a pontuação do quiz).
como adoro tudo relacionado à astronomia, tive a ideia de criar um jogo de trivia simples com a temática do universo. ele adere estritamente à arquitetura MVC, garantindo que todo o layout e gerenciamento do ciclo de vida das Views fossem tratados explicitamente via código.
o cosmodex me ajudou a aprender muito sobre o uso de Auto Layout para construir telas responsivas programaticamente. foi também uma ótima oportunidade para aprimorar minhas habilidades na separação da lógica da interface do usuário, o que pode ser desafiador às vezes. além disso, foi uma maneira de explorar alguns princípios de design imersivo, como a implementação de microinterações (como a pequena animação dos botões ao iniciar) e feedback háptico para realçar a estética do tema escuro.
adorei usar o Icon Composer para criar o ícone — você notou que as estrelinhas e galáxias no ícone são todas caracteres ASCII? 😄
some fonts used in this project are proprietary and may not display correctly if they are not installed on your system.
rationale
considerando a natureza do cosmodex como um exercício dos conceitos básicos de UIKit e também a temática escolhida - um quiz sobre o universo - optei por um design minimalista e escuro. isso não apenas complementa o tema espacial, mas tornou o processo de design bastante simples e efetivo.
a paleta de cores é composta por preto, branco e um cinza intermediário, com verde e vermelho para indicar respostas corretas e incorretas, respectivamente. a tipografia escolhida, SF Pro Display, é limpa e moderna, além de ser nativa das plataformas Apple, garantindo facilidade de uso e legibilidade.
tech stack
UIKit
UI programática
MVC
arquitetura
Auto Layout
design responsivo
Icon Composer
criação de assets
code snippets
Implementação da ExplanationViewController
swift
class ExplanationViewController: UIViewController { var explanationView = ExplanationView() var feedbackText: String = "" var explanationText: String = "" var onNext: (() -> Void)? override func loadView(){ self.view = explanationView } override func viewDidLoad() { super.viewDidLoad() explanationView.setFeedback(feedbackText) explanationView.setExplanation(explanationText) explanationView.nextButton.addTarget(self, action: #selector(nextTapped), for: .touchUpInside) } @objc func nextTapped() { triggerHapticFeedback() onNext?() }}