Aula de hoje
Linha e pressão em pele artificial
Em andamento
UI kit · Área de membros
The VOID · Manual de marca · Modelo de canal
O kit da área de membros da The VOID Tattoo Academy: cada tela, cada componente e cada estado vazio, prontos para quem vai construir a plataforma. A formação acontece no estúdio; a área de membros organiza, registra e celebra o que acontece lá.
A formação acontece no estúdio; a área de membros organiza, registra e celebra o que acontece lá.
Fotos: acervo The VOID
Em um minuto
data-estacao, pela formação ativa. Ex-aluno sem formação ativa navega como VOIDERS.Tela inicial
A tela tira uma dúvida só: o que eu faço agora? Um próximo passo com um botão, a aula do dia, o último feedback com o nome do professor e o Anel pequeno à direita.
START · RITUAL DO TRAÇO
O Ritual do Traço foi validado. Envie a foto da sua prática em pele artificial; o professor devolve um ponto forte e um ajuste.
Enviar meu trabalhoSua trilha
Aula de hoje
Em andamento
Último feedback
Ponto forte: linha contínua, sem tremor no contorno.
Ver o feedback completoOnde estou
O Mapa da Trilha com "você está aqui" e três barras, uma por pilar, no grafismo da formação. A barra só avança quando o professor valida a prática; o texto ao lado diz quantas já foram validadas.
Formação Start · turma {código_de_turma}
No fim do módulo, você faz linha contínua e de espessura constante em pele artificial. Pele artificial: superfície sintética usada para treinar antes da pele de verdade.
Validada pelo professor
Em andamento
No fim do módulo, você monta e desmonta a bancada com o protocolo: luva nitrílica, filme plástico, material de uso único e descarte.
Spec 6.19
O Mapa da Trilha pessoal. A formação concluída fica cheia, na cor da formação e com grão; os marcos da formação em curso são marcas no perímetro. No Start: Ritual do Traço, Primeira Pele e Formatura com Pele.
validado: true, registrado por professor ou coordenação. Qualquer outro valor fica tracejado.Este círculo começa a se preencher no seu primeiro marco.
Ver os marcos do StartA Primeira Pele chegou como "sim" e com a aula assistida: o ponto não enche. Só true, gravado na validação, enche.
O Start fica cheio, com grão. O Master mostra só o círculo em curso: os marcos dele ainda não estão definidos.
Ex-aluno sem formação ativa: os círculos concluídos ficam cheios e o próximo fica em contorno, sem cobrança.
VForms.render(el, "anel", {
atual: "start",
marcos: [
{ nome: "Ritual do Traço", angulo: 200, validado: true }, // enche
{ nome: "Primeira Pele", angulo: 250, validado: "sim" }, // não enche
{ nome: "Formatura com Pele", angulo: 300, validado: false } // tracejado
]
});
[P 17] Marcos do Master e do Pro e selos de formação concluída no perfil. Até a escola definir, o anel do Master e do Pro mostra só o círculo em curso.
Quatro estados
Raio zero, Bastidor, Marcador de Estação, título, duração e tipo. O estado vem sempre com ícone e palavra; só o validado pelo professor ganha a cor de sucesso e o fio da formação.
Start
Não iniciada
Start
Em andamento
Start
Concluída
Start
Validada pelo professor
| Estado | Ícone Lucide | Cor no escuro | Cor no claro |
|---|---|---|---|
| Não iniciada | circle-dashed | Pó | Ardósia |
| Em andamento | circle-dot | Tela | Sala |
| Concluída | check | Tela | Sala |
| Validada pelo professor | circle-check | Musgo Luz | Musgo |
Portfólio pessoal
Uma linha do tempo de fotogramas datados. O primeiro é o do Ritual do Traço. A comparação entre o primeiro traço e o trabalho atual é só para o aluno.
Só você vê esta comparação
Professor e aluno
O aluno envia a foto e diz o que quer que olhem. O professor responde sempre em par: um ponto forte e um ajuste, com o fio da formação. Só o aluno vê, a não ser que ele escolha compartilhar.
O que você quer que olhem: a curva do contorno, que eu sinto que engrossa no fim.
{nome_do_professor}Professor da formação · {dd/mm}
Ponto forte
Linha contínua, sem tremor no contorno. A pressão ficou igual do começo ao fim da reta.
Um ajuste
Na curva, mantenha a mesma velocidade da mão: quando ela desacelera, a linha engrossa. Repita a curva cinco vezes antes da próxima aula.
Ritos de passagem
Cartão grande em preto e branco, com Revelação no momento da validação: o nome do rito, a frase do rito na voz em off e a data. O marco futuro tem data real e contorno tracejado.
Validado em {dd/mm/aaaa}
Todo mundo começa com um traço.
Aqui, ele tem nome, coragem e história.
Pendente · {data_do_rito}
Você nunca esquece sua primeira pele.
Aqui, ela é celebrada.
Pendente · {data_do_rito}
Descubra sua identidade artística.
O primeiro trabalho autoral entra em Meu Traço.
Pendente · {data_do_rito}
Você não sai apenas com um certificado.
Sai com um novo capítulo na pele.
[P 6] Ritos novos (Pergunta do Vazio, Primeiro Toque, Convite ao Traço, Passagem de Trilha, padrinho de turma) e o registro do mural do Ritual do Traço não entram na plataforma antes da aprovação.
Turma e ex-alunos
Publicações da turma e de ex-alunos. Quem pede olhar diz o que quer que olhem. Nenhuma contagem pública de curtidas; ex-aluno mentor leva a etiqueta "mentor".
Semana
Lista da semana, com um botão "Confirmar presença" por item e lembrete pelo WhatsApp na véspera. Data e horário em Numeral de Data, nunca em voz em off.
Terça{dd/mm}
Sábado{dd/mm}
Convite{dd/mm}
Consulta
Gravações dos The VOID Talks, materiais de apoio e glossário. Todo vídeo vem com capítulos e transcrição; todo termo técnico, com uma frase que explica.
The VOID Talks · gravação
A transcrição completa e revisada da gravação fica aqui, em texto, para ler, buscar e copiar.
Materiais de apoio
Cada material entra aqui só depois de confirmado pela escola, com o nome que ela der.
Atenção: lista a confirmar [P 7]
Glossário
Suporte
Formulário curto por assunto, com o prazo de resposta e o nome de quem responde na própria tela. Nunca "abrir chamado".
{{A_CONFIRMAR}} Nomes e prazos reais de resposta por assunto. A tela só promete o prazo que a equipe cumpre.
Dados e consentimentos
Dados, certificados e consentimentos de imagem editáveis, um por finalidade. Os selos simples das formações concluídas são concedidos só na Formatura com Pele.
Uma autorização para cada uso. Você muda quando quiser.
[P 20] Termo de imagem por finalidade e cessão da arte do aluno, com validação de advogado.
Spec 12.4
O espaço em branco é o lugar onde algo vai acontecer, nunca culpa, falta ou atraso. Esfera de 96 a 160 px; duas linhas, a primeira nomeia o vazio e a segunda convida; no máximo um botão.
A4 · Modo Leitura
Impresso em A4, numa folha: a trilha com a formação cheia, o trabalho final, o selo, as assinaturas, a frase de curso livre e o código de turma. Nunca número de aluno, que revelaria volume.
START · OUT/26 · SEMANA, ainda em validação.The VOID Tattoo Academy · São Paulo · Brazil
Certificado de Passagem
{Nome do aluno}
concluiu a formação The VOID Start na The VOID Tattoo Academy, escola de tatuagem na Vila Madalena, em São Paulo.
Sai com um novo capítulo na pele.
Trilha da The VOID: Start concluído.
Trabalho final. Foto: acervo The VOID
Formatura com Pele{dd/mm/aaaa}
TurmaSTART · OUT/26 · SEMANA
{nome_do_professor}Professor da formação
{nome_da_coordenação}Coordenação
A The VOID oferece formação livre em tatuagem. Ao concluir, você recebe o certificado de conclusão da escola. Curso livre não depende de autorização do MEC e não equivale a curso técnico ou superior.
Tattoo Academy® 2025São PauloBrazilPreencha o vazio
[P 17] [P 20] [P 13] Formato do código de turma; frase de curso livre com validação de advogado; nomes de quem assina.
Para quem constrói
O que a plataforma precisa cumprir, em qualquer tecnologia. Cada linha sai da especificação do sistema.
| Tema | Regra | Spec |
|---|---|---|
| Campo | Sala por padrão, Modo Leitura por escolha do aluno, guardada no perfil. Nunca segue o tema do aparelho; o body sempre declara o fundo. | 3.6 |
| Tema | data-estacao da formação ativa (start, master, pro); ex-aluno sem formação ativa em voiders. A palavra de código nunca aparece na tela. | 3.5 |
| Estados | Ícone Lucide e palavra em todo estado: Validado, Atenção, Não deu certo, Para saber. Cor sozinha não informa. | 3.1, L3 |
| Toque e foco | Alvo de 44 por 44 px no mínimo; contorno de foco de 2 px Areia (Sala no claro), afastado 3 px. | 7.3, L3 |
| Forma | Só retângulo de raio zero e círculo. Sem sombra; elevação por tom (Sala, Bastidor, Coxia). | L7 |
| Progresso | Contra si mesmo. Nada de placar entre alunos, prêmio por acesso, troca de recompensa virtual, prazo regressivo para concluir, nota ou frequência visível a outros. | 12.4 |
| Imagem | Trabalho do aluno só aparece para outros com consentimento dele. Divulgação só com conta de demonstração. | 8.1, 12.4 |
| Movimento | Revelação de 900 ms no marco validado e assentamento de 1.200 ms no Anel; com movimento reduzido, aparece direto. | 6.17, 7.4 |
| Espera e erro | Esfera parada com a frase do que acontece, depois de 1 s de espera; sem spinner e sem pulso. Erro com "Não deu certo", o que fazer e um botão "Tentar de novo". | 3.1, 6.2, 7.4 |
| Avisos | Uma ideia em até 90 caracteres, "Novo" escrito em palavra, nunca culpa nem urgência. E-mail da conta assinado por pessoa real. | 3.1, 12.4, 12.5 |
| Pausa | Estado de informação com o nome de quem resolve; sem valor nem atraso na tela; nunca no canal do feedback, da trilha ou da turma. | 3.1, 12.4 |
| Voz | Mentor que acompanha. Voz em off só na palavra que sente, nunca em botão, data, número ou instrução. Sem emoji na plataforma. | 4.6, 9.3 |
Parte 2
Fluxos e estados do sistema
As telas entre os componentes: a aula aberta, o envio do trabalho, a entrada, o que aparece quando algo demora ou falha, os avisos, a pausa do acesso e a passagem para os VOIDERS. Os textos são modelo; a plataforma continua {{A_CONFIRMAR}}.
Aula aberta
A tela que abre quando o aluno toca num Cartão de Aula. Diz numa frase o que ele vai conseguir fazer, mostra o vídeo de apoio quando a aula tem um, com capítulos, legenda e transcrição, e termina num único próximo passo: enviar o trabalho para o professor.
StartTécnica e Experiência
Em andamento
Na curva, a mão mantém a mesma velocidade da reta.
{mm:ss}Antes da primeira linha, apoie a lateral da mão na bancada. É esse apoio que deixa o traço firme.
{mm:ss}Na reta, a pressão fica igual do começo ao fim. Na curva, a mão mantém a mesma velocidade: quando ela desacelera, a linha engrossa.
Trecho ilustrativo. Na plataforma, a transcrição completa e revisada fica aqui, com o mesmo texto da legenda.
No fim da aula, você faz uma linha contínua, de espessura constante, em pele artificial.
Treine a curva e envie a foto da prática. O professor devolve um ponto forte e um ajuste.
Enviar meu trabalho{{A_CONFIRMAR}} Quais aulas têm vídeo de apoio, onde ele fica hospedado e se a legenda é revisada. Aula sem vídeo usa a mesma tela sem o player: objetivo, material e o envio.
M7 · Prática
O caminho do aluno até a Prática com Feedback: uma foto, o que ele quer que olhem e a confirmação de quem vai olhar e até quando. É o botão da etapa M7, "Enviar meu trabalho para feedback".
Recebido
O feedback chega até {prazo}, aqui e nos avisos do portal. Enquanto isso, o próximo passo continua em Hoje.
{{A_CONFIRMAR}} Tamanho máximo da foto, formatos aceitos e prazo de resposta do professor. A tela só promete o prazo que a equipe cumpre.
M5 e M6 · Entrada
A porta do portal. Quem já tem conta entra com e-mail e senha. Quem acabou de se matricular chega pelo link do e-mail de boas-vindas (M5) e encontra uma tela de primeiro acesso que responde à crença da M6, "minhas mãos não vão obedecer", com um passo de cada vez.
START · PRIMEIRO DIA
A gente cuida desse passo junto com você. Três coisas antes do primeiro dia:
{{A_CONFIRMAR}} Plataforma e forma de entrada (senha, link por e-mail ou código pelo WhatsApp). Se a entrada for sem senha, o campo de senha dá lugar ao botão "Receber o link de entrada", no mesmo tom. Depois do Ritual do Traço, Hoje passa a pedir "Registrar meu primeiro traço".
Quando algo demora ou falha
O sistema também fala com a voz da casa. A Esfera, que já é a forma do vazio e do carregamento (spec 6.2), aparece no lugar do spinner; a frase diz o que está acontecendo e, no erro, o que fazer. Nunca culpa o aluno.
role="status" no carregamento; role="alert" só no erro que pede ação, com o foco no botão.Abrindo sua trilha...
Não deu certo
Sua trilha não abriu agora.
O problema é do nosso lado, não seu. Tente de novo em instantes.
Atenção: sem conexão
Você está sem internet agora.
O que já estava aberto continua aqui. Quando a conexão voltar, toque em tentar de novo.
Esta página não existe mais.
O endereço pode ter mudado. Sua trilha continua no mesmo lugar.
Voltar para HojeBotão em espera
O rótulo diz o que está acontecendo ("Enviando sua foto..."), a seta sai e o botão não fica desabilitado nem pisca.
<!-- carregando: aparece só depois de 1 s -->
<div class="m-vazio" role="status" aria-live="polite">
<div class="m-esfera m-abre" data-vforms="esfera"></div>
<p class="m-vazio-1">Abrindo sua trilha...</p>
</div>
<!-- erro que pede ação: role="alert" e foco no botão -->
<div class="m-vazio" role="alert"> ... <button class="botao">Tentar de novo</button> </div>
<!-- botão em espera: sem spinner, sem disabled -->
<button class="botao" aria-busy="true"><span>Enviando sua foto...</span></button>
No portal e por e-mail
Aviso é uma frase com um motivo para abrir. No portal, a lista do sino e o aviso que aparece na tela; por e-mail, as mensagens da conta, como criar uma senha nova. O WhatsApp segue a régua de comunicação M1 a M8.
Aviso na tela
ValidadoPrimeira Pele registrada por {nome_do_professor}.
Fica na tela até a pessoa fechar ou abrir o que ele aponta; não some sozinho.
Sua conta
Oi, {nome}.
Para criar uma senha nova, use o botão abaixo. O link vale por {validade}.
Criar senha novaSe o botão não abrir, copie este endereço: {link_senha_nova}
Se não foi você que pediu, ignore este e-mail: sua senha continua a mesma.
{nome}, secretaria · The VOID Tattoo Academy
Você recebeu este e-mail porque pediram uma senha nova para a sua conta no portal do aluno. The VOID Tattoo Academy · Rua Jericó, 217 · Vila Madalena · São Paulo. Privacidade.
Corpo em Sala com texto Cal até a aprovação do Modo Leitura no e-mail [P 2]. O padrão completo, com cabeçalho em PNG e botão em tabela, está no modelo de e-mail.
{{A_CONFIRMAR}} Quem assina os e-mails da conta (nome e cargo reais) e a validade do link. A assinatura nunca é "Equipe The VOID" sozinha.
Matrícula com pendência
Quando a matrícula tem uma pendência, o portal não cobra: avisa de forma neutra e dá o nome de uma pessoa para resolver. A conversa sobre dinheiro acontece com o financeiro, nunca no lugar do feedback, da trilha ou da turma.
info e "Para saber". Nunca Ferrugem, nunca "bloqueado", "suspenso" ou "inadimplente".Para saber
Tem um ponto da sua matrícula para acertar com o financeiro. Quem cuida disso é {nome}, que responde até {prazo}.
Falar com o financeiro{{A_CONFIRMAR}} [P 20] O que fica aberto durante a pausa, o que fica guardado e quando o acesso volta seguem a política de cancelamento, que depende de validação de advogado. Frases como "o portal volta como estava" só entram depois que a plataforma garantir isso.
M7 para M8
Quando a Formatura com Pele é validada, a formação fecha e o aluno passa a navegar como VOIDERS: o tema troca para voiders, o Anel mostra a formação cheia e o selo simples entra no perfil. A passagem celebra; o convite para o próximo passo vem depois, em mensagem própria.
validado: true. Antes disso, o tema não muda.voiders e Hoje passa a mostrar o próximo círculo, sem cobrança.VOIDERS · Formatura com Pele
Você não sai apenas com um certificado.
Sai com um novo capítulo na pele. E aqui não existem estranhos, apenas família que ainda não se conheceu.
{{A_CONFIRMAR}} [P 17] Selo de formação concluída no perfil e o que o ex-aluno mantém de acesso (Comunidade VOIDERS, gravações dos The VOID Talks, Biblioteca). A tela não promete acesso que a escola não confirmou.