Diseño de apps móviles – Javier Cañada

Presentación de la charla en el blog de Vostok
Presentación de la charla en la agenda de Elisava

@javiercanada

En el ejemplo de Caoba, que es una aplicación de dating, el reto es cómo muestras información y cómo permites profundizar.

Ejemplos de apps de dating: OkCupid, Match (ha fagocitado a todas las demás porque va comprando las que son exitosas), Meetic, eDarling

Lo primero que hay que determinar es cuál es la unidad de contenido de referencia.
Al investigar, nos encontramos que la gente que no sabe contar lo mejor de sí misma, o ser realista. Las descripciones son aburridas y anodinas. El 90% de las personas no se saben contar bien ni describir bien, sus perfiles no te dicen nada. El reto era conseguir sacar lo interesante de una persona para que hable mejor de sí misma.

También que las personas nos entran por los ojos, y normalmente los perfiles de los sites convencionales de dating tienen mucho ruido y poca imagen.

Javier nos enseña cómo desde Vostok se intenta ‘lubricar’ las conversaciones de Caoba. Es un carrusel de imágenes donde luego puedes profundizar en un perfil que te ha gustado.

¿Por qué decidieron que fuese una aplicación móvil?
– App Store gestiona muy bien las cosas (usuarios), te despreocupas de que un usuario tenga problemas logueándose, etc.
– Contexto de uso: Hay tres enfoques posibles, Need oriented o enfoque orientado a la tarea. Podríamos tener un enfoque orientado al usuario User oriented. Y el tercer enfoque sería Moment oriented, algo que se va a hacer en ratitos tontos. Usamos el móvil para ratos muertos, y la actitud de buscar pareja es algo que está en segundo plano, muy sutil, y en determinadas circunstancias. Eso nos hacía decidir que como eso te acompaña, no puedes hacer una aplicación de escritorio, sino ir a momentos muy específicos y sutiles.

MODELO
¿Cuál es el modelo mental de alguien que está buscando pareja?
– Ni idea de lo que busco: Las aplicaciones para no buscar nada concreto son facebook, pinterest o flipboard.
– Sí busco algo muy concreto: Las interfaces son más textuales como correo electrónico o dropbox. No miras a los lados. Es lo contrario de ver escaparates. Bucear en las profundidades.
– Sé algo de lo que busco más o menos: Buceo de superficie.

La App de Meetic te pide un montón de datos y los criterios de filtrado son demasiado estrictos. En Caoba han decidido no centrarse en los datos, sino que la interacción se parezca más a un zapping. Si sólo hay un campo de búsqueda, no sirve para hacer escaparate.

FUNCIÓN
Ley de Hick: “El tiempo necesario para seleccionar una opción crece logarítmicamente con el número de alternativas”
Cuantas más opciones de interacción entre usuarios, más débiles son las interacciones, menor es su significado.
El menú de Caoba sólo tiene 5 opciones.

“La hamburguesa sólo lleva al fast food del diseño” Cañada opina que es mejor no tener un botón para esconder toda la mierda porque te evita la obligación de simplificar.

MENSAJE
La imagen es el mensaje, como en The Big Picture de Boston.com.
La decisión de diseñar sólo para iPhone tiene que ver con la calidad de las imágenes.
La idea es poder aprovechar esa capacidad que tenemos de contarnos visualmente, como en Instagram. Da más riqueza de mensaje, aunque no haya texto.
Dos tipos de botón: el botón negro y el naranja. Fulanito te ha copiado la foto. La aplicación cada x personas te hace una pregunta, con tres respuestas y una respuesta libre.

FORMA
Ley de Fitts
Comfort zone.

PROCESO
Discusión ¿qué hace a un diseñador Senior?
Para Cañada el Senior es el que ve qué pasará, horizontal en el diseño y en el tiempo, capacidad de ver qué es lo que hay fuera de la pantalla que diseña.
Nuestro proceso es muy importante, el pasar fotos necesita, como toda buena historia, de narrativa. A veces son consejos, a veces preguntas. La idea es conseguir que sea un paseo.

UTILIDAD
Que sea útil es muy importante.
Modelo Fax: La utilidad del fax es un modelo creciente del número de personas que lo estén usando. Como por ejemplo Facebook, twitter, whatsapp o Meetic.
Modelo vídeo: Es útil si lo tiene otra gente, el contenido se mueve entre usuarios. Pero también es útil de forma individual, podías grabarte un programa de TV, y hacer simplemente un uso egoista. Ejemplos serían Instagram, Pinterest, Dropbox, Minube o Spotify.
Para Cañada lo importante es que sirvan para las dos cosas, si sólo vale porque lo usa el resto de la gente, cambia con las modas. Lo que quiere con Caoba es que sirva aunque seas el que menos liga del planeta, aunque no te comas un rosco. La idea es coger Nerds y convertirlos en Sinatras, intenta mejorar el perfil de la gente que es buena con el ordenador pero es muy mala con la otra gente.

¿Cómo evitar las fotos malas?
– Consejos que te van saliendo en la aplicación, cómo hacerse fotos mejores.

¿Se ha pensado en que la ayuda sea contextual?
– Sí, pero no es tan intrusivo, la idea es que sea un tip al día.

¿Por qué está cerrado por género el número de personas con las que puedes interactuar?

– Porque consideramos algo muy bueno no saber cuántos competidores tienes.

Anuncios

[UxSpain] 16.00 – 16:45 Javier Cañada – Los Sistemas y la Belleza

Javier Cañada (linkedin, twitter). Introducción en la web de UxSpain. Entrevista en el blog de UxSpain.

