Diseño de prototipos

imagen de pixabay

imagen de pixabay

 
 

Qué es...

Un prototipo es una representación aparente pero concreta de parte o la totalidad de una idea de negocio o sobre un producto o servicio. Un prototipo es una “fachada”, un servicio de cartón/piedra, una simulación. Es decir, que incorpora los elementos básicos para que sea funcional, que se pueda probar, y que responda a una serie de preguntas sobre la viabilidad empresarial de la idea y sobre su modo de implementación.

 

Cuándo utilizarla

Aprender haciendo (learning by doing) es el lema de los diseñadores centrados en el usuario, es una forma de obtener feedback del consumidor lo más rápido posible e iterar en el proceso. Prototipar significa que estás creando lo mínimo necesario para validar tu idea.

El prototipado te ayudará a:

  • Testear, validar nuevas ideas rápidamente
  • Entender las claves de la interacción del usuario
  • Mejorar la experiencia de uso e iterar sobre ello
  • Demostrar la capacidad de un producto (demoing)
  • Validar el detalle del diseño de la apariencia: Definir el propósito de tamaños, colores, sombras, etc.
  • Hay muchas formas de hacer prototipos, depende del tipo de idea que tengas; no es lo mismo la construcción de un prototipo de un producto o de servicio, veamos algunos ejemplos.

Se puede prototipar todo, desde un objeto, un servicio, un trozo de código, de hardware o lo que sea.
Hay muchas formas de hacer prototipos, depende del tipo de idea que tengas; no es lo mismo la construcción de un prototipo de un producto o de servicio, veamos algunos ejemplos.
 

 

Pasos para implementarla

La realización de prototipos es el acto de hacer una idea más tangible, es pasar de la abstracción a una representación física de la realidad, aunque sea muy sencilla. Este trabajo nos sirve para validar la viabilidad del concepto de producto/servicio que tenemos.
Existen diferentes tipos de prototipos y todos ellos son muy útiles, aquí distinguimos entre prototipo en papel, digital y nativo.

Prototipo en papel
 

Imágenes secadas del vídeo de Google Rapid Prototyping

Imágenes secadas del vídeo de Google Rapid Prototyping

Esquejo o dibujo. En inglés se dice “Sketching” y permite hacer un flujo de la interacción del usuario con el producto. Hacer un boceto rápido en una primera aproximación, es altamente recomendado. 
En el caso de una página web o app has de hacer un esquema de las pantallas, explicando la navegación mínimamente. Los expertos en diseño de la interacción le llaman a esto diseño de Wireframes, aunque engloba tanto el papel como el prototipo digital.
Antes de empezar consigue cartulinas de colores, tijeras, pegamento, lápices de colores, y todo el material que consideres útil. Tómate tu tiempo mientras elaboras estas pantallas físicas para pensar ¿Cómo accede a tu página el usuario?, ¿Cómo se registra?, ¿Cómo se autentifica, si es que es un usuario existente?, ¿Qué le aparece primero?, ¿Cómo consigues retenerle para que lea lo importante?, ¿Cuántos clicks hace hasta que compra?, ¿Cómo puedes reducir las barreras para que llegue a tu producto lo más fácilmente?
Como te puedes imaginar hay mil maneras de exponer tu producto/servicio al cliente. Aprovecha el trabajo de prototipado para valorar diferentes opciones. Con el trabajo en papel puedes hacer una maqueta dinámica posteriormente, haciendo fotos con el móvil y enlazándolas para mostrarlo de una forma más interactiva. Este vídeo o secuencia la puedes enseñar utilizar para hacer tus primeras entrevistas de solución.
Pero ¡ojo! Con un prototipo en papel no llegarás a ilusionar, has de dar un paso más allá para ello; con este tipo de prototipos sólo recibirás sugerencias, pero no podrás validar su reacción o intención de compra.

 

Prototipo digital

