Cómo crear instrucciones paso a paso usando imágenes

Publicado: 2017-02-21

Hay algunos tutoriales que requieren más que texto para ser entendidos por los lectores. Al crear instrucciones paso a paso con imágenes, puede introducir a los lectores en detalles que de otro modo no se habrían comunicado. Esas imágenes pueden ser imágenes fijas o capturas de pantalla, GIF animados, gráficos de comparación o videos. Además de ayudar a los lectores a comprender su contenido, las imágenes también rompen la monotonía de una gran cantidad de texto.

En el último año, trabajé como redactor técnico para Joyent, escribiendo instrucciones y creando videos dirigidos a usuarios de todos los niveles. Esto requiere precisión: la gente confía en mí para crear instrucciones y guías paso a paso para una tarea técnica. Si pierdo un paso o asumo que los lectores ya conocen una parte de la información, es posible que se sientan frustrados y nunca vuelvan a nuestro contenido. Por otro lado, si soy demasiado detallado, el contenido puede parecer excesivo y confuso, además de requerir actualizaciones más frecuentes. Sin presión.

Encontrar los lugares donde una imagen puede reemplazar algunos de esos detalles demasiado precisos me ahorra tiempo y energía. Además, los lectores se marchan sabiendo lo que esperan ver, lo que, con suerte, les facilita la vida. Siempre que sea posible, siga algunos consejos clave de escritura: muestre, no cuente (tan esencial que tenga su propia página de Wikipedia).

No necesita ser un escritor técnico para beneficiarse de la jerga precisa del proceso. Siga leyendo para conocer estrategias para preparar instrucciones y agregar elementos visuales a cualquier documento.

Antes de comenzar a visualizar, considere a su audiencia

Antes de producir cualquier contenido, debes saber para quién lo estás produciendo y cuáles son sus expectativas. Aunque es imposible anticipar las necesidades individuales de cada lector, las reglas que establezca influyen en el tono de su contenido y pueden ayudarlo a tomar decisiones más adelante al crear el esquema de su proceso.

audiencia

Considera lo siguiente:

  • ¿Mis lectores ya son expertos? ¿Han hecho este proceso antes, si no exactamente entonces en circunstancias similares?
  • ¿Mis lectores son internos o externos? Si mis lectores están dentro de la misma empresa, ¿qué idioma compartimos que ayudará a explicar mejor el proceso?
  • ¿Con qué estado de ánimo vendrán a mi contenido? ¿Estoy creando este contenido para alguien que tiene prisa por hacer algo, o es para un estudiante más casual que solo espera mejorar su educación sobre un tema?
  • ¿Qué es lo más importante para mis lectores? ¿Qué es lo menos importante?
  • ¿Cómo prefieren aprender mis lectores? ¿Sé si una publicación de blog tiene más éxito que un video? ¿Hay datos analíticos que respalden estas afirmaciones?
  • ¿Mis lectores son hablantes nativos de inglés? Si uso un modismo, ¿obstaculizará su capacidad de aprender a completar el proceso?

No importa lo que esté creando, siempre lo está creando con un lector en el otro extremo. Cuanto mejor conozcas a tu lector y produzcas contenido pensando en él, es más probable que siga regresando por más contenido.

Resuma el proceso con tantos detalles como sea necesario

Una forma de preparar un proceso o tutorial para cualquier medio es comenzar con una tabla de dos columnas. La primera columna contendrá cada paso individual que el lector debe realizar para completar una tarea. Esos pasos pueden ser tan pequeños y precisos como "enviar su solicitud" o tan largos e inespecíficos como "completar el resto del formulario".

La segunda columna será su columna de proceso visual. Al principio, es posible que esto no incluya imágenes reales, sino una descripción de cuáles serán las imágenes. Si está creando un documento escrito, no necesita tener una imagen coincidente para cada paso en la columna uno. Si va a crear un screencast, cada cuadro debe tener una nota sobre el tipo de imagen que se incluirá. Debe haber poco o ningún tiempo de pantalla vacía en un video.

Un ejemplo de esta tabla se encuentra a continuación en "Ejemplo de esquema", pero primero debe saber más sobre los tipos de ayudas visuales.

Tipos de imágenes y cuándo usarlas

Cada proceso puede beneficiarse de diferentes tipos de imágenes. El medio cambiará dependiendo de su propósito.

  • Imágenes fijas : este es el medio perfecto cuando se trata de visualizar un producto físico, ya sea una persona o un objeto específico como un tipo de sartén. Estas pueden ser fotografías de stock o fotos que hayas tomado.
  • Captura de pantalla: una imagen fija de su pantalla es excelente cuando se habla de productos que se ven en su computadora, como un sitio web u otra pieza de software. Son súper fáciles de tomar y editar, especialmente gracias a Snagit.
  • GIF : las imágenes animadas son perfectas para explicar procesos cortos (menos de 8 segundos) que pueden no ser tan fáciles de articular.
  • Gráfico : gráficos de barras, gráficos circulares, gráficos de líneas, ¡tantos tipos de gráficos! Un gráfico es la mejor opción cuando se habla y se compara un conjunto de números.
  • Video : lo último en imágenes, un video es excelente para explicar un proceso. Cómo hacer un gran video técnico es una forma de arte que sin duda puede ser ayudado por este proceso, pero requiere mucha más planificación. (Por suerte para ti, aprendí mucho de TechSmith y tienen mucho más que decir sobre el tema).