EDITADO:
Javier nos pasa su presentación en un tweet. Como nos deja compartirla libremente, la meto aquí y te ahorras un click:

* Diapositivas de la charla “Los Sistemas y la Belleza” [Descargar] [Ver online]

Los Sistemas y la Belleza

Hay un momento muy bonito cuando encajan todas las partes y todo funciona como un reloj.

Los sistemas no son algo nuevo, sino una imitación de la naturaleza. Esas estructuras son lo que intentamos imitar cuando diseñamos.

Belleza

De la belleza lo que le interesa a Cañada es la belleza clásica, como ya nos comentó en su clase del Kungfux.

Formas geométricas, el gusto por la estabilidad por los rectángulos de determinado tipo.
Neutralidad: Estar ahí y ser discreto.
La simetría: Cuantoas más ejes más bello.
Propósito: Que cumplen su función.

Sistemas que cumplen sus funciones

Sistema Billy de IKEA. No es una estantería sola, sino un conjunto de proporciones que pueden funcionar de muchas maneras, con diversos materiales.

Sistema de contenedores marinos que inventó Malcom MacLean. Vio que había que jugar al tetris dentro de los barcos para el transporte de mercancías y pensó que debería optimizarse. Inventó los contenedores cargo que hoy en día se utilizan en todo el mundo.

Sistema Simón de interruptores de pared. Son sistemas cuadrados de varias piezas y muchos aspectos distintos. El aspecto estético no es parte del sistema, lo importante es lo estructural. Encajan y harmonizan porque todos siguen la misma proporción.

¿Qué tienen en común?
En todos estos sistemas, hay varias capas y cada una cumple una función. Y lo mejor de todo es que se puedes usar para muchas cosas. Son contenedor y son contenido, son pura estructura. No son función, pero sirven para la función, le dan orden al caos. Son independientes de los visual, hasta podrían ser invisibles. Son ecosistemas. Y por supuesto belleza. Facilitan el geometrismo. Los sistemas son geometrismo, si está bien pensado te va a servir para los próximos die años.

Enseñar cosas

Javier nos enseña de pasada algunas cosas que han hecho en Vostok, para que noe se diga que en UxSpain no se enseña nada. Entre ellas floresfrescas.com

La tecnología nos hace humanos

¿Cómo podemos hacer la tecnología más humana? Quizá no necesitamos más humanidad, sino belleza.

“Buscad la belleza, es la única protesta que realmente merece la pena en este asqueroso mundo” 
Ramón Trecet

* Debate con el público sobre la expresión “enfrentarse a un cliente”. Cañada contesta que sólo quieres un cliente que sea un amigo al que quieres ayudar. Su estudio es pequeño y sólo tienen su reputación, si un cliente es un problema, es mejor dejarlo pasar.

[UxSpain] 13:45 Pablo Sánchez ¿Somos los diseñadores infalibles?

Pablo Sánchez (linkedin, twitter). Introducción de UxSpain.

Pablo Sánchez en el UxSpain

Pablo ha compartido su presentación en Slideshare:

Somos los diseñadores infalibles?

A veces pensamos en el sector que lo sabemos todo. Empieza citando a Daniel Kanheman, premio nobel de economía.

A menudo usamos atajos que nos ayudan a resolver problemas ¿Qué pasa cuando estos atajos son inconscientes? Que nos equivocamos con razonamientos erróneos. Son sesgos cognitivos. No tienen que ver con la inteligencia de la persona.

¿En qué momentos podría afectarnos?

* Pensamiento grupal: Efecto del grupo en el pensamiento individual. La mayoría de las veces buscamos el consenso de forma inconsciente. Para evitarlo no buscamos consensuar sino puntos débiles y fuertes de cada idea y dejar para otro día el momento de elección. Definir claramente los criterios de decisión.

* La anécdota que se converte en generalidad: Arquetipos que se crean de forma intuitiva. La solución estaría en no conformarse con lo primero que se nos ocurre.

* Sesgo de confirmación: En tests de usuario, por ejemplo. Hay que intentar hacer falsables la teorías, notar si estás queriendo que una teoría sea cierta. Tamibén evitar ser uno mismo el que hace las pruebas de usuario. Pero si lo tienes que hacer tú, ser más desconfiado con nuestras teorías que con las de los demás.

Conclusiones

– Confirmamos que los diseñadores no somos infalibles
– Confiar en el diseño iterativo
– Ser humildde
– Desconfiar a priori del pensamiento intuitivo
– Apoyarse en datos objetivos y empíricos
– Cuestionar el pensamiento gurú

Bola extra

Lista de prejuicios cognitivos en wikipedia

Canción para aprenderse los sesgos cognitivos

Javier Cañada – Diseño

Javier Cañada (linkedin, twitter)
12 años en diseño de interacción.
Luego en Indra
The Cocktail, cuando empezaron, dos años y medio.
Luego fundó 11870 con Jesús Encinar
Y ahora Vostok. Desde conceptualización de servilleta hasta diseño de pixels. No hacen programación ni diseño front.
Mucho de lo que aprendió sobre diseño de producto lo podemos encontrar en su antiguo blog Terremoto.net.

Javier viene sin guión, como pactó con Isa, y empieza dándonos algunos consejos. Por ejemplo que pasemos de blogs, libros, diseño de interacción, etc. Todo lo que se puede saber para diseñar está en el teléfono…. En el diseño de un producto, hay muchísimo más conocimiento puesto que en cualquier cosa que se esté haciendo ahora en internet.

Los libros para hacer webs (el del oso polar por ejemplo) están desfasados porque no incluyen táctiles. En cambio los clásicos siguen igual de vigentes, como por ejemplo Designing for People de Henry Dreyfuss.

