Diseño Material y escritura técnica

El el año 2014, durante su conferencia de desarrolladores Google I/O, Google presentó su proyecto de Diseño Material (originalmente en inglés, Material Design). Esta iniciativa propone un marco de trabajo para desarrolladores que permita una experiencia de usuario común en cualquier aplicación y dispositivo. Pero la propuesta de Google, por su propia naturaleza, resulta interesante más allá del desarrollo de aplicaciones.

Hacia una práctica de lo Material

[El Diseño Material] tiene el potencial de ser una de las mejoras visuales más significativas de la web en general.

- (Armin Vit, Brand New / Under Consideration)

Tradicionalmente, el desarrollo de contenido documental ha tomado como base dos elementos fundamentales: tipología y estilo. La tipología define el modelo de información que sustenta el documento. Por ejemplo, DITA establece los tipos tarea, concepto y referencia como posibles modelos de información. El estilo es un elemento igualmente importante en documentación técnica. Gracias al estilo dotamos de una coherencia visual a la informació, algo clave para facilitar la exploración de contenido por parte del usuario.

Tipología y estilo nos permiten, por sí mismas, definir un tema acerca del cual informar o asistir al usuario, pero resultan insuficientes para establecer relaciones con otros temas y proporcionar una visión holística de la información. Las cuestiones que se plantean aquí son ¿pueden los usuarios, con un simple vistazo, descubrir la totalidad de la información que se presenta ante ellos?, ¿puede esta información adoptar formas que permitan identificar fácilmente un punto de partida y el curso de acciones requerido por la tarea?

En su Diseño Material, Google apuesta por unos principios básicos -pero claramente definidos- de aspecto y usabilidad que puedan hacerse extensivos a todo tipo de aplicaciones y plataformas. Pero lo más interesante de esta apuesta es que su desarrollo es lo suficientemente amplio como para poder aplicarla en otros campos; sin ir más lejos, el de la escritura técnica. Aplicar el Diseño Material a la documentación técnica, supondría dotar a esta de una experiencia de usuario común que no estuviese ligada a la concepción particular de cada fabricante de software, y serviría como elemento de relación entre distintos tipos de información. Pensemos por un momento: ¿tiene hoy sentido que la experiencia del lector ante un documento de ayuda sea distinta para cada fabricante de software e incluso para un mismo fabricante?

El Material es la metáfora

Una metáfora material es la teoría unificadora de un espacio racionalizado y un sistema de movimiento. El material se basa en la realidad táctil, inspirada en el estudio del papel y la tinta, pero tecnológicamente avanzados y abiertos a la imaginación y la magia. (fuente: Introduction to Material Design, Google design)
Para poder explicar la filosofía detrás del Diseño Material, Google introduce el concepto de quantum paper, un elemento similar al papel pero mucho más dinámico y transformable. Se toma así un elemento de uso común, el papel, y se le dota de características singulares. El papel se presenta de este modo como una metáfora de la información.

Resulta casi imposible no establecer aquí una relación entre el uso del papel como vehículo de la información y la documentación técnica. Incluso después de trasladar la documentación de usuario a la web en sus diferentes concepciones, uno de los formatos más comunes sigue siendo PDF, una representación electrónica de un libro. La documentación, independientemente de su formato, sigue utilizando el concepto originario del papel como elemento a partir del cual estructurar la información. El Diseño Material propone transformar este elemento y amplificar sus capacidades de interacción con el usuario o, en nuestro caso, con el lector.

Las dimensiones de lo material como niveles de información

El Material tiene dimensiones X e Y variables y un grosor uniforme. (fuente: Material properties, Google design)

Esta hoja de papel cuántico puede transformarse dinámicamente para adaptar su tamaño a la información que se muestra. Del mismo modo que podemos doblar y desdoblar una hoja de papel, la información puede también expandirse para adaptarse al medio y a la audiencia. Si tomamos una hoja de papel y la doblamos por la mitad, dispondremos de una superficie más limitada para mostrar información, pero que puede ser suficiente para que el usuario complete su tarea. Dada la necesidad, podemos desdoblar la hoja dando la posibilidad al lector de acceder a información extendida.

