Ilustración de Fanny Luor.

¿Cómo se diseña un documento de diseño?

Cuando piensas en el diseño, la palabra "documentación" probablemente no sea lo primero que se te ocurra. Pero la documentación es una parte clave del proceso de diseño para muchos equipos.

En una encuesta informal en Twitter, 1 de cada 3 diseñadores de productos dijeron que pasan al menos el 25% de su tiempo revisando o escribiendo documentación. Lo curioso es que muchas clases de diseño ni siquiera hablan de documentación.

Sí, sé que un documento no es tan atractivo como un prototipo interactivo, pero un documento de diseño es donde las ideas pueden crecer rápidamente. Es donde los pensamientos se transforman en palabras, y las palabras se convierten en soluciones.

Cuando se hace bien, un buen documento de diseño puede:

  • Ayudarte a organizar tus pensamientos
  • Solidifica tu punto de vista
  • Reúne a tu equipo alrededor de una meta
  • Explica el por qué, no solo el cómo
  • Prevenir debates que succionan el tiempo
  • Hacer la vida de un desarrollador más fácil

En Dropbox, hacemos documentos de diseño para cada proyecto. Todos los proyectos deben comenzar en algún lugar, y para nosotros, a menudo comienza en un documento de Dropbox Paper.

Pero, ¿cómo diseñas un documento de diseño? Le pedí a algunos diseñadores de nuestro equipo consejos para crear documentación. Esto es lo que aprendí de ellos.

Conecta los documentos

La mayoría de las veces, un documento de diseño es solo un documento en un mar de otros documentos del proyecto.

Entonces, una cosa que Emily Miller hace para mantener sus documentos conectados es crear un índice en la parte superior de sus documentos. El índice muestra documentos de proyectos relacionados, y todos esos documentos tienen el mismo índice en la parte superior. "Es como un mini navegador web", explica Emily.

Un índice lo mantiene todo conectado

Digamos que su documento de diseño se llama "Proyecto emergente [Diseño]". El documento de ingeniería y el documento de copia seguirían un patrón de nomenclatura similar: "Proyecto emergente [Eng]" y "Proyecto emergente [Copiar]".

Es un truco rápido que ayuda mucho a su equipo a encontrar todos los documentos relacionados de forma rápida y fácil.

Abraza emoji

Mucha gente usa emoji hoy en día en aplicaciones de mensajería. En Dropbox, también usamos bastante emoji, en nuestros documentos de diseño

Emoji no es solo para decoración. Puede usar emoji para hacer que su documento sea más escaneable, llamar la atención sobre secciones específicas e incluso para comunicar el estado.

Por ejemplo, Sheta Chatterjee y su equipo usan un pin emoji para mostrar la semana actual de un sprint. También usan un emoji de excavación animado para mostrar si todavía se está trabajando en una sección. Si otros ven al tipo de excavación animado, saben que esos diseños aún no están escritos en piedra.

Emoji no es solo para decoración

Algunos diseñadores de nuestro equipo también usan emoji en el título de sus documentos. En Paper, si agrega un emoji al comienzo de su título, ese emoji se convertirá en el favicon en la pestaña de su navegador. El emoji hace que sea más fácil detectar ese documento, lo que es útil si tienes un millón de pestañas abiertas a la vez

Ah, ahí está mi doc.

Revive la experiencia

Muchas veces, los diseñadores no crean nuevos productos desde cero. En cambio, están haciendo ajustes a los flujos existentes para mejorarlos.

Antes de armar cualquier estructura metálica o simulación, Sara Lin revisa los flujos existentes y documenta todo lo que ve. Puedes decir que está reviviendo la experiencia.

Ella documenta todos sus pensamientos en un documento de auditoría, que vincula desde su documento de diseño principal. En su documento de auditoría, recrea el viaje del usuario utilizando capturas de pantalla de los flujos existentes. Luego agrega comentarios detallados sobre lo bueno y lo malo de cada paso del flujo.

Documentar lo bueno y lo malo en un documento de auditoría

Sara dice que hacer una auditoría la ayuda a adoptar la mentalidad del usuario, y eso ayuda a desarrollar la empatía del usuario. Estas auditorías me recuerdan las interrupciones de incorporación de usuarios de Samuel Hulick, pero imagínese hacerlo en su propio producto, donde puede ser su peor crítico.

Gira una historia

Mientras hojeo el documento de diseño de Laura Barbera, me encuentro con una historia. Es una historia apasionante sobre un investigador médico llamado Corrine, que está pasando un mal momento en el trabajo.

La historia toca temas que podrías encontrar en una película de Hollywood. Se habla de grandes presentaciones, documentos perdidos y panecillos quemados. Hay un conflicto, un clímax y una resolución: ya sabes, cosas que encontrarás en cualquier buena historia.

Para hacer las cosas más interesantes, Laura también condimenta las cosas con algunas referencias de la cultura pop aquí y allá.

Una historia ayuda a que su diseño sea más convincente

Laura usa historias como esta para ayudar a explicar sus diseños. No se trata del Usuario A con el Problema X. Se trata de una persona en una situación real con problemas reales. La historia ayuda a que el problema y la solución sean más convincentes.