Javier luego nos pregunta por nuestra familiaridad con las aplicaciones táctiles, e Isa le comenta que hay dos grupos con proyectos que son aplicaciones de iPad, cosa que nos lleva a comentarlos con él.

¿El diseñador de interacción debería o no diseñar visualmente?

Luego abrimos el debate de si el diseñador de interacción debería saber diseñar o si debería ser otra fase de la cadena, y eso nos lleva a los maquetadores. Javier piensa que si somos como arquitectos y constructores, el maquetador se corresponde más con el lado del constructor, y que lo que tiene que hacer es ser fiel a los planos, igual que un desarrollador.
“Yo no hablo con maquetadores”
“El desarrollador debe frustrarse con su trabajo porque le viene todo dado”
“El visual depende de la interacción, porque es más importante”

¿Wireframes?

Un subdebate debate es si debe haber wireframes y cuántos entre la servilleta y el píxel perfect. Javier piensa que los wireframes son de una época donde el cliente no entendía nada de internet y que al comercializar y cobrarse los wireframes, estos se han pervertido, de forma que vender esos wireframes acaba siendo el negocio, por encima de que el proyecto final sea bueno.
“Yo creo que no deberían haber wireframes”

¿Trabajo en equipo?

Javier prefiere la seguridad de una idea consistente al riesgo de que sea una idea mala consensuada. Por eso opina que siempre debe haber una voz cantante en cualquier trabajo en equipo, para cumplir tiempos y objetivo.
“Sólo debe haber una persona que hable con el cliente, cuantos más puntos de interlocución, más posibilidades de que se joda”

Metodología

Javier pone en duda las metodologías donde la idea de cómo se va a hacer algo sale de todo un proceso. Muchas veces esas idea está clarísima desde el principio, pero es políticamente incorrecto decirlo.
Elena -Eso no es un líder, es un dictador
Javier – Pues yo me quedo con la palabra dictador. A veces hace falta un tirano. Y hay que determinar responsabilidades si sale mal.
“Las ideas no son todas igual de respetables”

Selección de proyectos

Javier nos cuenta que a algunos proyectos les ha dicho que no, y eso no ha significado perder clientes. Alguna gente le dice que puede elegir porque tiene un estudio pequeño y que no podría hacer eso si fuese una empresa grande.
“Pero es que yo no quiero ser una empresa grande”
“Yo creo que no puedes ser bueno si no escoges los proyectos”
“No vale de nada la cantidad sino la calidad de lo que haces”

Principios de diseño

Diseño para durar. Por ejemplo floresfrescas.com no se ha cambiado desde que se hizo. También diseña todo para que pueda ser táctil.
“Firmaría con los ojos cerrados el decálogo de Dieter Rams o Otl Aicher.

Javier hace una matriz de belleza local vs. universal y temporal vs. atemporal, y él intenta diseñar lo más universal y lo más atemporal posible. Cosas como los colores neutros, la simetria, proporción (en la proporción está la estabilidad, da confort, la proporción áurea) …

Función y forma

El de visual intentará encontrar siempre la belleza, que las tipografías sean más harmónicas, más bellas
El de interacción intentará hacer algo que no canse mucho la vista lista de
Nos recomienda la muestra futura que hay ahora en La Imprenta Municipal.
Nos habla de la silla ant diseñada por Arne Jacobsen.

Recursos:
* Javier nos recomienda mucho El Mundo Como Proyecto de Otl Aicher, “El mejor libro de diseño que hay”
* Para más libros, Javier nos refiere a su post The 26 books that shaped me as an interaction designer. “Lo escribí precisamente para que no me volviesen a preguntar esto.”
* Entrevista a Javier Cañada

Diseño (II) – Manuel Muñoz

Mamuso (linkedin, twitter) viene a explicarnos cómo aterrizar las pantallas.

Hoy vamos a construir cosas. “Hello screen”. Pantallas pequeñas, cuando le compensa hacer un prototipo y cuando no. Tienes que tener un fin para ponerte a hacer un protipito, los prototipos nos son gratuitos. Pero sí es verdad que cuanto antes hagas uno, antes te das cuenta de que falla.

Mamuso nos cuenta cómo llegó en diseño industrial y nos recomienda Como Nacen Los Objetos – Bruno Munari. Luego nos cuenta qué es Arduino, donde trabajó y nos pone de ejemplo la radio que diseñó Jordi Parra:

Displaying information on the device from Jordi Parra on Vimeo.

Un prototipo es algo que le ayuda a Mamuso a responder preguntas y plantear preguntas nuevas: “Te hace explorar cosas que ni siquiera te has planteado”. Además, es un medio para comunicar ideas, a veces la gente no se lee la documentación y es más fácil sentarse con ellos y el prototipo. También es un recurso para recoger feedback de usuarios, nos pone el ejemplo de los seguros para el automóvil. Para móviles desde luego es imprescindible: “cóño, qué peque

  • Prototipado para pantallas grande = bueeeno, vale
  • Prototipado para pantallas pequeñas = imprescindible

Sistemas:
PAPEL: Mamuso nos insiste que en prototipos pasemos siempre por papel y rotuladores, es un lenguaje universal y compatible. “El papel y el boli es totalmente imbatible”.