Imágenes secadas del vídeo de Google Rapid Prototyping

Imágenes secadas del vídeo de Google Rapid Prototyping

Cuando ya tienes una idea más clara del producto, puedes pasar a diseñar en digital. Esto es algo que cuesta un poco más de esfuerzo que el prototipado en papel, pero te ayudará a ahondar más en los temas del diseño del aspecto del producto y sobre todo validar las reacciones de los potenciales clientes dado que les enseñarás algo con un aspecto realista, haciéndoles creer que es un producto real. 

La construcción de Mock-ups de las pantallas es una parte clave para validar la aceptación del cliente, y en esto has de ser muy cuidadoso, diseñando algo que tenga un aspecto “Cool”. No hace falta que sea perfecto, pero tiene que molar.
En el caso de diseño de pantallas aprovecha el prototipo para diseñar la navegación o explicar a través del prototipo cómo funciona la app o web. Para ello es importante que te detengas en incluir las transiciones, los botones, y los Call to action, entre otros objetos. Si tienes un Apple puedes utilizar Keynote para ello; es como PowerPoint, pero con el acceso a un montón de recursos de diseño. En Windows también puedes buscar plantillas de PowePoint en sus librerías que conviertan tu presentación en algo aparente. Otra opción es que compréis una plantilla de diseño en Keynotopia.
Pero además para construir un prototipo digital hoy en día no hace falta saber programar. Puedes utilizar una herramienta de diseño tales como atmomic, marvel, pixate, flinto, InVision, Balsamic, proto, moqups. Tendrás que dedicarle tiempo a conocer una de ellas, pero te aseguro que valdrá la pena dado que podrás mostrar una imagen muy profesional ante el cliente, muy realista y validar la intención de compra en tus entrevistas de forma natural y honesta.

Si lo que tienes que prototipar es un servicio, una gran herramienta es la de Storyboard. En el caso de producto físico suele ser muy útil partir de un producto existente y modificarlo o utilizar una impresora de 3D.


Prototipo nativo

prototipo_nativo.png

El último paso que las grandes empresas de Internet hacen es la elaboración el un prototipo nativo. Esto es muy deseable en caso de Apps, dado que si realmente queremos dar al usuario la sensación de que se trata de una buena app, hemos de incluir dentro del prototipo la interacción con el dispositivo (giroscopio, acelerómetro, altavoces, cámara, micrófono y GPS) que simulan una experiencia realista. Si simplemente encapsulas una web en una App, no esperes que el feedback sea positivo; no es suficiente. 
En el caso de webs, puedes hacer prototipos muy profesionales con las herramientas comentadas, la navegación será realista. Pero en el caso de apps es difícil simular las limitaciones del dispositivo como por ejemplo el teclado, el tamaño de la pantalla. 
Hay gente que utiliza servicios tipo PhoneGapp, que permiten programar en web y luego convertir el lenguaje en código nativo, pero hasta que no tengas integrada la app con el teléfono de una forma realista, no obtendrás un feedback adecuado en ciertos pasos.
Para conseguir esto puedes utilizar un lenguaje de programación muy ágil aunque sea poco robusto y sobretodo muchos frameworks de desarrollo rápido como React que permitan programa HTML, Css, y javasCript en poco tiempo. Otras opciones son las herramientas Ratchet para IOS, o Material UI para Android. Otras opciones XCode (IOS) y Axure.

 

Consejos

Realiza los siguientes pasos antes y después de un prototipo que te ayudarán a provecharlo bien: 
Antes:

1. Investigar: Investigar el potencial usuario/cliente. Se utilizan herramientas como Persona, Canvas, Mapa de empatía para disponer de datos de análisis cualitativos
2.  Conceptualizar: Idear y contruir el prototipo que expliquen la propuesta de idea inicialmente. Se pueden utilizar las herramientas de Escenarios, Role Play, Collage, Storytelling, Storyboard, etc. Utiliza la herramienta de Prototipo experimental para definir al menos:

a.    Cómo lo ponemos en marcha (diseño)
b.    Qué preguntas contesta el prototipo (hipótesis) 
c.    Cómo se van a medir los resultados (métricas) 

Después:

3. Experimentar: Salir a la calle para confirmar el resultado de la teoría o hipótesis, sin demostrarlo “científicamente”. ¡Valida el prototipo! ¿Si no para qué lo quieres? Aborda entrevistas de solución, focus groups, entrevistas con expertos o lo que consideres adecuado.

4. Desechar: Recuerda no prototipar nada que no estés dispuesto a tirar una vez que lo hayas utilizado. Has construido algo para aprender, pero para nada más.

 

Sé profesional en el diseño de prototipos: a la hora de validar un producto es primordial ofrecer al usuario la capacidad de interaccionar con el mismo de forma Pseudo-real y por esto el prototipo ha de ser creíble. Puedes salir con un mockup a la calle en las primeras etapas de tu startup (en estado de idea) pero si lo que quieres es encontrar early adopters, más vale que utilices una herramienta que simule el producto de verdad. Si eres cutre no vas a enamorar, y si no enamoras, no captarán la esencia de lo que les quieres ofrecer.

En el libro de Sprint, hay una definición del nivel de calidad justo de un prototipo que me encanta. Le llaman “Goldilocks quality” o calidad favorable, esta depende del producto a prototipar pero es el punto medio entre “no realista todavía” y “es una pérdida de Tiempo”

 

Un prototipo es un MVP, pero un MVP no ha de ser un prototipo
La diferencia entre un prototipo y un MVP es que un prototipo es una prueba de concepto que analiza la viabilidad de la Solución, pero un MVP es la materialización de a propuesta de valor (UVP) con el mínimo posible de funcionalidades. Desde mi punto de vista, un prototipo siempre es un MVP, pero un MVP no siempre ha de ser un prototipo, dado que se puede preparar un MVP de algo que no tiene nada que ver con la Solución, pero que nos sirve para validar algo del modelo de negocio.
La mayoría de los prototipos están diseñados para responder a preguntas como ¿Podemos construirlo?, cuando un MVP siempre ha de responder a la pregunta: ¿Qué hemos validado/invalidado?

 

Limita el tiempo que dedicas a un prototipo
Seguro que si dedicas mucho tiempo a la construcción del prototipo va a quedar mejor pero entonces acortarás el proceso de aprendizaje. Tienes que encontrar un equilibrio, el prototipo tiene que tener buena pinta, pero no dejarte 3 meses en ello. Acepta que no todas las ideas son ganadoras, ¡no pierdas el tiempo! 
El mayor riesgo que corres si dedicas demasiado tiempo es que te enamores de tu idea. Está demostrado que cuanto más tiempo dedicamos a algo, sea a la construcción de un prototipo o a la creación del producto final, más apegados estamos al resultado, y por lo tanto más nos costará aceptar comentarios negativos respecto al mismo. Después de un día o una semana, seguirás receptivo al feedback, después de 3 meses estarás comprometido.
 

 

Más información

IDEO, Human-Centered Design Toolkit, 2009
https://www.ideo.com/work/human-centered-design-toolkit

 Capítulos de “Rapid Prototyping” y “Live Prototype” de la guía gratuita “The Field Guide to Human-Centered Design”

Blog  Andy Detskas iOS and Android prototyping tools are at a dead end
https://blog.prototypr.io/ios-and-android-prototyping-tools-are-at-a-dead-end-150d51a9697

Video de vídeo de Google Rapid Prototyping
https://www.youtube.com/watch?v=lusOgox4xMI

Mobile App Prototypes with React-Native
https://dev.to/kayis/mobile-app-prototypes-with-react-native
 

Capítulo "Jueves" del libro Sprint

https://emprendeaconciencia.com/libros-recomendados#sprint