Ir para o guia de uso
Localization Designpor Owl-Listener

Localization Design Skill.

Prepare a interface para diferenças de idioma, não apenas para strings traduzidas.

  • Sistemas de design
  • Localização
Revisão da fonte · Localization DesignSKILL.md
Tarefa Sistemas de design Produz • Uma auditoria de componentes quanto a expansão, truncamento e dimensionamento flexível. • Uma especificação RTL que distingue elementos espelhados de elementos preservados. • Uma lista de verificação de formatos de localidade e testes de escrita. Antes de começar Exige texto na localidade de destino, fontes e revisão linguística ou cultural adequada; nenhuma plataforma de localização automática está incluída.
Resumo editorial · fonte revisada em 2026-10-07 · não é um exemplo gerado

01 Funcionalidades

Projete interfaces para além de um idioma

Um guia de UI com foco em localização, que abrange layouts de texto flexíveis, direcionalidade, escritas não latinas e convenções de localidade.

Fluxo de trabalho baseado na fonteNão é um benchmark de execução

A abordagem de trabalho

Localization Design trata do que quebra quando um layout sai do idioma original: rótulos mais longos, outra direção de escrita, tipografia específica de cada escrita e formatos locais de datas, números, valores monetários ou endereços. Recomenda contêineres flexíveis, propriedades lógicas CSS e testes com texto longo e com uma localidade RTL.

Também distingue tradução de revisão cultural. Um layout espelhado tecnicamente ainda pode usar símbolos ou suposições inadequados. A fonte inclui generalizações culturais ilustrativas e faixas de expansão; elas devem motivar revisão no mercado local, não virar regras universais sobre todos os usuários de um país.

Entregas esperadas

  • Uma auditoria de componentes quanto a expansão, truncamento e dimensionamento flexível.
  • Uma especificação RTL que distingue elementos espelhados de elementos preservados.
  • Uma lista de verificação de formatos de localidade e testes de escrita.
Ver o briefing de exemplo

Do briefing à revisão

  1. 01
    Teste a expansão de texto

    Use strings expandidas ou pseudolocalizadas para expor larguras fixas e rótulos de navegação cortados antes de existirem as traduções finais.

  2. 02
    Mapeie o comportamento direcional

    Substitua suposições físicas de esquerda/direita por semântica de início/fim. Decida quais ícones são espelhados e quais marcas, números ou mídias permanecem inalterados.

  3. 03
    Revise o significado na localidade

    Verifique fontes, formatos, estrutura de endereços e imagens culturalmente sensíveis com especialistas adequados no idioma ou no mercado.

02 Quando usar

Quando usar

Exige texto na localidade de destino, fontes e revisão linguística ou cultural adequada; nenhuma plataforma de localização automática está incluída.

Bom encaixe

  • Antes do lançamento multilíngueÚtil para detectar problemas de layout enquanto os componentes ainda podem ser alterados de forma consistente.
  • Prontidão do sistema de designAcrescenta requisitos de localização à orientação dos componentes, em vez de corrigir cada tela traduzida separadamente.

Limites a verificar

  • Não é um serviço de traduçãoNão produz nem certifica o texto localizado final.
  • Sem certificação culturalExemplos genéricos não substituem a revisão por pessoas que conheçam o mercado e o público específicos.

Traga estes insumos

  • Localidades de destinoListe as escritas, direções de escrita e convenções de formatação necessárias.
  • Amostras de componentesForneça navegação, formulários, cards, botões e visualizações de dados densas.
  • Fontes e conteúdoInclua strings reais ou pseudolocalizadas e fontes de fallback aprovadas.

03 Decisões importantes

Decisões que importam

  1. Espelhe com critério

    Setas direcionais e o fluxo do layout podem ser invertidos; marcas e notação matemática não devem ser espelhadas sem critério.

  2. Localize o sistema

    Nomes semânticos de tokens e dimensionamento flexível de componentes fazem com que futuras localidades dependam menos de ajustes pontuais.

04 Exemplo de briefing

Experimente um briefing focado

O briefing de exemplo abaixo não foi testado. Confira a configuração da skill antes de usá-lo.

Revise a configuração

Use o método de instalação documentado do repositório e mantenha todos os arquivos complementares referenciados. Este item descreve um método de design focado, não um aplicativo executável.

Arquivo-fonte original
https://github.com/Owl-Listener/designer-skills/blob/9a6930cf84a822eb458624bd11c61aac5bbdf224/design-systems/skills/localization-design/SKILL.md

Exige texto na localidade de destino, fontes e revisão linguística ou cultural adequada; nenhuma plataforma de localização automática está incluída.

Comece com uma entrega

Adapte o escopo, o material de origem e as restrições deste briefing antes de executar a skill.

Briefing de exemplo
Use localization-design para auditar nossas configurações de conta em alemão e árabe. Revise a expansão de rótulos, o espaçamento lógico, ícones direcionais, números de conta com direção mista e formatos de data. Produza alterações por componente e uma matriz de testes. Sinalize suposições culturais para revisão humana, em vez de tratar estereótipos de países como regras.

Inspecione o resultado

Compare a saída real com estes critérios observáveis.

  • Rótulos longos continuam legíveis, sem corte por largura fixa.
  • O comportamento RTL distingue controles direcionais de ativos não direcionais.
  • Datas e números usam formatação adequada à localidade, em vez de reorganização de strings.

OpenDesign oferece um espaço de trabalho local de design para agentes de código. Esta listagem não significa que a skill esteja incluída nem que suas ferramentas externas, credenciais e dependências de software estejam incluídas.

05 Fonte e licença

Fonte e licença

Esta página descreve a revisão fixada da fonte vinculada abaixo. O comportamento e os requisitos upstream podem mudar.

Proprietário da fonte
Owl-Listener
Licença
MIT
Versão revisada
2026-10-07 · 9a6930cf84a8
Resumo editorial da fonte
Um guia de UI com foco em localização, que abrange layouts de texto flexíveis, direcionalidade, escritas não latinas e convenções de localidade.

Resumo original de OpenDesign, baseado na fonte vinculada. As estrelas do repositório são um sinal de popularidade datado, não indicam uso da skill nem nota de qualidade.

06 Perguntas antes de começar

Perguntas antes de começar

RTL significa espelhar todas as imagens?

Não. A fonte indica exceções, como logotipos, números e muitas imagens. Avalie o significado antes de espelhar.

A pseudolocalização pode substituir o controle de qualidade da tradução?

Não. Ela pode revelar fragilidades de layout e de tratamento de caracteres antes de as traduções reais chegarem, mas não avalia naturalidade nem adequação cultural.

Os percentuais de expansão devem ser tratados como exatos?

Não. São uma orientação aproximada para testes de estresse. Testes com texto e layout reais são mais confiáveis.

OpenDesign

Abra espaço para a próxima iteração de design.

Mantenha seu briefing, o material de origem e o trabalho de design juntos em um espaço de trabalho local. Confira a configuração da própria skill antes de adicioná-la ao seu fluxo de trabalho.

Arquivo-fonte original
https://github.com/Owl-Listener/designer-skills/blob/9a6930cf84a822eb458624bd11c61aac5bbdf224/design-systems/skills/localization-design/SKILL.md