Marcando pautas para una correcta etapa de desarrollo

¿Qué debemos tener en cuenta previo a comenzar con el desarrollo web de un proyecto? Contar con todo el material de cada proceso es fundamental para que el equipo desarrollador tome las decisiones correctas.

En nuestro workshop “Del Diseño al Desarrollo: Conocimiento compartido para alinear proyectos” hicimos un repaso sobre algunos consejos para realizar un completo traspaso de proyectos entre equipos.

Esto no se trata de una tarea sencilla. Cada etapa y herramienta mencionada es parte de un proceso que está lleno de grandes instancias, en donde podemos esclarecer interrogantes y plantear otras, pero sin duda, nos permitirán establecer los lineamientos de nuestros proyectos.

La historia aún no termina

La aprobación de la propuesta de interfaz (Diseño UI), no es el fin de la etapa de diseño. Aún quedan acciones, hitos y ritos que se deben realizar previos a pasar a la etapa de desarrollo.

En nuestro workshop, definimos y ejemplificamos la importancia de estas acciones. La mayoría de ellas, contemplan trabajo multidisciplinario.

Para desarrollar, no puede faltar…

Iteraciones en detalle de pantallas críticas

Muchas veces el cliente tendrá un interés especial en iterar sobre ciertas pantallas e interacciones específicas que considera críticas para su negocio.

Se deben producir la totalidad de plantillas UI comprometidas

La definición de estilos en la Home (página de inicio), no es suficiente para desarrollar un sitio completo. En general es necesario abordar un mínimo de casos, como formularios, resultados de búsqueda, plantillas de email, newsletters, página no encontrada, etc.

Kit UI o Página tipo

Cuando no podemos diseñar todas las plantillas necesarias, una buena alternativa es el Kit UI o, en su defecto, una página tipo. Debemos tener presente que no solo estamos diseñando una interfaz, sino que se trata de un Sistema de Diseño .

Diseñar las interacciones y microinteracciones

En plataformas como Marvel o inVision, hoy es posible simular estos comportamientos. Los estados hover, visited, focus, active ; son alguno de los más básicos y algunas de las que normalmente olvidamos intencionalmente según el criterio y voluntad del Diseñador Front.

No olvides la interacción

Cuando existen flujos transaccionales o sobre el acceso a una información específica, se requieren procedimientos de búsqueda y navegación de mayor esfuerzo, las interacciones se vuelven fundamentales.

Presentaciones ejecutivas

Cuando diseñas para organizaciones complejas, en el sentido que existen mandos medios, gerentes, directorio y una amplia gama de stakeholders, es estratégico ayudar a tu contraparte directa a socializar el trabajo realizado.

Testear y mejorar

Podemos realizar test de usabilidad de las principales interacciones, de los mecanismos de navegación, de los procedimientos de búsqueda de información y de flujos transaccionales. También podemos hacer test multivariantes y test A/B para medir la efectividad de uno o varios “call to action”. Según corresponda, habrá que definir un guión, contactar usuarios, crear prototipos, aplicar test, sistematizar la información y concluir para aplicar mejoras.

Una posta donde la entrega del testimonio es la clave

Claramente para llegar al momento del traspaso al equipo de desarrollo, distintos roles y especialistas han participado del proceso. Podríamos decir que en este punto, existe un desprendimiento respecto del proyecto, en el que parte del equipo, debe preparar y consolidar todo el material de trabajo previo, a través de la documentación.

Hoy, con la infinidad de herramientas y aplicaciones que existen, es relativamente fácil mantener un historial ordenado de los entregables en sus versiones finales. Hablamos de herramientas que van desde Dropbox y Google Drive, pasando por Marvel o Figma hasta plataformas de gestión como Basecamp o Active Collab.

En muchos casos, este traspaso es un acompañamiento constante durante el tiempo que dura el desarrollo. La idea es lograr que los programadores, en el proceso de apropiación del proyecto, puedan ir aclarando cualquier duda que aparezca. De esta forma, podemos alinear la programación con los objetivos requeridos por el proyecto.

Es posible que durante la etapa de desarrollo se identifiquen vacíos de información y se cuestione algunas decisiones tomadas en etapas previas. Por ello, es fundamental contar con un material consolidado que permita validar, refutar o mejorar algún aspecto del proyecto que no haya sido visto con profundidad anteriormente.

Estamos en condiciones de partir

Cuando el equipo de desarrollo está informado de los alcances del proyecto, con sus detalles y objetivos, podrá comenzar su trabajo. Primero, planificando y modelando estructuras, clases, datos, librerías, etc; para luego programar y producir los distintos componentes de la plataforma o sitio.

Contrastar esta planificación y modelado con el material de las etapas anteriores permitirá cumplir de mejor manera los plazos, evitando cometer errores e iteraciones innecesarias.

Trabajo evolutivo

Será evaluable al final de la etapa de desarrollo, por ejemplo, que el Diseño Front haya interpretado fidedignamente la maqueta de diseño. Esto quiere decir, que debemos respetar colores, tipografías y tamaños. También se deberá evaluar la semántica, optimización y accesibilidad del HTML, tanto como testear la funcionalidad e interacciones.

Es un hecho conocido que las tecnologías de la información evolucionan a una velocidad vertiginosa. Por eso, también creemos que es fundamental que el desarrollador constantemente investigue y aplique nuevas herramientas, tecnologías y métodos que puedan facilitar y optimizar su trabajo, como también el de sus compañeros.

Una de nuestras premisas es que el desarrollo esté al servicio de la experiencia . De ahí que para nosotros es clave el rol del desarrollador como un facilitador que entienda que la tecnología debe ser una herramienta de ayuda y no una limitante.

Artículo publicado junto a Max Villegas.
Originally published at https://blog.ida.cl on August 24, 2020.