GALERIA MOVIL: Qué es lo siguiente más barato? Se pueden hacer las pantallas a ordenador, se hace una captura, se pasa por edición simplemente para ajustar la resolución y se ponen en la galería de imágenes del móvil, es baratísimo y no cuesta nada, y es el sistema más práctico más fácil.
COLLAGES: “Los auto-complete se hacen con papel vegetal”.
POGÜERPOINT. El siguiente es el sistema más desaprovechado: el keynote-powerpoint, hay un montón de cosas que podéis hacer (keynote para móvil emula incluso con gestos).
HTML-CSS-JS. Lo que se llama frontend. Esto enfocado a UX nos va a contar los principios, pero a veces te lías a hacer cosas y te pasas. Html Doctype, cabecera y después etiquetas de estructura. CSS se encarga de pintar cómo se ve, tenemos un selector donde y le decimos que caractarísticas tiene. Javascript se encarga de las acciones.

“Maquetar es hacer cajas”. Cada caja es [dibujo de cajas padding, margin, etc]
“El png transparente es de modernos, de gafapastas, todo el mundo lo sabe”
Maquetar es una mierda por esto:

chrome, firefox, explorer, opera, safari
solamente el debugging ya cuesta una ojo de la cara.
“Deberían tipificar el miedo que tienes a abrir tu maqueta en explorer”

En móviles solemos pensar en Iphone, android, blackberry, windowsphone. Aunque en realidad 21 navegadores, 15 OS y 14 fabricantes.
En tuenti el móvil que trae más tráfico es el Nokia 5310, no puedes obligar a nadie a comprarse un smartfon, así que para la web movilal final segmentaron.

Las cosas que hay que saber del CSS: Position y float. El mantra. Si más o menos entiendes como funciona vas bien….

CSS3
transition – animation
background gradients (que dejarán de estar de moda cuando se extienda)
hsl hlsa rgba Los colores tradicionales no han sido muy personalizables.
attribute selectors: “Píntame con el fondo azul los elementos impares”

Redefinir atributos de esa web según el tamaño del dispositivo o de la posición. Esto era una técnica de gafapastas. Hay un sitio donde tienen ejemplos que es http://mediaqueri.es/. Una web seria que lo ha implementado es The Boston Globe. Complica la vida al diseñador de interacción pero facilita la vida al maquetador. También aquí hablamos del bootstrap de twitter.

JS
function ahoy () {
document.getElementById(“wadus”).className = “odd”;
}
Hay gente que no sabe JS pero sabe usar jquery u otros similares. El proceso debería ser inverso, pero para mostrar y ocultar una capa usas cuarenta capas de JS.
Aquí también hay debate, porque aquí el perfil se mezcla de los ingenieros de verdad con diseñadores “que quieren ser ingenieros”. La discusión también viene por rapidez versus

y finalmente:
HTML 5
El problema que tiene es el nombre. Son unas cuantas etiquetas nuevas y una pila de apis que son JS
Grad and drop
Storage
Geoposicionamiento
Websockets
Webmorkers
….

Pero te das cuenta de que tu base de navegadores sólo soporta eso el 15% y no puedes hacerlo.

Lego vamos a ver tab, que está basado en fireworks. Y que nos va a servir muchísimo para tener un prototipo muerto antes de empezar.

[Descanso]

Mamuso nos enseña ahora ejemplos de prototipos en imágenes para el móvil. También nos enseña un caso en el que se complicaron mucho la vida y moló mucho, querían testar el send delivery, y había una idea que no tenían claro si funcionaba y se dijo “necesito ver esto funcionando”, así que hicieron algo que pudiesen testear en un móvil de verdad, un framework con respuestas de Cleverbot para que pareciese un chat de verdad.

Tap no es una herramienta que sea especialmente popular. No hace falta ser un genio para usarla y lo único que tienes que hacer es cuadrados grandes y . Flexible, gratis y tienes prácticamente de todo. Podemos definirle un icono para la aplicación (que si tienes varias versiones de las pruebas va muy bien), decirle en qué pantalla empieza.

Hemos pasado a los postits

Ahora Mamuso nos explica cómo funciona Tap. Cómo lincar. Nos ha pedido que hagamos primero en papel porque tres personas pegándose sobre un pepel es agresivo pero tres personas pegándose sobre un ordenador es mucho peor.

La librería lo que va a hacer por nosotros va a ser exportar todos los enlaces que hemos puesto, con todas las imágenes.
Usuario, sites, tap.. y ahí está.
¿Para qué estamos haciendo el export?

Embark es una aplicación en Estados Unidos que te soluciona el problema de ir de un sitio a otro. Siempre te da aire fresco estar trabajando en algo y ver otra gente que lo ha resuelto bien.

Ahora abrimos el fireworks y pegamos las imágenes como pantallas. Luego nos bajamos el archivo de PNG de la web de Tab y lo abrimos con fireworks. Copiamos y pegamos los botones, Command+T para redimensionar. Luego lo guardamos como dreamweaver y lo abrimos en safari para verlo.

Diseño (I) – Ale Muñoz

Hoy viene Ale Muñoz.
La gracia del diseño es hacer cosas, pero las cosas hay que pensarlas un poco.
Vamos a hablar de metodología y de workflow.

De metodología porque Ale cree importante tener en cuenta la forma en que se hacen las cosas. Como las tuberías de una casa: no es opcional. Algunos diseñadores piensan que la metodología son una serie de reglas que limitan su creatividad y se ponen nerviosos, pero para Ale es un proceso que ni más ni menos describe cómo pasa uno de una idea a un algo que se puede tocar.

Recomendación libro Hugh Dubberly How Do You Design como compendio de metodologías. Las hay de muchos tipos, pero todas describen la forma de pasar de una idea a ese algo concreto.

De workflow, fases por las que se pasa desde la idea al entregable. Hoy vamos a ver este proceso y entre la clase de hoy y la de mañana deberíamos tener una idea clara de cómo es nuestra aplicación. La razón de poner una aplicación móvil es porque es un ejemplo bastante manejable, pero podemos hacer lo que queramos en los casos prácticos de estas dos clases.

