La Brecha Entre Desarrolladores Y Diseñadores Está Desapareciendo
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…
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 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 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):
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.
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 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.
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.
Apps sin nada de Código
Heco: Esta agencia ha creado animaciones increíblemente complejas y han logrado un front-end bastante sofisticado sin desarrolladores front-end, usando sólamente Webflow.
Cómo su lista de pendientes (ó to-do list) funciona en este mockup en vivo. Al hacer tap en la app, puedes ver la funcionalidad entera de cómo Todoist funciona sin conjeturas.
Crear animaciones CSS solían necesitar hechiceros del CSS que supieran cómo trabajar con transformaciones, retrasos 3D, e interminables CSS y JS hacks para crear algo complejo. Con Webflow, puedes crear algo como esta animación en la mitad del tiempo y sin escribir una sola línea de código.
El Futuro Es Diseño, Y Hay Mucho Para Ver
Con herramientas de diseño como esta, los diseñadores no tienen que enfocarse en imágenes estáticas, y no tienen que depender de desarrolladores para crear prototipos profesionales, hermosos y funcionales.
Al mismo tiempo, los desarrolladores ya no tienen que depender de lo diseñadores para ofrecerles grandes ideas. Los desarrolladores pueden y deberían comenzar a añadir habilidades de diseño a su currículum, comenzando con las herramientas mencionadas anteriormente. Ninguno de estos programas son particularmente complejos de aprender, y si los desarrolladores dejaran de depender de los diseñadores y comenzaran a crear hermosos prototipos por sí mismos, podrían hacerse profesionales más fáciles de contratar y experimentar la satisfacción (sin mencionar los ahorros) de llevar sus ideas del concepto al mercado.
Esto podría sonar como malas noticias para los diseñadores, pero no lo son. Con el añadido de una simple integración de API, flujos de trabajos automáticos, y la habilidad de traer datos reales, los diseñadores pueden crear prototipos sofisticados y testeables sin tener que constantemente tener el ida y vuelta con un desarrollador. El resultado es que el diseñador puede enfocarse en lo que hacen mejor: diseñar.
No hay más necesidad para que el trabajo de un diseñador sea interpretado e, inevitablemente, manchado por alguien que no comparte su visión. Así que aunque estas mismas herramientas le permiten a los desarrolladores diseñar, eso no debería amenazar a los diseñadores experimentados. En vez de preocuparse por los desarrolladores metiéndose en su área, los diseñadores deberían tener la ventaja con todas las herramientas descritas con anterioridad y seguir apuntando hacia adelante con sus creaciones.
Comentarios
Publicar un comentario