/La Brecha Entre Desarrolladores Y Diseñadores Está Desapareciendo

La Brecha Entre Desarrolladores Y Diseñadores Está Desapareciendo

Compartir

Desde la última década ha habido una guerra fría entre diseñadores y desarrolladores. Los diseñadores se han quejado sobre cuán dependientes deben ser de los desarrolladores para crear mockups que vayan más allá de imágenes estáticas. Por otro lado, los desarrolladores han resentido su necesidad por diseñadores habilidades para ayudarles a convertir sus conceptos en interfaces capaces que sean amigables para los usuarios.

Pero al tiempo que las herramientas de diseño se hacen más y más fáciles de usar, la guerra fría está llegando a su fin.

Es ahora posible crear un prototipo interactivo bastante impresionante con una app sin ninguna experiencia en código. Esto significa que los diseñadores pueden probar nuevas aplicaciones sin tener que escribir ni una sola línea de código, y significa que los desarrolladores pueden usar simples herramientas para trabajar en sus diseños con un aire profesional sin necesitar ayuda profesional en sí.

Los diseñadores pueden, obviamente, aún beneficiarse más si aprenden a usar código, y los desarrolladores deberían probablemente estudiar diseño, pero la brecha entre ambas habilidades se está haciendo más y más fácil de unir.

Hace no mucho tiempo, en una Web muy, muy lejos…

Hace No Mucho Tiempo, En Una Web Muy, Muy Lejos…

El rol principal de los diseñadores digitales de cinco a siete años atrás era diseñar imágenes estáticas de páginas y pantallas en Photoshop para luego ser enviadas a un desarrollador mágico que los transformaría en un sitio web o app funcionales. El “mockup” siempre era un resultado limitado. Era estático, los datos eran falsos, y no había interacciones. ¿Alguna vez has hecho un test de usuarios con una imagen estática? No va muy lejos.

La comunicación ida y vuelta entre diseñadores y desarrolladores intentando comprender las intenciones del diseñador crearían cadenas de email lo suficientemente largas para envolver al mundo entero. Semanas de desarrollo pasarían sólo para descubrir, luego del lanzamiento, que lo que el desarrollador comprendió como “deslizar hacia arriba” era muy diferente de lo que el diseñador tenía en mente. Era un infierno.

En un mundo como este, no cabe duda por qué cada desarrollador escribía un artículo donde los diseñadores debían aprender a cómo usar código. El desarrollador que recibía un PSD sin anotaciones con decenas de layers sin nombre no serían culpable por querer tirarse por la ventana.

Al mismo tiempo, los desarrolladores que estaban interesados en diseñar sus propias apps se frustraban por complejas herramientas como Photoshop o Illustrator. Necesitan una educación completa en diseño gráfico además de sus aprendizajes en ciencias de computación para realizar sus ideas. Los desarrolladores que intentan cortar bordes y diseñar para ellos en el momento terminan con apps con bajo nivel de diseño y testeo las cuales tropiezan ni bien entran al mercado.

El Diseño Digital Ya No Apesta

Ahora, la situación entre diseñadores y desarrolladores es significativamente mejor. Con la invención de las herramientas inteligentes de diseños y plataformas como Craft por InVision, la app de InVision, Framer, Flow, Flinto/Principle, y Sketch, los diseñadores y desarrolladores pueden fácilmente diseñar un prototipo de una app y testearla sin que el usuario sepa que están usando una app sin back-end.

La app parecerá funcionar por completo desde la perspectiva del usuario. Cada interacción y flujo estarán ahí. Los diseñadores ganan información valiosa sin tocar una línea de código, y el desarrollador puede crear diseños propios con unos simples clicks.

Miremos de cerca a estas seis herramientas de diseño:

This site has been built from the ground up without one line of code required from the designer—and the site is fully responsive—using Webflow.

This site has been built from the ground up without one line of code required from the designer—and the site is fully responsive—using Webflow.

Craft by InVision

This suite of apps lets designers pull in real data rather than the standard “Lorem ipsum” and Michael Jackson icon filler. The various apps work together to make the design process smoother and more automated. The apps support collaboration, mockup of prototypes, syncing, and most importantly, your own data.

InVision

InVision really changed the game by letting designers create mockups that are not static. With InVision’s simple tools, images can be transformed into clickable, interactive prototypes that feel like real apps. InVision supports collaboration, making it easier for fellow designers and users to comment on changes every step of the way.

Observa el prototipo que fue creado utilizando Marvel (un competidor de Invision):

Un mockup funcional por completo utilizando la app Marvel

Con un mockup funcional por completo comoeste, podrías hacer testeos con usuarios antes de escribir una sola línea de código.

Framer

Framer es casi como InVision, pero tiene la habilidad de conseguir interacciones más complejas. Algunas grandes compañías utilizan Framer para poder diseñar apps que sean intuitivas y útiles, pero también simples. Uber es un buen ejemplo, han usado Framer para diseñar su app de Apple Watch y UberPOOL.

Flinto/Principle

Ambas apps pueden ser usadas para crear animaciones complejas en minutos. Las dos requieren un poco de práctica, pero una vez que los diseñadores obtienen fluidez con estas apps, pueden fácilmente crear animaciones que se verán y sentirán extremadamente profesionales, y no innecesariamente recargadas. Puedes ver aquíuna gran cantidad de increíbles ejemplos de lo que los usuarios pueden hacer con Principle.

Sketch

Sketch es como Photoshop, pero con más o menos cuatro veces más la cantidad de características para desarrolladores web y mobile. Esta poderosa herramienta resuelve el problema de los diseños estáticos que no hacen nada al dejar que diseñadores creen iconos, interfaces, y sitios web que son totalmente únicos y hechos a mano.

Webflow

Este se siente como un gancho de Mike Tyson. Webflow básicamente elimina la necesidad de que los diseñadores escriban código de front-end. Ahora, los diseñadores usan este hermosos editor WYSIWYG para lidiar con toda la carga pesada.

Via: toptal.com