El ejemplo que nos propone Ale, es diseñar una aplicación de la EMT que no sólo haga lo que tiene que hacer (es lo mínimo que se le puede pedir a una aplicación) sino que además le cojas cariño. Ale pone el ejemplo de su podómetro, que además tiene su nombre.

Ale nos cuenta ahora cuales son los tres pilares del diseño móvil según él:

  • Simplicidad: una aplicación o un servicio móvil debería ser tan simple como sea posible. Simple en el sentido de que sea fácil de usar (que también) sino que una apliación móvil debería servir para hacer una sola cosa.
  • Una cosa, rápida.La gente usa el móvil para comprobar que no tiene mensajes sms, twitter y la hora, pero no usa la conexión a internet con el 100% de su atención.
  • Contexto de uso: No estamos diseñando para gente que está sentada en una silla con la mirada en una pantalla.

Pasos:

  1. Requerimientos
  2. Casos de uso: Los casos de uso nos van a definir funcionalidades y no al revés.
  3. Funcionalidades: Muchas veces en proyectos de base tecnológica se hace un proyecto en base a una novedad técnica y esto es un error.
  4. Arquitectura de la información
  5. Magic Mamuso -) trucos de magia
  6. Versión cero de la aplicación: Es una versión cero porque el proceso de diseño parte de una hipótesis, no tenemos toda la información que necesitamos hasta que no hemos solucionado el problema, y hasta que no tenemos esta aplicación cero no podemos testear la hipótesis. Serie de iteraciones que nos sirven para comprobar que la hipótesis es válida y la solución que hemos propuesto funciona.

¿Quién hace cada cosa?
– Cliente
– Si se parece a un anuncio es del departamento de márketing
– Funcionalidades: un señor gordo que vive en un sótano.
– Arquitectura de la información = arquitectos de la información
– Prototipado y las siguientes = diseñadores de interacción

¿Qué hace la aplicación de la EMT a día de hoy?
– Cuáles son las paradas cerca en forma de lista y de mapa
– Buscador por palabra
– Buscador por calle
– Buscador por código QR de la parada
– Buscador de rutas por destino de inicio como de final, favoritos, por mínimos trasbordos
– Listado de todas las líneas de autobuses de Madrid
– Favoritos
– Noticias: incidencias, buzón de sugerencias, suscripción a incidencias

¿Qué nos parece más interesante de lo que hay? (requerimientos)
– Cómo llegar: rutas + tiempo
– ¿Cuánto falta?
– Parada más cercana
– Llego a tiempo?
– Recorrido
– Alarma
Nota: En esta lista siempre hay una putada.

Casos de uso:
Es importante que pensemos en casos de uso antes de que tecnología porque, si tenemos un cálculo malo de trayectos quizá es interesante que no ofrezcamos eso sino otra cosa que le pueda servir a ese tipo de usuario.
Habrá que tener en cuenta cómo de rápido camina el usuario, lo que le importa caminar, o en un metro si el sistema de trasbordos tiene ascensores, como en este mapa del metro de barcelona.

PERSONAS:
* El “extranjero”
* Usuario habitual
* Minusválidos/Mayores/Padres con carrito
* Planificador
Nota: Si algo no tiene suficiente entidad como persona, podría ser un caso de uso. En vez de ser una persona con prisa, podría ser cualquiera de nuestras personas con prisa.

Funcionalidad:
Si las incidencias las asocio a una línea que es la que consulto más, entonces es una funcionalidad.
Uno lo que se plantea es descomponer un caso de uno en

Principio de complejidad de Tesler. Cada sistema tiene su complejidad y la idea es no dejar la complejidad en manos del usuario. Que la complejidad del proceso se traslade a la parte invisible. Diseño centrado en el usuario es pensar cuáles son las necesidades del usuario.
Siempre que tenemos un proceso hay que preguntarse:
¿Puedo hacer esto más rápido?
¿Puedo hacerlo más fácil?
¿Puedo ponerle un poco más de magia?

Por ejemplo, la geolocalización es magia. La versión móvil de sindelantal.com tiene on botón que dice “estoy aquí”, y eso es magia.

“Los de google también se cubren las espaldas. Te dicen, oye que los trayectos a pie están en fase beta, que lo mismo cruzas zonas peligrosas.

“Todo el mundo ha estado en un bar de copas, no?”.

[descanso]

“Las empresas llaman a sus personas con nombres que no se atreven a decir en público”
“Ponlo en inglés, que parece que duele menos”
“Si no hay testigos todo es correcto”

Ale añade una persona más, el prescriptor, porque la gente ya habla sobre aplicaciones, las últimas que se ha descargado, si molan o no, etc. Aunque al final nos hemos quedado con tres y hemos dibujado sus perfiles.

Ale nos avisa que uno no sabe cuando empezar a “pintar”. O lo haces demasiado pronto y se te olvida hacer cosas, o lo haces demasiado tarde porque y has recogido tanta información que no sabes por dónde empezar.

Lo que sí vamos a hacer es enumerar las pantallas necesaria para realizar cada tarea.
El truco para prototipar para móvil es localizar el rotulador más gordo que tengamos y el papel más pequeñito. Es una forma de evitar que nos disparemos en el pie.

Por defecto asumimos que todo el mundo tiene mucha prisa a menos que se demuestre lo contrario.
Un gran recuso es “esto lo haremos en la versión siguiente”
o “eso se arregla luego en diseño”

Funcionalidades:
Ir a casa
Cuanto falta (¿Home? – La home hay que decidirla al final). La idea es que