El hecho de que el material no pueda expandirse en profundidad tiene también un significado en el tratamiento de la documentación. Los artículos técnicos deben de ser relevantes para la tarea del lector, mostrando la información necesaria, pero no más. La información -el material- crece ricamente ligado entre sí, bien expandiéndose cuando nos mantenemos en el mismo plano de información, o bien mediante enlaces, cuando necesitamos pasar a un plano distinto.

Múltiples elementos materiales no pueden ocupar el mismo punto en el espacio simultáneamente. (fuente: Material properties, Google design)

Otra característica de lo Material es que dos elementos no pueden ocupar simultáneamente el mismo espacio físico. De forma análoga, dos bloques de información independientes no deben describir lo mismo. Cada elemento cumple una función para el usuario y la separación entre el contenido de uno y otro ha de ser clara.

División y fusión de lo Material

Divide los casos de usuario complejos, amplios o vagos en actividades más pequeñas. Estas tareas más pequeñas pueden reutilizarse, ser más fáciles de entender o cumplir mejor los objetivos del usuario. (fuente: Navigation, Google design)

El material dividido puede unirse. (fuente: Material properties, Google design)
La división y fusión de lo material encuentran de nuevo su equivalencia en la división y fusión de la información. Deconstruir un elemento nos ayuda a entender mejor el conjunto a través de sus partes. Igualmente, la información se divide para hacerse más comprensible, y también para ser más fácilmente reutilizable en otros niveles. La información puede dividirse y combinarse de muy distintas formas, y puede también fusionarse llegado el caso.

Los conceptos de división y fusión son la base de la documentación estructurada, en la que un tema es dividido en elementos menores, que a su vez están construidos con bloques de información marcados semánticamente.

Las sombras como enlaces

Las sombras proporcionan importantes pistas visuales acerca de la profundidad de los objetos y el movimiento. Son la única señal visual que indica la separación entre las superficies. (fuente: Elevation and shadows, Google design)
Una de los elementos más destacadas del Diseño Material es el empleo profuso de sombras para separar materiales. Al igual que ocurre en el mundo real, los componentes del mundo Material proyectan sombras sobre un plano, tanto más profundas cuanto mayor es su elevación sobre el mismo. Visualmente las sobras nos permiten saber cómo se establece la relación entre los distintos materiales. Estas sombras equivalen a hiperenlaces en el área de la información. Los enlaces establecen un punto de unión -y también de ruptura- entre la información a uno y otro nivel. Cada enlace permite al usuario trasladarse a un plano de información inmediato y diferente.

El movimiento como jerarquía

El movimiento proporciona:
- Una guía focalizada entre vistas.
- Relaciones jerárquicas y espaciales entre los elementos.
- [...]

(fuente: Motion, Google design)
El movimiento de los elementos y la definición de planos son el fundamento de lo Material. Las interfaces utilizan el movimiento para dar respuesta a las acciones del usuario y destacar aquello que requieren su atención. El movimiento permite también establecer una relación y jerarquía entre los distintos elementos. En el campo de la escritura técnica, la tabla de contenidos (en sus distintas variantes) permite establecer las relaciones de jerarquía entre los distintos bloques de información. Pero esta tabla de contenidos es un componente estático que por sí mismo no resuelve los problemas derivados de la exploración de contenido, especialmente en artículos técnicos de una cierta complejidad y extensión. Las tablas de contenido dinámicas (como las que podemos ver en el siguiente ejemplo tomado de la documentación de Google Docs), junto con el uso de las tarjetas, aportan una solución novedosa a esta cuestión.

Las tarjetas como puntos de acceso a la información

Las tarjetas proporcionan contexto y un punto de acceso a una información más completa. (fuente: Cards, Google design)

Las tarjetas se están imponiendo en el diseño de aplicaciones móviles como el elemento más efectivo para dar entrada a la información. Google ha estado trabajando con estas tarjetas desde hace algún tiempo, y otros fabricantes están también adoptando este modelo. En el aspecto documental, las tarjetas nos ayudan a sintetizar la tabla de contenidos en sus elementos más básicos, proporcionan al usuario un curso de acciones lógico para realizar su tarea y son un punto de entrada a niveles de información superiores.

La documentación de producto muestra hoy en día un aspecto dispar, donde cada fabricante se esfuerza por aplicar soluciones particulares a problemas comunes. El Diseño Material propone un marco de actuación que trasciende el desarrollo de aplicaciones y con capacidad para convertirse en el elemento común en la experiencia de los usuarios con la documentación.