Plataforma de ensino em dermatologia — cinco perfis, 586 frames

Designer solo de um LMS médico de alta complexidade (586 frames desktop) para especialização em dermatologia clínica. Estruturou cinco portais com permissões distintas (Admin, Moderador, Professor, Aluno, Aluno Free) e implementou o sistema de variáveis e tokens mais profundo do portfólio (Main/Primary 25–800 com primária #982cff, Support/Neutral, Gradient/Purple) vinculado diretamente aos componentes de domínio, complementado por um deck linear de 127 telas (Slides Admin) criado para facilitar a navegação do cliente nas revisões.

Atuação na agência Sagitta entre dezembro de 2024 e janeiro de 2025, sendo o projeto de ciclo mais recente da agência. Desenvolvido para uma instituição de pós-graduação médica para médicos em dermatologia. Embora o kit base de primitivos tenha sido herdado do repositório da Sagitta (idêntico em nós ao KAT/Safra), toda a camada de domínio em Design Desktop (motor de exames, banco de questões, flashcards espaçados, fórum clínico e trilha de auditoria) foi desenhada do zero com componentes próprios e variáveis vinculadas. Escopo exclusivo desktop; a adaptação mobile não foi iniciada antes da saída de Juan.

Arquitetura para educação médica: cinco portais com controle de permissão

📐586

telas desktop desenhadas entre cinco perfis de usuário

👥5

perfis de permissão (Admin, Moderador, Professor, Aluno, Aluno Free)

📊127

telas organizadas linearmente no Slides Admin para validação

📝39

notas técnicas em canvas detalhando regras de negócio e interação

A especialização médica em dermatologia exige muito mais do que transmissão passiva de vídeo. Médicos demandam ambientes rigorosos de prova, bancos de questões com justificativas clínicas, ferramentas de retenção por repetição espaçada e fóruns de discussão de casos clínicos. Estruturei a Mente Dermatológica em cinco superfícies de perfil independentes — cada uma com seu próprio conjunto de navegação (sideBar, navbar, dropdown para Aluno, AlunoFree, Professor, Moderador e Admin) — estabelecendo diferenciação estrutural entre consumo de conteúdo, moderação clínica e gestão acadêmica.

Profundidade de domínio: motor de provas, banco de questões e fórum de casos

O ambiente desktop contempla seis subsistemas clínicos de alta densidade:

• Motor Completo de Provas — Diversos formatos de avaliação iterados nas versões Prova 1.0.1 a 2.2 com configurações de prova personalizáveis, geração de simulados, relatórios de desempenho do aluno (Relatório da prova) e sanfonas de justificativa clínica (accordionExplicação).
• Banco de Questões MenteBank — Banco de questões médicas com CRUD administrativo completo (Novo MenteBank, Nova Questão, editarQuestão), filtros por tema e estados vazios detalhadamente desenhados (detalhesEmptyState).
• Flashcards com Repetição Espaçada — Módulo de memorização clínica estruturado com níveis de dificuldade (dificuldade, _dificuldadeBase, Flashcards 1.2/1.3) e gestão de cartões (AdicionarFlashcard) para fixação de diagnósticos dermatológicos e farmacologia.
• Fórum de Casos Clínicos — Espaço estruturado de discussão médica (Fórum/casoView, PostarCaso, cardForum, imagemForum) voltado para análise colaborativa de condutas e imagens de manifestações dermatológicas.
• Contrato Formal no Primeiro Acesso — Fluxo regulatório de aceite contratual obrigatório (primeiroAcesso → liberarAcesso 1.1/1.2 → liberarAcesso/Contrato → Contrato), atendendo a requisitos legais levantados pelo cliente.
• Trilha de Auditoria e Back Office — Telas de registro e auditoria (Auditoria) para monitoramento de tentativas de prova e alterações de notas por professores, amparadas por uma matriz de mais de 40 pop-ups de confirmação e exclusão.

Arquitetura de tokens: variáveis vinculadas em componentes de domínio

A Mente Dermatológica traz a evidência mais consistente de design tokens deste portfólio. Em vez de manter variáveis soltas sem uso, os tokens estão amarrados diretamente aos componentes de domínio: Button, cardCurso, flashcard e cardQuestão possuem variáveis nativas do Figma conectadas às suas camadas. A arquitetura define famílias autorais como Main/Primary/25→800 (com a primária real Main/Primary/600 - P em #982cff), Main/Terciary/400 (#4ec5ff), Support/Neutral/50–500 e Gradient/Purple, aplicadas de forma consistente sobre primitivos de alerta e neutros de apoio.

Empatia com stakeholders: o deck linear de 127 telas em Slides Admin

Durante as validações iniciais, o cliente se perdeu repetidamente ao tentar navegar pelo painel administrativo através dos botões interativos do protótipo. Identificando essa dificuldade cognitiva de navegação, extraí e reorganizei todo o back office em uma página dedicada de 127 frames chamada Slides Admin. Ao estruturar cada tela em uma sequência linear estrita, o cliente pôde validar todas as permissões e funcionalidades administrativas apenas avançando as setas do teclado. O feedback tornou-se imediatamente focado, positivo e resolutivo. Refletindo as 119 telas desdobradas do Pro Personal, isso evidencia o hábito constante de diagnosticar atritos e adaptar a entrega para quem está do outro lado.

Referência comprovada em e-learning especializado

A Mente Dermatológica, combinada ao Jobs/Academy.bet, consolida a educação especializada como uma competência madura de domínio. Enquanto o Academy.bet comprovou agilidade em design em dupla em escala web e mobile, a Mente Dermatológica demonstra autonomia total em um segmento clínico altamente regulado. Respaldada por aprovações gravadas e 39 anotações técnicas para desenvolvimento, permanece como referência de design de sistemas e complexidade funcional.

Evidência

Aprovado formalmente pelo cliente por meio de revisões em vídeo gravadas no Loom e duas reuniões de alinhamento em janeiro de 2025. Entregue à engenharia antes da saída de Juan da Sagitta; o lançamento público em produção não foi verificado. A reestruturação de 127 telas administrativas no Slides Admin eliminou a desorientação do cliente nas apresentações, demonstrando uma postura prática e adaptável na condução de stakeholders.