Siéntase libre de usar una combinación de medios con su escritura. Cada uno satisfará diferentes necesidades para diferentes pasos.

Esquema de ejemplo

Las recetas son uno de los mejores ejemplos de un proceso que a menudo requiere precisión en el que las imágenes pueden marcar una gran diferencia. Digamos que quiero resumir las instrucciones para hacer un pastel:

mesa {

borde-colapso: colapso;

}

tabla, td, th {

borde: 1px sólido #404040;

relleno: 4px;

}

PASOS VISUALES
1. Reúna todos los ingredientes para asegurarse de que no falte nada. Si falta un ingrediente, adquiera ese ingrediente antes de continuar. Imagen de ingredientes ensamblados
2. Precaliente el horno a 350 grados Fahrenheit.
3. Engrase y enharine un molde para pastel cuadrado de 9 x 9 pulgadas.
4. En un tazón mediano, mezcle el azúcar y la mantequilla. GIF del proceso de cremado
5. Rompe los huevos en el tazón uno a la vez, revolviendo para incorporar.
6. Agregue la vainilla.
7. Tamizar la harina y el polvo de hornear en el bol y mezclar hasta que se incorporen. Puede que queden grumos o rayas de harina. GIF de tamizado o foto de pre-leche de producto terminado agitado
8. Agregue la leche hasta que la masa esté completamente suave. Foto de la masa terminada (posible al lado de la foto del paso 7)
9. Vierta o vierta la masa en el molde para pasteles preparado.
10. Hornee de 30 a 40 minutos en el horno precalentado. El pastel estará listo cuando esté dorado por encima. La parte superior debe volver al tacto. foto de la torta terminada

Si cada paso tuviera una imagen, sería un poco… gratuito.

Elige tus visuales

Las imágenes que he seleccionado son útiles para articular mini procesos dentro de un proceso más grande. En particular, la imagen en el paso 7 de la mezcla revuelta hasta el momento es una pieza crucial de evidencia visual. Habiendo horneado varios pasteles con esta instrucción, la diferencia entre lo correcto y lo demasiado mezclado... Desearía tener siempre una imagen. Podría haber un manual de instrucciones escrito solo sobre las complejidades de cuánto tiempo mezclar; cada dos páginas tendría que ser una imagen.

Después de delinear qué elementos visuales necesita, debe recoger los productos. Para este ejemplo, sería mejor tomar fotografías de su proceso de cocción de un pastel. Para otros procesos, es posible que no necesite tomar fotos personalizadas. Hay una variedad de sitios web de fotografía de stock gratuitos y premium que tienen videos, GIF y fotos fijas para usar a su discreción.

Prueba con tu público objetivo

Ningún escrito está completo hasta que alguien de su público objetivo lo lea y le dé un sello de aprobación. Sus aportes demostrarán dónde omitió un paso en su proceso o dónde se necesitan más elementos visuales.

Entrevista

La forma más fácil de hacerlo (sin los grandes recursos de un equipo de usabilidad) es pedirle a algunas personas de su grupo demográfico clave que lean su contenido y traten de seguir el proceso exactamente como está escrito. A menudo se cita a Jakob Nielsen diciendo que cinco es el mejor número de personas para detectar la mayor cantidad de problemas.

Pruebas no moderadas

Las pruebas no moderadas son perfectas para proyectos más pequeños con recursos limitados, o simplemente cuando necesita resultados rápidos. Hay una serie de herramientas que puede usar para obtener resultados más precisos, pero si solo está buscando comentarios sobre un proceso más pequeño, puede salirse con la suya simplemente enviando el documento a sus evaluadores con un conjunto de preguntas que desee. contestada.

Pida a sus evaluadores que tomen notas cada vez que tengan preguntas, vean algo que pueda faltar, encuentren obstáculos en el proceso o deseen tener instrucciones más detalladas. Con suerte, podrán terminar la tarea antes de darte su opinión.

Pruebas moderadas

El mayor beneficio de las pruebas moderadas es que en realidad puede ver a su evaluador realizar el proceso y ver dónde están confundidos en lugar de confiar en ellos para notar esa confusión por usted. Es incluso mejor si graba la sesión para que no tenga que depender exclusivamente de las notas que toma durante esta sesión.

Haga preguntas en el camino. Por ejemplo:

  • ¿Entendió qué tarea se le pedía que realizara? ¿Tenía sentido esa tarea?
  • ¿Qué habría hecho este proceso más fácil de completar?
  • Si había una imagen con un paso, ¿te ayudó la imagen a entender qué hacer?
  • ¿Te hubiera gustado que hubiera más imágenes?

Terminando

Ahora sabe por qué debe agregar elementos visuales a las instrucciones paso a paso y tiene un arsenal de herramientas para ayudarlo a crear correctamente instrucciones paso a paso con la ayuda de ayudas visuales. La práctica hace la perfección. Es posible que su primer intento de agregar imágenes a un proceso no sea perfecto, pero con algunas pruebas de usuario para guiar su proceso de edición, estará en camino de ayudar a sus usuarios a comprender cómo completar una tarea.

¿Tiene otro método para averiguar cuándo agregar ayudas visuales a las instrucciones? ¡Comparte tus consejos en los comentarios a continuación!

Nota del editor: esta publicación se publicó originalmente en noviembre de 2017 y se actualizó para mayor precisión y exhaustividad.