Herramientas para diseño de prototipos

Herramientas para prototipos de diseño.

Aquí dejo algunas referencias sobre programas y recursos para hacer prototipos de diseño:
(en construcción)

Origami Studio
Origami Studio

ORIGAMI STUDIO
Una nueva herramienta para diseñar interfaces modernas, construida y utilizada por diseñadores en Facebook.
Crea prototipos con capas de Sketch y juega con máscaras, sistemas de partículas y cámaras en vivo.
Se puede copiar cualquier cosa de Sketch y pegar las capas nativas en Origami Studio.

Sketch, kit de herramientas de diseño digital.
Sketch, kit de herramientas de diseño digital.

SKETCH
Sketch es un conjunto de herramientas de diseño digital para transformas sus diseños en prototipos interactivos. Mediante símbolos de trabajo, podemos actualizar fácilmente los elementos de diseño diseño repetidos, desde iconos hasta avatares.
Para Mac, desde $99.

Balsamiq, wireframes con calidad de boceto.
Balsamiq, wireframes con calidad de boceto.

BALSAMIQ
Wireframes y prototipado rápido de la estructura de una web o aplicación (‘mockups’). Reproduce la experiencia de dibujar en una pizarra, pero usando una computadora.
Aplicación con versiones para trabajar en la web, en el escritorio o en Google Drive.

UXPin, plataforma de diseño UX.
UXPin, plataforma de diseño UX.

UXPin
Herramientas de diseño web y móvil, prototipos y colaboración en la nube para equipos de trabajo.
Aplicación online de pago desde 9 dólares al mes. A partir de ahí, la suscripción va subiendo según funcionalidades contratadas: Exportar PDF, HTML, PNG, mockups, integración con Sketch y Photoshop, integración con Google Fonts, acceso a la librería de diseño y a la documentación…

INVISION, plataforma de diseño colaborativo.
INVISION, plataforma de diseño colaborativo.

inVISION
Invision Studio: Herramienta en la nube para diseñar pantallas para web y móviles. Plantillas de diseño, prototipos, animaciones, comentarios instantáneos sobre los diseños de trabajo en progreso.
Aplicación con versiones para trabajar en la web, en el escritorio o en Google Drive.

InVision DSM (Design System Manager): Componentes de UX y librerías.
Integración con otras herramientas colaborativas como DropBox, Jira, Slack, Confluence, Teamwork, Trello, Basecamp, Microsoft Teams.

Subscripciones desde coste cero (1 prototipo) hasta 99 euros al mes (equipos de trabajo, sin límite).

HTML5: El futuro tiene muchos nombres

Texto publicado en VisualThinking.es.

Hace relativamente poco tiempo que las páginas en la red no tenían imágenes. El vídeo, la infografía o los gráficos interactivos eran un sueño para muchos diseñadores y editores. Las páginas eran puramente textuales y, así, las posibilidades de diagramación eran mínimas. Con la llegada de los ‘movie clips’, el PDF y el reproductor de animaciones ‘Flash’ los contenidos empezaron a moverse.
Rápidamente iban surgiendo tecnologías que se convertían en estándares para la comunidad digital. Pocos se preguntaban si aquello era realmente un modelo universal. Funcionaba después de darle muchos cabezazos al teclado del ordenador; cumplía el objetivo.

¿Funcionaba en todos los navegadores y sistemas operativos? No. Ante un problema de funcionalidad se buscaba la solución que abarcase la mayor parte del mercado. Es decir, se dejaba fuera una parte importante. Por tanto, funcionábamos sin un estándar. No existía. Lo que teníamos eran varios estándares propietarios desarrollados por las compañías de navegadores. Compartían vocabulario, pero no escritura y pronunciación.

Objetivo 2014
La llegada del lenguaje HTML5 (‘HyperText Markup Language’, en su versión número 5) es un hito histórico en el desarrollo del diseño web. Pese a que todavía está en desarrollo, la normativa final HTML5 se espera que sea aprobada en 2014, las posibilidades que ya conocemos son plenamente satisfactorias. En 2010, Steve Jobs dio las primeras pistas: ‘Los nuevos modelos creados en la era móvil, como el HTML5, ganarán el mercado’.

A partir de aquí comenzó a hablarse de un enfrentamiento entre los lenguajes Javascript (estandarizado en 1996) y ActionScript (propiedad de Adobe), HTML5 (abierto) y Flash (propiedad de Adobe) y los sistemas operativos MacOs X (Apple) y el Android (código libre basado en Linux).

En 2009, el ‘World Wide Consortium’ (W3C, la autoridad que valida el lenguaje HTML5) y el ‘Web Hypertext Application Technology Working Group’ (WHATWG, la comunidad que desarrolla el lenguaje HTML) decidieron caminar juntos para desarrollar definitivamente un estándar para la web, un lenguaje de etiquetas abierto a la participación de todo el mundo, no dependiente de compañías propietarias del desarrollo y que fuera compatible con todas las tecnologías de la web.

HTML5 no es propiedad de ninguna compañía. Las compañías deciden desarrollar con este lenguaje porque entienden que es el que mejor cumple sus expectativas de negocio. Lógico. En la era móvil y social todo el mundo quiere estar en todos los frentes. Por tanto, las batallas planteadas en los últimos años son molinos de viento que no merecen más comentario. Lo importante es que va a existir un estándar compatible con todos los navegadores y con el que ya se puede trabajar.

Sumando códigos hermanos
La combinación del lenguaje HTML5 (etiquetas básicas de la página) con las posibilidades del lenguaje en cascada CSS3 (estilo y presentación de las etiquetas) y el lenguaje de programación orientado a objetos Javascript (desarrollo de operaciones y aplicaciones) y todas sus librerías (gráficos, efectos visuales, formularios, tablas, matemáticas, criptografía o AJAX) es todo un reto para cualquier desarrollador, creativo o diseñador.

A finales de septiembre, Adobe Systems lanzó oficialmente al mercado el programa de gráficos animados Edge Animate 1.0. De momento, es gratuito y se descarga en su página web. Edge es una tecnología para crear contenido con HTML5, Javascript y la librería JQuery. Por tanto, los trabajos realizados con Edge alcanzarán todo el mercado de los móviles sin necesidad de instalar nada en ellos. El diseñador no se tendrá que preocupar de las excepciones de cada dispositivo o navegador, sencillamente porque ya no existirán. Esa es la promesa.

El problema actual es que no todo el mundo tiene instalado en su ordenador las últimas versiones de los navegadores, que son las que están preparadas para visualizar los contenidos en HTML5. A medida que las empresas pongan al día sus máquinas y los usuarios vayan descargándose las versiones más recientes de los navegadores, HTML5 empezará a crecer exponencialmente y conoceremos realmente todas sus posibilidades. Recuerdo ahora esta frase de la escritora francesa Françoise Sagan: ‘Sólo cerrando las puertas detrás de uno se abren ventanas hacia el porvenir’.

———————————-

Quick Tour VT.

———————————-