Herramientas de usuario

Herramientas del sitio


ada:howto:sicoferp:factory:uxdesign:uxwriting

Diferencias

Muestra las diferencias entre dos versiones de la página.

Enlace a la vista de comparación

Ambos lados, revisión anterior Revisión previa
Próxima revisión
Revisión previa
ada:howto:sicoferp:factory:uxdesign:uxwriting [2025/03/17 14:29]
10.1.52.50
ada:howto:sicoferp:factory:uxdesign:uxwriting [2025/03/17 15:28] (actual)
10.1.52.50 [3.3. Formatos y convenciones]
Línea 15: Línea 15:
 ❌ **Incorrecto:​** - "​Ingrese el valor de la obligación monetaria a satisfacer"​ - "Elija el ítem categórico de la estructura presupuestaria"​ ❌ **Incorrecto:​** - "​Ingrese el valor de la obligación monetaria a satisfacer"​ - "Elija el ítem categórico de la estructura presupuestaria"​
  
-Mi objetivo es facilitarles el trabajo mientras mantenemos la calidad de la experiencia de usuario. La claridad no es negociable - si el usuario tiene que pensar más de 2 segundos qué significa algo, estamos fallando. +''​Mi objetivo es facilitarles el trabajo mientras mantenemos la calidad de la experiencia de usuario. La claridad no es negociable - si el usuario tiene que pensar más de 2 segundos qué significa algo, estamos fallando. 
 +''​
 ==== 1.2. Concisión ==== ==== 1.2. Concisión ====
  
Línea 41: Línea 41:
 ❌ **Incorrecto:​** - "​Error:​ Monto inválido. El saldo es insuficiente."​ ❌ **Incorrecto:​** - "​Error:​ Monto inválido. El saldo es insuficiente."​
  
-Estoy disponible para aclarar cualquier duda sobre estos principios. Cualquier feedback sobre esto es súper bienvenido.+''​Estoy disponible para aclarar cualquier duda sobre estos principios. Cualquier feedback sobre esto es súper bienvenido.''​ 
 + 
 + 
 +---- 
  
 ===== 2. Elementos de interfaz ===== ===== 2. Elementos de interfaz =====
Línea 65: Línea 69:
   * **Campos obligatorios:​** Nombre + asterisco rojo (//) → "​Descripción //"   * **Campos obligatorios:​** Nombre + asterisco rojo (//) → "​Descripción //"
   * **Campos opcionales:​** Nombre + "​(Opcional)"​ → "​Código Proyecto (Opcional)"​   * **Campos opcionales:​** Nombre + "​(Opcional)"​ → "​Código Proyecto (Opcional)"​
- 
-He comprobado en mis años de trabajo con SICOF que las etiquetas son el primer lugar donde los usuarios se pierden. Si cuidamos estos detalles, reducimos la fricción y los errores de interpretación. No subestimen el poder de una buena etiqueta. 
  
 ==== 2.2. Textos de Placeholder ==== ==== 2.2. Textos de Placeholder ====
Línea 81: Línea 83:
 === Recomendaciones adicionales:​ === === Recomendaciones adicionales:​ ===
  
-  * **Usar color #9AA2B1 (gris medio)** para todos los placeholders,​ facilitando la diferenciación del texto ingresado. 
   * **Evitar textos largos** en campos pequeños; mantener placeholders visibles sin truncamiento.   * **Evitar textos largos** en campos pequeños; mantener placeholders visibles sin truncamiento.
   * **Mostrar formato esperado** en campos con validaciones específicas.   * **Mostrar formato esperado** en campos con validaciones específicas.
Línea 108: Línea 109:
   * **Agrupar acciones relacionadas** y separar visualmente grupos de acciones diferentes.   * **Agrupar acciones relacionadas** y separar visualmente grupos de acciones diferentes.
   * **Mantener consistencia** en el uso de verbos para acciones similares en toda la aplicación.   * **Mantener consistencia** en el uso de verbos para acciones similares en toda la aplicación.
- 
-Siempre digo en las reuniones de revisión: "Si el usuario tiene que pensar dónde hacer clic, hemos fallado"​. Por eso soy tan exigente con la jerarquía y etiquetado de botones. 
  
 === Botones específicos para módulo de Disponibilidades:​ === === Botones específicos para módulo de Disponibilidades:​ ===
Línea 171: Línea 170:
   * **Incluir unidades** siempre que se muestren valores numéricos (%, $, etc.).   * **Incluir unidades** siempre que se muestren valores numéricos (%, $, etc.).
   * **Mantener brevedad** en los textos de información general del dashboard.   * **Mantener brevedad** en los textos de información general del dashboard.
- 
-Para mí, el dashboard es como la carta de presentación de nuestro sistema. Si se ve desordenado o confuso, perdemos credibilidad desde el primer momento. 
  
 ==== 2.7. Procesos guiados (Stepper) ==== ==== 2.7. Procesos guiados (Stepper) ====
Línea 185: Línea 182:
 === Recomendaciones adicionales:​ === === Recomendaciones adicionales:​ ===
  
-  * **Limitar a 4-5 pasos** en el stepper para no sobrecargar al usuario.+  * **Limitar a 5-6 pasos** en el stepper para no sobrecargar al usuario.
   * **Usar números** para identificar cada paso (1, 2, 3, 4).   * **Usar números** para identificar cada paso (1, 2, 3, 4).
   * **Mostrar progreso** de forma visual, con pasos completados,​ actual y pendientes claramente diferenciados.   * **Mostrar progreso** de forma visual, con pasos completados,​ actual y pendientes claramente diferenciados.
Línea 196: Línea 193:
   - "​Documentos soporte"​   - "​Documentos soporte"​
   - "​Revisión final"   - "​Revisión final"
 +
 +
 +----
 +
  
 ===== 3. Terminología y convenciones ===== ===== 3. Terminología y convenciones =====
Línea 211: Línea 212:
 |**Saldo** ​                     |Usar con calificador:​ "Saldo disponible",​ "Saldo comprometido" ​               |"​Dinero",​ "​Fondos" ​            | |**Saldo** ​                     |Usar con calificador:​ "Saldo disponible",​ "Saldo comprometido" ​               |"​Dinero",​ "​Fondos" ​            |
 |**Centro de Costos** ​          |Usar siempre con mayúscula inicial ​                                           |"​CC",​ "​Costos" ​                | |**Centro de Costos** ​          |Usar siempre con mayúscula inicial ​                                           |"​CC",​ "​Costos" ​                |
- 
-Esto es súper importante. Cuando escucho a alguien decir "​partidas"​ en lugar de "​rubros",​ me quedo con esa sensación de inconsistencia que debemos evitar a toda costa. 
  
 === Nuevos términos específicos:​ === === Nuevos términos específicos:​ ===
Línea 267: Línea 266:
   * ✅ **Correcto:​** "​80%",​ "​33.5%"​ (cuando el decimal es relevante)   * ✅ **Correcto:​** "​80%",​ "​33.5%"​ (cuando el decimal es relevante)
   * ❌ **Incorrecto:​** "80 %", "80 por ciento",​ "​80.00%"​   * ❌ **Incorrecto:​** "80 %", "80 por ciento",​ "​80.00%"​
 +
 +
 +----
 +
  
 ===== 4. Mensajes y comunicación ===== ===== 4. Mensajes y comunicación =====
ada/howto/sicoferp/factory/uxdesign/uxwriting.1742221756.txt.gz · Última modificación: 2025/03/17 14:29 por 10.1.52.50