Se você visitou a página inicial do iTutor este mês, talvez tenha notado algo: ela não é mais a mesma. O índigo vibrante e o ciano se foram. Em seu lugar, papel quente, tinta nítida e um traço confiante de esmeralda. Isso não é apenas uma nova pintura. É uma nova linguagem de design, e ela está se espalhando.
Redesenhos costumam ser anunciados com adjetivos. Preferimos mostrar as decisões reais, porque o raciocínio é a parte interessante. Ao lado do novo Plano de Estudos e do modo de voz, este é o terceiro pilar da nossa atualização de julho.
Papel e Esmeralda
Chamamos o novo sistema de Papel e Esmeralda. A base de cada página é um tom de papel quente em vez de um branco estéril, porque você passa horas aqui, e o papel é mais suave para os olhos do que o brilho ofuscante. A tinta é quem fala. E existe exatamente uma cor de destaque, um verde esmeralda, reservada para o que realmente importa: a ação que você deve tomar, a sessão que você deve abrir, a palavra sendo falada.
A tipografia segue a mesma disciplina. Uma grotesca confiante para os títulos, uma workhorse discreta para o texto de corpo e uma pequena voz monoespaçada para rótulos, marcações de tempo e dados. Três papéis, usados de forma consistente, para que seu olhar sempre saiba que tipo de conteúdo está lendo.
O marca-texto conta a história
Toda linguagem de design precisa de um movimento de assinatura, e o nosso é o marca-texto. Na nova página inicial, as anotações manuscritas de um estudante aparecem na página, um marca-texto esmeralda passa sobre uma linha, e essa linha exata se destaca e se transforma em um flashcard, um questionário, uma pergunta de prova, um plano de estudos. Enquanto você rola a página, a sequência se repete em matérias reais e escritas reais, incluindo o árabe, escrito da direita para a esquerda.
Não escolhemos esse recurso porque é bonito. Ele é a promessa inteira do produto desenhada como uma imagem: o iTutor trabalha a partir do seu material. As palavras no flashcard são as palavras da sua página. Nenhum outro recurso que testamos disse isso de forma mais honesta.
Menos ruído, mais rapidez para encontrar as coisas
O design antigo era divertido, e nós adorávamos, mas competia consigo mesmo. Cinco cores de destaque significavam cinco coisas disputando sua atenção em cada tela. A nova linguagem faz uma troca simples: menos vozes, hierarquia mais clara. Títulos maiores e mais calmos. Um único botão verde por tela que é obviamente o próximo passo. Rótulos de navegação mais curtos e diretos.
O ganho prático é velocidade. Não a velocidade de carregamento da página (embora também nos importemos com isso), mas a velocidade de encontrar as coisas: o botão que você quer é o verde, o rótulo que você procura está onde você espera, e nada decorativo finge ser importante.
Onde você vai ver isso a seguir
A página inicial já veste a nova linguagem hoje, incluindo o destaque em marca-texto acionado pela rolagem, e ela se adapta aos doze idiomas do iTutor com suporte completo à direita para a esquerda. O resto do site segue página por página, e este blog já começou a se vestir para a ocasião: todos os elementos visuais deste artigo, e do restante da série de julho, foram desenhados em Papel e Esmeralda.
Por baixo de tudo, nada mudou: suas matérias, materiais, planos e progresso estão exatamente onde você os deixou. Só a roupa é nova.