O Zipic também usa controles do sistema, então por que ele parece um pouco diferente? A interface do usuário do Zipic segue rigorosamente os quatro princípios fundamentais do "Manual de Design para Todos": proximidade, alinhamento, repetição e contraste. Esses quatro princípios são simples e fáceis de entender, e representam a maneira mais simples e viável de elevar uma interface de usuário a um novo patamar. Proximidade: Elementos relacionados são agrupados. Na lista de compressão do Zipic, a miniatura, o nome do arquivo, o tamanho e a taxa de compressão de cada item são exibidos lado a lado, formando uma unidade visual; enquanto arquivos diferentes são claramente separados. Os usuários podem distinguir facilmente, à primeira vista, quais informações pertencem à mesma imagem. O painel de configurações é agrupado de forma semelhante por função — as configurações de saída são agrupadas, as configurações de qualidade são agrupadas e "caminho de saída" e "qualidade de compressão" não são misturados. Alinhamento: Todos os elementos devem estar visualmente conectados. Na barra lateral, na lista e no painel de detalhes do Zipic, todo o texto dentro do mesmo elemento está alinhado. Pode parecer um detalhe pequeno, mas se o alinhamento estiver incorreto, toda a interface parecerá pouco profissional. O parâmetro `alignment` do SwiftUI é amplamente utilizado; `.leading`, `.trailing` e `.center` devem ser selecionados de acordo com o tipo de conteúdo. Repetição: Elementos visuais consistentes permeiam todo o site. O Zipic mantém um raio de canto uniforme e todo o texto clicável usa a mesma cor. O estilo dos ícones também é consistente — todos usam os símbolos da SF ou ícones personalizados, evitando uma abordagem de combinação aleatória. Essa consistência faz com que os usuários sintam que "este é um produto completo", em vez de "uma colcha de retalhos". Contraste: Destaque as informações importantes. A taxa de compressão é o dado que mais interessa aos usuários, portanto, exiba-a com um rótulo em gradiente azul; o nome do arquivo é secundário, usando uma fonte normal; o tamanho original é ainda menos importante, usando cinza claro. Distinga claramente entre as informações primárias e secundárias, e os usuários saberão em qual opção clicar sem pensar. Esses quatro princípios parecem simples, mas dominá-los de verdade exige ajustes constantes. Minha abordagem é: depois de escrever o código, eu o executo primeiro para ver o efeito e, se achar que algo está "errado", uso esses quatro princípios para verificar. Os elementos relacionados não estão próximos o suficiente? Há algum problema de alinhamento? Os elementos repetidos são inconsistentes? Os elementos que deveriam estar destacados não estão suficientemente destacados?
Carregando detalhes do thread
Buscando os tweets originais no X para montar uma leitura limpa.
Isso normalmente leva apenas alguns segundos.



