Theodoor

Theodoor é um app mobile para controlar um sistema acessível de automação de portas inteligentes.

Meu trabalho focou em tornar estados da porta, feedback do sistema, erros e controles claros o suficiente para que usuários pudessem confiar no que estava acontecendo no mundo físico.

Como o app controlava uma porta real, motion, acessibilidade e feedback não eram decorativos. Eram parte do modelo de interação central.

Desenhando uma interface mobile para um sistema físico onde feedback, confiança e acessibilidade eram centrais para a experiência.

Trabalhei em UX mobile, UI, fundações de design system, motion, prototipação e considerações de acessibilidade.

1. Mapear estados da porta e ações do usuário
2. Desenhar feedback para abertura, fechamento, espera, sucesso e estados de erro
3. Criar explorações de motion para comunicar comportamento do sistema
4. Usar protótipos assistidos por IA e baseados em código para testar ideias de interação mais rápido
5. Construir fundações de UI reutilizáveis para a experiência mobile

A interface precisava explicar o que estava acontecendo no mundo físico.

1. O app controlava um objeto físico, então usuários precisavam saber se um comando foi recebido, estava em progresso, completo ou falhou.
2. A experiência precisava apoiar contextos de acessibilidade onde o feedback não podia depender só de UI visual.
3. Telas estáticas não eram suficientes. A parte importante era como o sistema se comportava ao longo do tempo.

Telas estáticas não eram suficientes para discutir essa experiência.

Construí um simulador de protótipo assistido por IA para tornar edge cases, timing e transições de sistema visíveis antes do desenvolvimento. O simulador cobria cenários como Happy Path, Casa Vazia, Porta Trancada, Abertura Parcial com Obstrução, Proteção contra Pinçamento, Caminho Bloqueado, Alerta de Bateria e Offline/Fora de Alcance.

Um blueprint no Figma traduzido a partir do protótipo ajudou a conectar a simulação ao handoff final de design.

O simulador tornou edge cases visíveis antes do desenvolvimento, incluindo cenários de offline, obstrução, proteção contra pinçamento e caminho bloqueado.

Decisões de design que tornaram o sistema físico mais claro, seguro e confiável.

Motion foi usado para explicar comportamento do sistema, não só para deixar o app com cara mais polida.

Para estados como escaneamento, pareamento, casa vazia, espera, sucesso e falha, telas estáticas não eram suficientes. A animação precisava mostrar que o sistema estava buscando, processando ou esperando a próxima ação do usuário.

Usei workflows assistidos por IA e baseados em código para acelerar a produção de motion, refinar o timing das animações e preparar outputs Lottie prontos para implementação.

O objetivo não era automatizar o gosto estético. Era reduzir trabalho de produção repetitivo para que eu pudesse focar em clareza, timing e como o motion apoiava o feedback do sistema.

Organizei fundações de UI reutilizáveis para o app: botões, cards, rótulos de status, estados da porta, padrões de feedback, navegação, estados vazios, fluxos de configuração, erros e estados de recuperação.

Isso ajudou a manter a experiência consistente entre uso normal, configuração, ajustes, estados de motion e edge cases.

Padrões de UI reutilizáveis ajudaram o app a lidar com configuração, uso normal, ajustes, erros e estados de recuperação de forma consistente.

• Tornou o status da porta e o feedback do sistema mais fáceis de entender
• Criou padrões de interação mais claros para estados de sucesso, espera, erro e recuperação
• Apoiou acessibilidade através de feedback multimodal em vez de comunicação só visual
• Ajudou o time a discutir edge cases físico-digitais antes da implementação
• Construiu fundações de UI reutilizáveis para a experiência mobile
• Preparou assets de motion para implementação através de output Lottie