Ir a la guía de uso
Localization Designpor Owl-Listener

Localization Design Skill.

Prepara la interfaz para las diferencias entre idiomas, no solo para cadenas traducidas.

  • Sistemas de diseño
  • Localización
Revisión de la fuente · Localization DesignSKILL.md
Tarea Sistemas de diseño Produce • Una auditoría de componentes sobre expansión, truncamiento y tamaño flexible. • Una especificación RTL que distingue los elementos que se reflejan de los que se conservan. • Una lista de verificación de formatos regionales y pruebas de escrituras. Antes de empezar Requiere texto en los idiomas de destino, fuentes y una revisión lingüística o cultural adecuada; no incluye ninguna plataforma de localización automática.
Resumen editorial · fuente revisada 2026-10-07 · no es un ejemplo generado

01 Qué hace

Diseña interfaces más allá de un solo idioma

Una guía de interfaz con enfoque en localización que cubre diseños de texto flexibles, direccionalidad, escrituras no latinas y convenciones regionales.

Flujo de trabajo basado en la fuenteNo es un benchmark de ejecución

El enfoque de trabajo

Localization Design aborda lo que se rompe cuando un diseño sale de su idioma original: etiquetas más largas, otra dirección de escritura, tipografía propia de cada escritura y formatos locales de fechas, números, moneda o direcciones. Recomienda contenedores flexibles, propiedades CSS lógicas y pruebas tanto con texto largo como con una configuración regional RTL.

También distingue la traducción de la revisión cultural. Un diseño reflejado técnicamente aún puede usar símbolos o supuestos inadecuados. La fuente incluye generalizaciones culturales ilustrativas y rangos de expansión; deben motivar una revisión en el mercado, no convertirse en reglas universales sobre todos los usuarios de un país.

Entregables esperados

  • Una auditoría de componentes sobre expansión, truncamiento y tamaño flexible.
  • Una especificación RTL que distingue los elementos que se reflejan de los que se conservan.
  • Una lista de verificación de formatos regionales y pruebas de escrituras.
Ver el brief de ejemplo

Del brief a la revisión

  1. 01
    Prueba la expansión de texto

    Usa cadenas expandidas o pseudolocalizadas para detectar anchos fijos y etiquetas de navegación recortadas antes de tener las traducciones finales.

  2. 02
    Mapea el comportamiento direccional

    Sustituye los supuestos físicos de left/right por semántica start/end. Decide qué iconos se reflejan y qué marcas, números o medios permanecen sin cambios.

  3. 03
    Revisa el significado regional

    Comprueba fuentes, formatos, estructura de direcciones e imágenes culturalmente sensibles con experiencia adecuada en el idioma o el mercado.

02 Cuándo usarlo

Cuándo usarla

Requiere texto en los idiomas de destino, fuentes y una revisión lingüística o cultural adecuada; no incluye ninguna plataforma de localización automática.

Buena opción

  • Antes del lanzamiento multilingüeÚtil para detectar problemas de diseño mientras los componentes aún pueden modificarse de forma coherente.
  • Preparación del sistema de diseñoAñade requisitos de localización a la guía de componentes en lugar de reparar cada pantalla traducida por separado.

Límites que conviene revisar

  • No es un servicio de traducciónNo produce ni certifica el texto localizado final.
  • Sin certificación culturalLos ejemplos generales no sustituyen la revisión de personas que conozcan el mercado y el público concretos.

Aporta estos datos

  • Configuraciones regionales de destinoEnumera las escrituras, direcciones de escritura y convenciones de formato necesarias.
  • Muestras de componentesProporciona navegación, formularios, tarjetas, botones y vistas de datos densas.
  • Fuentes y contenidoIncluye cadenas reales o pseudolocalizadas y fuentes alternativas aprobadas.

03 Decisiones importantes

Decisiones que importan

  1. Refleja de forma selectiva

    Las flechas direccionales y el flujo del diseño pueden invertirse; las marcas y la notación matemática no deben voltearse sin criterio.

  2. Localiza el sistema

    Los nombres semánticos de tokens y el tamaño flexible de los componentes hacen que las configuraciones regionales posteriores dependan menos de excepciones puntuales.

04 Ejemplo de brief

Prueba un brief concreto

El brief de ejemplo siguiente no se ha probado. Revisa la configuración de la skill antes de usarlo.

Revisa la configuración

Usa la vía de instalación documentada en el repositorio y conserva los archivos complementarios a los que se hace referencia. Esta entrada describe un método de diseño concreto, no una aplicación ejecutable.

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

Requiere texto en los idiomas de destino, fuentes y una revisión lingüística o cultural adecuada; no incluye ninguna plataforma de localización automática.

Empieza con un solo entregable

Adapta el alcance, el material de origen y las restricciones de este brief antes de ejecutar la skill.

Brief de ejemplo
Usa localization-design para auditar los ajustes de cuenta en alemán y árabe. Revisa la expansión de etiquetas, el espaciado lógico, los iconos direccionales, los números de cuenta con direcciones mixtas y los formatos de fecha. Produce cambios por componente y una matriz de pruebas. Señala los supuestos culturales para revisión humana en lugar de tratar los estereotipos de un país como reglas.

Inspecciona el resultado

Comprueba el resultado real con estos criterios observables.

  • Las etiquetas largas siguen siendo legibles sin recortes por ancho fijo.
  • El comportamiento RTL distingue los controles direccionales de los recursos no direccionales.
  • Las fechas y los números usan formato adaptado a la configuración regional, no reordenación de cadenas.

OpenDesign ofrece un espacio de trabajo local de diseño para agentes de programación. Este listado no significa que la skill esté incluida ni que se incluyan sus herramientas externas, credenciales o dependencias de software.

05 Fuente y licencia

Fuente y licencia

Esta página describe la revisión fijada de la fuente enlazada a continuación. El comportamiento y los requisitos originales pueden cambiar.

Propietario de la fuente
Owl-Listener
Licencia
MIT
Versión revisada
2026-10-07 · 9a6930cf84a8
Resumen editorial de la fuente
Una guía de interfaz con enfoque en localización que cubre diseños de texto flexibles, direccionalidad, escrituras no latinas y convenciones regionales.

Resumen original de OpenDesign, basado en la fuente enlazada. Las estrellas del repositorio son una señal de popularidad fechada, no el uso de la skill ni una puntuación de calidad.

06 Preguntas antes de empezar

Preguntas antes de empezar

¿RTL significa voltear todas las imágenes?

No. La fuente señala excepciones como logotipos, números y muchas imágenes. Revisa el significado antes de reflejar.

¿Puede la pseudolocalización sustituir el control de calidad de la traducción?

No. Puede revelar debilidades de diseño y manejo de caracteres antes de que lleguen las traducciones reales, pero no puede evaluar la naturalidad ni la adecuación cultural.

¿Deben tomarse los porcentajes de expansión como exactos?

No. Son orientaciones aproximadas para pruebas de estrés. Las pruebas con texto y diseño reales son más fiables.

OpenDesign

Deja espacio para la siguiente iteración de diseño.

Mantén tu brief, el material de origen y el trabajo de diseño juntos en un espacio de trabajo local. Revisa la configuración propia de la skill antes de añadirla a tu flujo de trabajo.

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