Extensão Zelf v2.0.57: Reformulação de UX, Design Compacto e Fluxo de Envio Aprimorado

Resumo:

78 arquivos alterados na Extensão Zelf: uma ampla renovação de UX e design, não um único recurso.
Sistema de design compacto: Novas propriedades CSS customizadas --zns-font-scale e --zns-space-scale permitem que a UI escale. 60+ componentes usam dimensionamento responsivo; modo tela cheia é compacto, popup mantém conforto. Tudo cabe em telas padrão de laptop sem scroll infinito.
Home e gerenciamento de conta: Ações da carteira movidas de uma grid 3x2 superdimensionada para um layout agrupado compacto de 3 colunas. Ações divididas em ZelfProof (Download, Mnemônicos, Zelf Link) e Apps (Carteira, Zelf Keys, Auth). Labels truncados ganham tooltips CSS instantâneos ao hover. Botão Gerenciar Tags redimensionado para ~80% para melhor proporção.
Fluxo de envio: Preview de Endereço Encontrado agora é uma linha compacta (avatar, nome, endereço truncado). Endereços recentes não duplicam mais o card de Endereço Encontrado. Clique para desselecionar um endereço recente; clique novamente para limpar. Caminho mais suave da seleção de endereço à confirmação.
Fluxo de recebimento: Novo modal Saiba Mais sobre riscos com cards em carrossel para segurança de tokens (ex.: "Não envie ETH para um endereço Solana"). Animações de slide entre telas de recebimento.
Segurança e onboarding: Correção de dark mode para opções de segurança usarem cores corretas do tema. Detecção de Senha vs PIN mostra o prompt correto de desbloqueio. Erro de rosto não centralizado mostra mensagem amigável. Tecla Enter aciona verificação de PIN no último dígito.
13 idiomas: Strings novas e atualizadas para en, es, fr, ja, ko, zh, ar, pt-BR, hi, ur, th, ru, ph — labels compactos, modal de riscos, texto de PIN, erros.

Sistema de Design Compacto

Introduzimos tokens de design para que a extensão se adapte a diferentes contextos sem duplicar lógica de layout:

--zns-font-scale e --zns-space-scale controlam tipografia e espaçamento. No modo tela cheia, usamos valores compactos para que toda a UI caiba em um laptop típico sem scroll. No modo popup, mantemos dimensionamento confortável para ações rápidas.
60+ componentes foram migrados para usar esses tokens. Botões, cards, inputs e listas agora escalam consistentemente. O resultado: uma codebase, duas experiências ajustadas (popup vs tela cheia).

Se você usa a Zelf em tela cheia para portfólio e fluxos de envio, deve notar mais conteúdo acima da dobra e menos desordem.

Home: Ações de Conta e Carteira

A tela inicial é onde você escolhe entre Carteira, Zelf Keys, Auth e ações ZelfProof. Antes, ações viviam em uma grid 3x2 grande que consumia muito espaço.

Novo layout:

Layout agrupado de 3 colunas em vez de 3x2. Ações agrupadas por propósito.
Grupo ZelfProof: Download, Mnemônicos, Zelf Link — tudo ligado à sua identidade e backup.
Grupo Apps: Carteira, Zelf Keys, Auth — suas ferramentas diárias.
Labels muito longos são truncados, com tooltips CSS instantâneos ao hover para que você ainda veja o texto completo.
Botão Gerenciar Tags foi reduzido para cerca de 80% do tamanho para melhor equilíbrio visual com as demais ações.

Você obtém as mesmas ações em menos espaço e com agrupamento mais claro.

Transação de Envio: Seleção de Endereço e Confirmação

Enviar tokens é um dos fluxos mais usados. Ajustamos de ponta a ponta:

Preview de Endereço Encontrado: Quando você digita um nome ou cola um endereço e resolvemos, o preview agora é uma linha compacta: avatar, nome e endereço truncado. Chega de card superdimensionado consumindo a tela.
Endereços recentes são listados separadamente e não duplicam mais o card de Endereço Encontrado. Então você não vê o mesmo destinatário duas vezes.
Comportamento de desseleção: Clique em um endereço recente para selecioná-lo. Clique novamente para desselecionar. Mais um clique limpa a seleção para digitar um novo destinatário. Modelo mental mais claro.
Fluxo: Da seleção de endereço até valor e confirmação, transições e layout estão mais suaves para completar envios mais rápido.

Recebimento: Riscos e Educação

Receber tokens com segurança significa evitar envios para rede errada e tokens de golpe. Adicionamos:

Ponto de entrada Saiba Mais que abre um modal de riscos com carrossel de dicas curtas — ex.: "Não envie ETH para um endereço Solana," e outros avisos específicos por blockchain.
Animações de slide entre a tela principal de recebimento e o modal (e entre cards do carrossel). O fluxo é mais polido e encoraja uma leitura rápida das dicas.

Polimento de Segurança e Onboarding

Dark mode: Opções de segurança e desbloqueio agora respeitam o tema ativo. Sem mais cores incompatíveis no dark mode.
Senha vs PIN: A extensão detecta se sua carteira é desbloqueada com senha ou PIN. A tela de desbloqueio mostra o prompt correto (ex.: "Digite o PIN" vs "Digite a senha") para não haver confusão.
Verificação facial: Se seu rosto não está centralizado no quadro, a mensagem de erro é amigável em vez de técnica.
Entrada de PIN: No último dígito do seu PIN, pressionar Enter submete o PIN imediatamente — sem necessidade de tocar em um botão separado.

Pequenos toques, mas que reduzem fricção e apoiam o uso correto.

Suporte a 13 Idiomas

Expandimos e atualizamos i18n para que a nova UI seja totalmente localizada:

Idiomas: Inglês, Espanhol, Francês, Japonês, Coreano, Chinês, Árabe, Português (Brasil), Hindi, Urdu, Tailandês, Russo, Filipino.
Chaves novas/atualizadas cobrem: labels compactos, texto do modal de riscos, texto de desbloqueio por PIN, mensagens de erro facial e outras strings introduzidas nesta release.

Se você usa a Zelf em um locale não-inglês, deve ver traduções consistentes no novo layout compacto, fluxo de envio e fluxo de recebimento.

Resumo

v2.0.57 é uma reformulação de UX: tokens de design compacto, tela inicial reorganizada, fluxo de envio mais limpo com manuseio inteligente de endereços, fluxo de recebimento mais seguro com carrossel de riscos, e correções de segurança/onboarding em modo claro e escuro. Mais 13 idiomas suportados nativamente.

Atualize para a versão mais recente pelo Zelf e experimente o novo layout tanto em popup quanto em tela cheia — tudo deve parecer mais compacto, mais claro e mais fácil de usar.