¿Qué pantallas necesitamos?

  • Pantalla del usuario: Cuanto falta para que llegue tu bus favorito a tu parda favorita. Con preferencia si podemos decirle si llegas o no llegas, si tienes que correr o no.
  • Favoritos. Lo que sea, un nombre, con un icono que nos permita desfavoritear. Otro que nos diga si es un lugar, linea o parada.
  • Búsqueda. Si vamos a poner un campo origen y destino. Destino el último que haya puesto. Botón de búsqueda.
  • Resultado de la búsqueda (en mapa por defecto, en lista como opción). Dónde estoy yo, donde está la parada, cuál es la ruta, cuanto voy a tardar y a qué hora voy a llegar.
  • Detalle parada. Número de la parada. Iconito para añadir a favoritos. Las líneas que pasan por la parada.
  • Detalle linea. Número de la línea. Si la quiero añadir a favoritos. La ruta visual.
  • Detalle de destino, que nos va a permitir guardar en favoritos cosas que no son paradas ni lineas

Para mañana traer el fireworks descargado.

Teoría de diseño y toma de decisiones – Ariel Guersenzvaig

Ariel Linkedin, twitter, http://interacciones.org/

Racionalidad

¿Qué es racionalidad?
Racionalidad en la RAE
Racional en la RAE

Cuando decimos razón a qué nos referimos? Uno tiene una razón para obrar de determinada manera.
Aristóteles “El intelecto humano discierne la verdad por medio de la lógica” (*) es racional aquello que es lógico.

Pero cuando actuamos es de cara al futuro, y en la lógica no nos va a dar eso. Aunque esta concepción se mantiene hasta que llega Boole con una concepción de probabilidad. Pero Ariel no cree que esta concepción de probabilidad no nos conviene porque lo que importa no es el contenido sino la forma.
Una constatación empírica no es lo mismo que una deducción. Los seres humanos somos más racionales con las coses que conocemos y allí tomamos mejores decisiones. nos sirve para evaluar en algo que está formulado ya pero no nos sirva para saber “dónde echar la red”. El sistema mente y exterior.

Determinismo causal de Laplace
“Une intelligence qui pour un instant donné connaîtrait toutes les forces dont la nature est animée et la situation respective des êtres qui la composent […] embrasserait dans la même formule les mouvements des plus grands corps de l’univers et ceux du plus léger atome : rien ne serait incertain pour elle, et l’avenir, comme le passé, serait présent à ses yeux”.

Principio de incertidumbre de Heisenberg

Racionalidad ilumitada. es el primer concepto que

Daniel Bernoulli la racionalidad es cuando maximizamos el valor esperado de una decisión.

En cada momento debes sospesar ventajas y de cada decisión. Blaise Pascal “Tenéis dos cosas que perder: la verdad y el bien… “

Lo que vemos es que el foco ya no está en el proceso, si razono bien, si pienso bien, sino que está en el resultado. Qué alternativas tenemos. Ya hablamos de optimización.

Luego viene Daniel Bernoulli que se da cuenta de que “una ganancia de 1.000 ducados es más significativa para un pobre que para un hombre rico, aun cuando el monto de la ganancia es el mismo”. Hay un criterio subjetivo en el valor de algo. Tu decisión es siempre personal.

Valor esperado
+ Criterios subjetivos
——–
Utilidad esperada

Dice Ariel que los únicos nobeles de economía que se utilizan y funcionan son de psicólogos.

El programa se abandona hasta 1950.
Paradoja de San Petersburgo

Algunas definiciones

La razón es una Jesús Mosterín

La racionalidad es una clase de procedimientos par decidir. James March

Una definición para andar por casa “El pensamiento racional es aquél que ayuda a los seres humanos a alcanzar sus metas”. Pero a veces no tenemos tiempo de evaluar todas al alternativas.

Qué es la toma de decisiones
La toma de decisiones como un curso de acción, microdecisiones. Eldar shafir “Decision-making is the process of choosing a preferred… ” Como ejemplo

Árboles de decisión Bayesiano son modelos coherentes internamente, modelo normativo-prescriptivo que dice cómo deberían obrar los seres humanos para tomar decisiones bien, pero no enseña cómo las toman en realidad.

Y aquí la pregunta ¿Qué es decidir bien? ¿Cómo es decidir bien?
Bien = acercamiento respecto de un ideal basado en consideraciones a priori.

Theory of Games and Economic Behavior más estadístico, luego viene Leonard Jimmie Savage que le da el toque personal subjetivo.

Cada alternativa tienen una utilidad (subjetiva) esperada.
Teoría formulada a partir de axiomas.
Si los

— por eso es racional normativo prescriptivo

Axiomas irreales:
Los obetivos deben estar en términos cuantitativos
Ninguna situación es estable.

Implicancias irreales:

  • Los deicores tienen información completa
  • Los decisores entienden la información
  • Los decisores son capaces de calcular y comparar todos los pros y contras de cada alternativa

Aversión al riesgo

1950-1970
– Limitación lógiga (incertidumbre)
– Limitaciones psicológicas

Asumimos que la racionalidad no es ilimitada.

Racionalidad limitada

Zona de indiferencia. Cuando comparamos dos cosas, los criterios que hemos elegido para comparar, los hemos elegido intuitivamente. Da una apariencia de racionalidad que no es real. De hecho, la gente normalmente cuando compara cosas que se quiere comprar ya tienen uno o dos preferidos, y cuando les sale otro… modifican los atributos para que les dé lo que ellos quieren.

Parálisis del análisis. Evalúan eternamnte. La cantidad de información que podemos analizar siempre es eterna.

Howard Gardner

CAMBIO DE PARADIGMA
Herbert Simon. Falta de tiempo, tu comportamiento es adaptativo y debes desechar información. Aunque eso no significa que el proceso de búsqueda de información acabe aquí.

