Manual de estilo de la interfaz

De MoodleDocs

Este documento no es definitivo, es una colección de ideas y en constante construcción.

Simplicidad

Use el mínimo de interfaz necesario para obtener un trabajo terminado.

Páginas estándar

Módulos de actividad

  • index.php - lista todas las opciones de ese módulo en un curso.
  • view.php - muestra una opción en particular.
  • config.html - configura una opción del módulo.

Bloques

  • config.html - configura una opción del bloque.

Un script por función o página principal

...

Plantilla de página

  1. Imprima las cabeceras con print_heading, use los hooks CSS para IDs y Clases.
  2. Imprima las cajas alrededor del texto usando print_simple_box, use los hooks CSS para IDs y Clases.

Plantilla de formulario

  1. Muestre las opciones más importantes en la parte superior.
  2. Cada entrada debe tener una etiqueta y, si es necesario, un archivo de ayuda.
  3. Si hay más de 10 opciones, desglóselas en los parámetros necesarios y opcionales, extra o avanzados.

Manejo de tablas

Use la función print_table cuando sea posible.

Herramientas de navegación estándar

  1. Todas las páginas deberían llamar a print_header, y suministrar una ruta de navegación estándar que apareciera allí. Donde sea posible, debería verse como: COURSE >> INDEX >> INSTANCE >> SUBPAGES...
  2. Las páginas incluídas en módulos de actividad deberían llamar a navmenu() para generar el menú de navegación apropiado.

Direcciones URL

  1. Las direcciones URL deben ser lo más cortas posible.
  2. No usar subrayado en nombres de parámetros o nombres de archivos.
  3. Nunca use dos palabras cuando una sea suficiente.

Botones o enlaces

Esto es algo difícil de definir...

El Web Accelerator de Google proporciona algunas sugerencias:

  1. Las acciones que puedan modificar el estado de Moodle (archivos de datos, base de datos, información de sesión) deben ser llevadas a cabo por medio de botones.
  2. Como mínimo, tales acciones -que son implementadas como enlaces- deben remitir a una página de confirmación que utilice botones.

Denominación CSS

Enlaces a archivos de ayuda

  • Los botones de ayuda deben estar a la derecha del objeto (excepcionalmente pueden estar a la izquierda, si el objeto está alineado a la derecha)

Temas relacionados

Últimas noticias de Robin Good. "Interaction Design Meets Online Real Estate" (1 de Marzo de 2005). http://www.masternewmedia.org/news/2005/03/01/interaction_design_meets_online_real.htm

El artículo ofrece una visión de los espacios virtuales focalizados en las acciones humanas. Esto me recuerda acercamientos comunicativos como Moodle. La interfaz sirve como mando general de todas las herramientas de comunicación.