Hazlos promocionar

"Los documentos pueden ayudar a las personas a entusiasmarse con una idea", me dice Ryhan Hassan.

Cuando le pregunto qué quiere decir con eso, Ryhan explica cómo a veces usa documentos de diseño como herramienta de presentación. Me muestra algunos documentos que son livianos en palabras y pesados ​​en imágenes.

En estos documentos, encontrará todo tipo de artefactos visuales: fotos de notas adhesivas, capturas de pantalla de conversaciones de chat, bocetos, videoclips e incluso prototipos Framer. Todos están integrados en su documento de Paper, para ayudar a que sus ideas cobren vida.

Él une diferentes tipos de imágenes para crear una narración que puede recorrer durante una presentación.

Fotos, conversaciones de chat y bocetos ayudan a contar la historia

"Es más fácil generar impulso si otros se entusiasman", dice Ryhan. Con la ayuda de artefactos visuales, esas grandes ideas flotantes se sienten mucho más concretas y convincentes.

Deja un rastro de papel

No importa cuán asombrosas sean tus habilidades de diseño, los demás siempre tendrán preguntas sobre tu trabajo. ¿Por qué usaste ese componente? ¿Has considerado X e Y? ¿Cómo interactúa esto con esa otra característica?

Puede ahorrarse mucha molestia documentando el pensamiento detrás de sus diseños. Cuando se hace bien, la documentación ayuda a todos en su equipo a comprender cómo llegó a sus soluciones. Una buena documentación es especialmente útil si trabaja con equipos remotos.

Para Melissa Mandelbaum, una buena documentación se trata de "crear el mejor rastro de papel posible". Al crear documentos de diseño, incluye múltiples propuestas de diseño, junto con pros, contras, riesgos y preguntas abiertas para cada propuesta. Esto muestra que el diseño se realizó cuidadosamente, no de forma involuntaria.

Muestra el pensamiento detrás de tu trabajo

“Pase un poco más de tiempo por adelantado documentando sus decisiones de diseño. Siempre será más fácil discutir y revisar las decisiones ", señala Melissa.

Construir un cementerio

Como diseñador, a veces puedes probar toneladas de exploraciones diferentes antes de decidirte por una dirección final. Pero no quieres asustar a los demás enumerando docenas de exploraciones, ¿verdad? Entonces, ¿Qué haces?

Kyle Decker desenterra un documento que llama "Cementerio de diseño". En el cementerio hay docenas de diseños antiguos de su proyecto anterior, junto con notas para sí mismo. Las notas explican por qué ciertas exploraciones no hicieron el corte.

The Design Graveyard: donde descansan algunas de tus mejores ideas

Kyle mantiene estas viejas exploraciones separadas de su documento de diseño principal para mantener su documento principal sin desorden. Pero sus viejas exploraciones están a solo un clic de distancia en caso de que necesite revivirlas algún día.

Hagas lo que hagas, no tires tus diseños antiguos. Los diseños muertos de ayer podrían convertirse en la gracia salvadora de mañana.

Encuentra un compañero

Una gran cosa acerca de un documento de diseño es que se convierte en un lugar donde puede recopilar fácilmente comentarios sobre sus diseños. Los compañeros de equipo pueden dejar preguntas (¡y cumplidos!) Utilizando comentarios en línea.

Pero si alguna vez ha recopilado comentarios en un documento, sabe que los comentarios pueden ser tanto una bendición como una maldición. En algún momento, deberá compartir sus diseños con un grupo más grande, y no todos se verán cara a cara.

En estas situaciones, Wes O'Haire recomienda buscar primero un compañero. Antes de compartir tu documento con un grupo más grande, compártelo primero con una persona de ese grupo. Guía a esa persona a través de tu documento para asegurarte de que todo tenga sentido. De esa manera, cuando esté listo para compartirlo con el grupo más grande para su aprobación, ya tiene una persona a su lado.

Haz que una persona revise tu documento antes que los demás

Gracias a Wes, ahora sé que la forma en que compartes tu documento puede ser tan importante como el contenido que contiene.

¿Cómo se hace la documentación?

Después de conversar con estos ocho diseñadores, aprendí que no hay una única forma de hacer la documentación del diseño. Cada diseñador tiene su propio proceso, pero todos podemos aprender uno o dos trucos el uno del otro.

Ahora que ha visto algunas de las técnicas que utilizamos, también nos encantaría conocer sus trucos del oficio. Siéntase libre de dejar un comentario a continuación si alguna vez desea compartir consejos sobre documentación. Siempre estamos ansiosos por aprender algo nuevo.

Y si está interesado en conectarse con los diseñadores mencionados anteriormente, puede encontrarlos aquí:

  • Emily Miller
  • Sheta Chatterjee
  • Sara Lin
  • Laura Barbera
  • Ryhan Hassan
  • Melissa Mandelbaum
  • Kyle Decker
  • Wes O'Haire

¿Quieres más del equipo de Dropbox Design? Siga nuestra publicación, Twitter y Dribbble. ¿Quieres hacer magia juntos? ¡Estamos contratando!