¿Estás construyendo una estrategia digital, y necesitas producir algunos elementos?
Aún si deseas contratar a alguien para producirlos, te ayudará si comprendes los procesos típicos para terminar con un elemento acertado, útil, y funcional.

En este artículo, te describo un resumen de los procesos para desarrollar cuatro de los elementos más típicos usados en una estrategia digital. En donde tenga sentido, te daré algunos de mis mejores consejos creativos para desarrollar cada medio al más alto nivel.
Por favor comprende de que no hay forma de que pudiera cubrir todos los escenarios posibles en un sólo artículo. Por ejemplo, cuando cubra el tema de producción de Web, puede ser que necesite ser modificado dependiendo de los objetivos particulares que estás tratando de lograr. También, algunos equipos y profesionales pudieran preferir trabajar en una manera diferente que lo que describo aquí.
Estas recomendaciones de proceso son simplemente una guía, ¡y no un sistema legal! Lo que te enseño aquí ha funcionado para mí a través de los años. Siempre y cuando los objetivos sean alcanzados con éxito, y el proceso se pueda descomponer en una manera que tenga sentido y avance suavemente, cualquier partida de lo que recomiendo aquí es completamente aceptable.
Producción de Web: Proceso
| Diseño | Alpha | Beta | Prueba de Usuario | Prueba de Navegadores |
Diseño. Basado en la información definida en la fase de pre-producción, el proceso de producción Web empieza con la fase de diseño. Aquí, la interfaz del usuario y todos los elementos visuales cobran vida.
Las dos preguntas principales que deberá hacerse, y respondidos en afirmativo, para cualquier elemento de diseño para la Web son:
¿Hay adhesión estricta a los lineamientos creativos y de marca establecidos durante las fases anteriores?
¿El diseño incluye todos los objetivos funcionales establecidos en nuestra Estrategia?
Por supuesto, existen muchos otros criterios por los cuales juzgar nuestro diseño, y algunos de los principales es que el diseño debe ser de buen gusto y actualizado. Sin embargo, aún si — por alguna razón creativa extraña — se decide conscientemente que el diseño deberá ser de mal gusto y obsoleto, las dos preguntas arriba aún deberán ser respondidas de forma afirmativa.
Para esta etapa, la mayoría de los elementos involucrados en un buen diseño ya debieron ser determinados durante la fase de pre-producción. Todo lo que se necesita hacer es organizar los elementos para cumplir los objetivos funcionales que se establecieron en tu estrategia.
En años recientes, una gran comunidad de diseñadores se ha puesto de acuerdo en que, con el predominio de dispositivos móviles con capacidad de navegar la Web, tiene mucho más sentido diseñar para estos dispositivos primeramente. A partir de ahí, el diseño pudiera expandir para tener en cuenta las vistas más grandes, tales como los navegadores en computadoras de escritorio. Por esto es que hemos visto muchas interfaces de usuario para escritorio hoy día con fuertes tendencias hacia un diseño más simplificado.
También se puede decir mucho acerca de diseñar sitios Web con objetivos de conversión, lo cual es un tema mucho más allá del enfoque de este artículo. Si existe un sólo consejo útil que te pudiera ofrecer, sería preservar un sólo objetivo para cada diseño, aún si existen varias opciones con las que el usuario pudiera interactuar. ¿Cuál es el elemento singular con el que deseas que los usuarios interactúen, pulsen, o llenen durante cualquier etapa de su experiencia?
Al mantener un objetivo singular en mente, tus diseños incorporarán de inmediato un nivel mayor de claridad, ¡que si te enfocaras en 15 opciones diferentes a la misma vez! Permite que ellos decidan a dónde deben ir; sin embargo, a través del diseño pudieras decirlo lo que tú, como un guía amistoso, recomiendas que hagan.
Sitio Alpha. Luego de que el diseño esté aprobado, se codificará y se estilizará un sitio para empezar a observarlo tomando forma dentro de un navegador Web. Muchos de los elementos no serán aún funcionales, pero el diseño de interfaz de usuario por lo menos estará presente en esta etapa.
Sitio Beta. Luego de que se haya tratado con los asuntos durante la fase de Sitio Alpha, será tiempo para aplicar esos cambios en el sitio, así como completar cualquier objetivo funcional que aún esté pendiente y que se haya postergado. Luego de que la fase Beta haya sido completada, un sitio nuevo y funcional será producido como resultado, listo para pruebas finales de usuarios.
Pruebas de usuarios. El sitio Beta luego será presentado a otros usuarios; en la mayoría de los casos, a personas quienes no habían estado involucradas en el proceso hasta este punto. Las opiniones honestas de experiencia de usuario serán anotadas, y se lidiará con cualquier asunto que se revele. Esta es una etapa muy importante para medir si nuestra experiencia Web es atractiva y se presta al tipo de interacciones que buscamos.
Pruebas de navegadores. Una vez el sitio Web esté listo para publicarse, se empezará una ronda de pruebas en varias versiones de navegadores, dispositivos, y sistemas operativos. Esto nos garantiza que los usuarios pueden experimentar correctamente nuestro sitio Web, sin importar cuál navegador utilicen. Antes de que el sitio Web se publique, los asuntos que se observen a través de cualquiera de los navegadores pudieran ser corregidos.
Producción para Aplicaciones: Proceso
| Esquema/Protositio | Construcción de bases de dato | Interfaz de Usuario | Diseño | Alfa | Beta | Pruebas |
Esquemas. Para aplicaciones de escritorio, Web y móviles, una disposición concisa y natural de todos los elementos de interfaz de usuario pudieran ser el factor vital para que los miembros de tu audiencia lo utilicen con éxito, o lo abandonen en frustración. Una forma de asegurarte de que tu diseño de interfaz es razonable y lógico es dibujar un esquema. Esto será un bosquejo simple de las disposiciones necesarias para incluir todos los elementos funcionales. No hay que preocuparse por estilo de ningún tipo en esta etapa. ya que todo lo que nos concierne ahora es el espacio y la distribución de los elementos.
Asegúrate de construir suficientes esquemas para cada etapa de la experiencia del usuario, incluyendo paneles, ventanas y diálogos que pudieran aparecer y desaparecer en ciertos momentos. Cualquier elemento que no se tome en cuenta durante la etapa esquemática usualmente son los que terminan siendo un problema más adelante.
Un protositio es una versión extremadamente simplificada, y a la interactiva (hasta cierto punto) de lo que será la aplicación completada. Esto permite que los desarrolladores y responsables de tomar decisiones puedan interactuar con el concepto de la aplicación mucho antes de que las horas y recursos hayan sido invertidos hacia su desarrollo.
Construcción de bases de datos. En esta etapa, se crearán las bases de datos que se necesitan para cada componente requerido. Esto deberá ser realizado por un especialista en bases de datos, ya que establecerá un fundamento crucial para manejar datos luego mientras la aplicación esté en fase de pruebas, y por supuesto, luego de que se haya lanzado.
Diseño. Luego de esto, se diseñará el estilo de interfaz de usuario, que luego dictará las consideraciones visuales e interactivas necesaria para cumplir las funciones de la aplicación. El “look and feel” del diseño no es lo único importante en esta etapa, sino también qué tan bien apoya las funcionalidades deseadas para la aplicación. En otras palabras, el diseño deberá estar informado por tu marca, así como por las acciones más importantes que deseas que tome tu usuario.
Alpha. Luego se producirá una versión completa de la aplicación, aunque en este punto muchas de las funciones se dejarán para una etapa posterior. El propósito del Alpha es proceder a una etapa de desarrollo durante el cual se podrá interactuar con la aplicación para empezar a hacer pruebas de qué tan bien la interfaz apoya la funcionalidad deseada. Ya que los elementos de interfaz de usuario pudieran no estar vinculados a la base de datos, se deberá evaluar con esto en mente (en otras palabras, ¡no te asustes si no funciona del todo!).
Beta. Una vez los cambios necesarios se hayan realizado durante la fase de Alpha. los desarrolladores procederán a asegurarse de que toda la funcionalidad esté tal como se desea, y que responda correctamente al diseño de interfaz de usuario. Ya que esta etapa ocurre justo antes de la fase final de pruebas, la aplicación Beta deberá estar tan cercanamente como sea posible a la versión final lista para los usuarios.
Pruebas. Una vez la aplicación alcance la etapa de Beta, se asume que la mayoría de los problemas ya estarán eliminados, y que la aplicación está lista para lanzarse. No obstante, una fase de prueba pudiera proveer una salvaguardia adicional para que la aplicación quede completamente libre de cualquier problema. Hasta la fase Beta, pudiera ser aceptable probar la aplicación en un ambiente virtual/simulado. Sin embargo, la fase de pruebas se deberá realizar sobre las plataformas actuales con las que el usuario interactuará al utilizar la aplicación.
Producción de Vídeo: Proceso
| Guión | Storyboard (Guión gráfico) | Animatic | Grabación | Edición | Previsualización | Salida |
Guión. Basado en el concepto del vídeo, se debe desplegar todo el diálogo en una página, junto con las descripciones visuales asociadas en cada segmento. Se muestra cada elemento, incluyendo las palabras habladas y los conceptos representados visualmente, y se examinan con cuidado para lograr que haya adhesión estricta con el mensaje deseado y la esencia de la marca.
Storyboard (Guión gráfico). Una vez se formaliza el guión, será conveniente producir un storyboard, que no es más que bocetos de cada composición involucrada en la producción final. Si la filmación involucra uno o dos cámaras y un sólo talento, quizás no necesites un storyboard. Por otra parte, si la producción ha de ser mucho más compleja, un storyboard pudiera ser una ayuda de planificación esencial para evitar problemas más adelante.
Animatic. Luego de que se produzcan los storyboards, puede ser que tu editor desee desplegarlos en una secuencia, en sincronía con una pista musical y/o una pista cero. Este paso ayudará a evaluar el ritmo de las escenas, y la secuencia de la pieza final, antes de que se invierta en grabación y edición.
Grabación. Como el nombre lo insinúa, esta es la fase en la que se sacan las cámaras, y todo el talento involucrado hace su parte en el ambiente señalado, sea un estudio, o una locación interior o exterior. Con la tecnología actualizada, el pietaje se almacenará en algún tipo de dispositivo de medios digitales.
Edición. El pietaje de la grabación se transfiere (algunas personas usan la palabra “ingiere,” la cual personalmente odio en este contexto) a un centro mayor para almacenamiento de medios, que luego un software para edición podrá acceder para empezar a seleccionar y desplegar en una secuencia. La velocidad y el proceso de selección será informado por el guión, el storyboard y el animatic. Los gráficos también se producirán y se añadirán en esta etapa, según sea necesario.
Previsualización. Una vez el pietaje, audio, y gráficos tengan sentido con respecto al guión y al propósito original del vídeo, se exportará en baja resolución para ser enviado y evaluado por cualquiera de los miembros del equipo que estén involucrados.
Salida. Si no se requieren más cambios, el vídeo luego se exporta en el formato final requerido. En los medios digitales, el formato de archivo final y el tipo de compresión dependerá del dispositivo y el ambiente en el cual se reproducirá para ser consumido por los usuarios finales.
Producción de Gráficos: Proceso
| Concepto/Boceto | Escaneo/Digitalización | Delineación | Colorización | Terminación | Salida |
Concepto/Boceto. La mayoría de ejemplos grandiosos en diseño gráfico empiezan con muestras en borrador utilizando las herramientas más rudimentarias, como lápiz y papel… ¡e incluso servilletas! Una de mis técnicas favoritas es hacer el boceto lo más pequeño posible. Esto me obliga a enfocarme en forma y composición, en vez de en los detalles que vendrán luego.
Escaneo/Digitalización. A menos que tu pieza tenga que tener una apariencia manual, como de arte tradicional, en algún punto querrás escanear e importarlo dentro de algún tipo de software para edición de imágenes. Una vez esté hecho, podrás utilizar herramientas estándares para limpieza y mejoría de tu idea visual.
Delineación. Una vez la imagen escaneada haya sido importada, las formas principales podrán ser convertidas a líneas vectoriales para más ediciones. Incluso en el caso de los gráficos que consistan en objetos sólidos, será útil empezar con un contorno digital y luego rellenarlo. Los mejores contornos son una combinación de procesos de software (para ahorrar tiempo) y trabajo manual (para asegurar calidad).
Colorización. Definir una paleta de colores pudiera hacer la diferencia entre un diseño que tiene un sentido de orden, de uno que se siente desordenado y aleatorio. Escoge 5 – 6 colores para empezar, y luego expande según sea necesario. Recuerda que las proporciones de color juegan una gran parte en la apariencia final de la pieza. Sería buena idea componer una resumen visual de la paleta de colores con formas de colores y tamaños diferentes, cada una representando la proporción de color propuesta.
Terminación. Una vez las formas, composición, y colores sean definidos, es la hora de agregar toques finales, como sombra, contornos, y otros detalles que se hayan dejado a propósito para fases posteriores. Otras preguntas que se pueden hacer en este punto: ¿Se necesitará refinar las formas? ¿Se deberá tratar con los colores por vez final? ¿Existe algún arte o fotografía que deberá ser revisada, o quizás adquirida? En esta fase también es común probar el gráfico en una pantalla real, como el de una computadora de escritorio o dispositivo móvil, y luego se podrá revisar qué tan bien se ve.
: : :
Este artículo es un complemento a mi libro BACON Digital, en el que describo las cinco cualidades de una iniciativa digital exitosa, y el proceso para alcanzarlas. Puedes revisar más detalles acerca de mi libro aquí: http://librobacondigital.com