Satisficing: Mezcla de satisfacer y suficuente. Busca la primera opción que sea mínimamente aceptable y adecuada.

Modelos
Racionalidad ilimitada
Normativo prescriptivo

Racionalidad limitada
Descriptivos analíticos: Aceptan que nuestra racionalidad es limitada pero utilizan el criterio de probabilidad todavía para decidir bien. Describen cómo la gente se comporta. Han aceptado la racionalidad humana limitada. Kahnemann

Naturalistas: Proponen un tipo de racionalidad que no es analítica, no compara opciones.
Dan Arielly Predictably Irrational (divertidísimos de leer) lo alucinante es que somos estúpidos cuando no estamos en nuestro ámbito.

Los humanos tienen limitaciones cognitivas se expresan en el comportamiento mediante errores de comportamiento. Kahnemann nos dice que hay sesgos cognitivos.

Volviendo al bueno de Kahnemann. “Nuestras pérdidas valen más que nuestras ganancias” es más importante para alguien. Framing, el fenómeno de enmarcado, porque el enmarcado en el diseño lo es todo, es cómo de acercas, depende de nuestra felicidad fel framing.

Con Tversky formula:
“We use the term ‘decision frame’ to refer to the decision­maker’s conception of the acts, outcomes, and contingencies associated with a particular choice. The frame that a decision­maker adopts is controlled partly by the formulation of the problem and partly by the norms, habits, and personal characteristics of the decision­maker.”

La felicidad Kahneman se ve afectada por del efecto de la primacía y recencia. La sensación de felicidad tiene mucho más que ver con cómo recuerdas ahora las cosas.

El problema es que la vida no es una situación experimental. En los experimentos no tienes nada que perder.

Racionalidad ecológica
Herbert Simon encaja tanto en DA como en NAt. “La conducta racional humana está determinada por una tiejtas …” . Pienso en el entorno donde estoy. Se debe de abandonar la idea de optimizar, de lo que se trata es de seleccionar una alternativa de acción en un mundo de incertidumbre.

[Pausa]

Vamos a seguir con el modelo naturalista. Hay un libro estupendo Cognition in the Wild de Edwin Hutchins que nos explica que para saber cómo toma la gente decisiones hay que salir del laboratorio.

El modelo naturalista entiende que la decisión se toma en un paisaje cognitivo. El paisaje cognitivo incorpora un montón de variables que se eliminan en un experimento de laboratorio. El paisaje cognitivo involucra el propósito de la decisión, la experiencia previa, aspectos propios de la situación, naturaleza del problema, herramientas disponibles (no es lo mismo para un boceto de una casa tener un lápiz o con un lego), trabajo en equipo (tienes que negociar,persuadir encontrar un territorio común), restricciones institucionales/culturales/etc (unas normas cultirales de tu país, región, empresa).

Naturalistic decision making
Las hipótesis con las que trabaja no son axiomas

  • Los decisores estiman la situación
  • Desarrollan y modifican un único curso de acción sin comparación (y lo va evaluando consigo mismo y con sus objetivos)
  • Se contaentan (satisficing)
  • Atúan en incertidumbre (haces algo y no sabes si lo que haces va a funcionar de la manera que tú quieres
  • El proceso es constructivista (vas creando, encajas la realidad en tu manera de entenderla)
  • La toma de decisiones y la resolución de problemas están interrelacionadas (tú tomas decisiones pero los problemas hay qeu formularlos, por eso es un modelo constructivista

Gary Klein
Si antes era analizar y luego actuar, Klein y su gente nos dice que analizas un poco, actúas un poco, vuelves a analizar y vuelves a actuar y así iterativamente.
Cuando diseñamos no hacemos un wireframe y ya está, sino que hacemos un montón de vueltas, porque ess idas y venidas nos ayudan a analizar el problema.
“Instead of analyzing the components of the problem, they tell a story to explain the various facts. When expert mentors teach novices, in the field and by the water cooler, they communicate their lessons by means of stories”

Modelo recognition primed decision making
(Empírico, generado a través de toma de decisiones) Te enfrentas a una situación nueva, la tratas de entender, la tratas de enfrentar con lo que has vivido.

  • Modelo empírito CTA
    – Sensemaking
    – Mental stimulation
  • No comparativo

¿Qué pasa? Que en algunas situaciones hacemos más sensemaking o más simulación.

Modelo simplificado de NDM de Gary Klein

Los expertos son expertos no sólo porque son la hostia reconociendo anomalías. Si tú no sabes detectar anomalías, no te das cuenta de que las cosas van mal.

Sensemaking
proceso de enmarcar y reenmarcar datos en un marco que te va a ayudar a entenderlo. Intentas meter los datos en tu manera de entender y tu manera de entender en los datos.

  • Elaborar un marco
  • Cuestionar un marco
  • Re-enmarcar

Este modelo es el que a Ariel le sirve para estudiar o explicar el comportamiento de los diseñadores.

Palabros:
Toma de decisiones desde la economía.
La resolución de problemas se aborda desde la psicología.

¿Cómo piensan los diseñadores? (no cómo deberían pensar)
Diferentes modelos (los modelos es una simplifa
Cómo se juzga un buen diseñador, por su trabajo, formular los problemas de forma diferente.

“Design in the performing of a very complicated act of faith” John Chris Jones en Designing design. Ese primer paso es un paso abductivo, lógica distinta del “es verdad o no es verdad” es “puede ser o no puede ser.

En este libro se inventarizan un montón de métodos de diseño Design Methods (Architecture) John Chris Jones

los diseñadores diseñan en un montón de entornos distintos. Trabajamos en equipo. Pero todos tenemos el punto de partir del no hay nada y que después haya algo. Pero los diseñadores no construimos cosas, el diseñador lo que hace es un plano para construir, representaciones sobre cómo va a ser, y el trabajo del diseñador acaba cuando esa representación está acabado. Hay una diferencia ontológica importante. En diseño de interacción esa zona es más borrosa.

Le Corbusier no hacía casas, hacía los planoes.

John Chris Jones divide a los diseñadores en tres modelos:
Caja transparente: La información entra, análisis, síntesis, evaluación, óptimo. La misma manera de pansar que los filósofos de esa época. Imperativo lógico
Caja negra: Sistema nervioso, el diseñador es un mago, pasan cosas en su mente que no podemos explicar. Input-output, magia. Algo inaccesible, místico, mágico
Autoorganización: Muy revolucionario en los 80. La teoría del diseño moderna va en esta dirección. Analizar el problema y analizarnos a nosotros mismos analizando el problema.

Diseñador como recolutor de problemas es problemático. Hablemos de problemas y veremos por qué es problemático.

¿Qué es resolver un problema?
“Resolver un problem es transformar una… ”

Esto y si además buscamos:
“Problem solving amount to…”
Kuhn VanLehn

Pero esto nos dice poco sobre qué es un problema. Un diseñador resuelve problemas, pero ¿qué tipos de problemas?

Hay problemas bien formulados y problemas “less bien formulados” Simon
(posibilidades de ajecrez).

En cambio los problemas de diseño, como planificación urbana, son problemas que no están bien definidos de inicio, no tienen un resultado claro ni operadores.

Los problemas de diseño son Wicked problems. El problema no se entiende hasta la formulación de una solución. La formulación de una solución no es la única, por eso necesitamos hacer una versión, no es ensayo y error, sino que investigamos para poder entender el problema.

“What you need to know about a problem only becomes apparent as you’re trying to solve it” Richard McCormack, architect

Así que esta idea de absorber todo y luego solucionar, no nos sirve, porque dejamos de lado el tema de la formulación del problema. Una solución inicial no es una solución. ¿Como vamos a hacer una planificación si no sabemos qué vamos a hacer.

El resultado al que vamos a llegar va a depdender de cómo enmarcamos el problema.

Fijación de ideas iniciales. ser conscientes de que esto puede ser un problema nos puede servir para quitarnos este sesgo. A los diseñadores nos cuesta mucho reenmarcar nuestra visión cuando la solución temporal no es la nuestra.

Número limitado de alternativas. Los diseñadores exploran varias alternativas al mismo tiempo. La divergencia puede ser positiva, brainstorming, etc. A veces la idea inicial es tan fuerte que la divergencia posterior es más difícil.

El dibujo es el instrumento y el resultado. La naturaleza del dibujo no es el resultado final. Son herramientas pero a la vez instrumentos de trabajo.

Rol de la conjetura inicial. El momento ajá, o insight. Hay un punto donde damos un salto.

“First decide what you think might be an importan aspect of the problem, evelop a design on this bese what else you can discover about the problem”
Brian Lawson

Darke lo que encuentra es que esta reducción se va al principio. No es una solución radicalmente diferente.

Y todo va por aquí, en el diseño el generador primario te genera una conjetura, paradógico en la naturaleza del diseño, que la síntesis precede al análisis.

Estrategia del proceso:
Principios rectores. Todos los tenemos, algunos tenemos más claros que otros. Los heurísticos por ejemplo son principio rectores. por supuesto un señor con experiencia ha aprendido de sus propios errores y tiene más plasticidad.
Oportunismo: Un diseñador con experiencia conoce más formas de afrontar un problema, se puede saltar pasos o volver atrás. Presupuestas más rápidos. Los diseñadores notables tienen una manera de hacer las cosas pero no tiene problemas para, de manera razonada, cambiar las reglas.
Serial y paralelo: A veces trabajas en un trabajo muy específico en profundidad o un tema muy genérico con poca profundidad.
Iniciación, interpretación y desarrollo: Hay movidas iniciadas desde cero, interpretas, y luego está la movida del desarrollo.

Reflexión
En la acción y acerca de la acción. Son dos tipos de reflexión.
Precedentes y referentes. Precedentes son trabajos previos propios y de otros. Referentes son modelos de buen diseño. Un diseñador novel conoce menos y por eso puede generar menos diseños.

Vemos que las investigaciones en el ámbito del diseño no van en el patrón de análisis, síntesis y evaluación. ¿Qué modelo usar?

Nigel Cross, modelo de coevolución. Tu exploración del subproblema construye el problema. El proceso es contructivo.

Donal Schön sobre aquellos profesionales que reflexionan sobre su trabajo. Los diseñadores se preguntan “The designer asks himself: What if I did this?” Es pensar una solución rápida, simular cómo podría funcionar. He pensado sobre el tema y a partir de ahí voy a tener mejores ideas.

Los diseñadores pensamos haciendo. Se espera que los diseñadores piensen más de lo que se nos pidió. Un problema bien formulado tiene una solución obvia.

Referencias:
Jane Darke

Bryan Lawson (what disgners think, what designer know) How Designers Think, Fourth Edition: The Design Process Demystified

Kees Dorst

Kees Dorst | Interpreting Design Thinking – Long version from UTS Business on Vimeo.

Nigel Cross Design Thinking: Understanding How Designers Think and Work (130pag, interesante, design thinking, nada que ver con el design thinking casposo, más bien cómo piensan los diseñadores)

Debate

En un brainstorming depende de un montón de factores. Depende también del moderador, de cómo se conoozca la gente, etc.