Keikendo

¿Qué es Keikendo?
Arquitectura de proyectos digitales
Diseño de Interacción
Generación de tecnología y conocimiento
経験方法

¿Cómo lo hacemos?
Usuario

Diseño de la Experiencia

¿Cómo organizamos esto?
Aceite
Agua
Cacerola
Carne
Cuchillo
Huevos
Pan
Papas
Plato
Sartén
Tenedor

¿Pastel de carne?

¿Milanesas con papas fritas?

¿Carne ensobrada sobre huevo agitado y astillas de pan?

¿Entonces…?
No hay una sola respuesta
No hay una única solución
Depende del contexto
Pasamos de ingredientes a producto, servicio y por último experiencia

Experiencias diseñadas

¿Casos deExperiencias Diseñadas?

Restaurantetradicional

El caso McDonalds
Modelo de negocios de comida rápida:bajocosto, altarotación
Optimización de procesos
Ofertalimitada

Restaurante de comida rápida

El usuario en rol activo
Modelo de negocios de comida rápida:bajocosto, altarotación
Optimización de procesos
Ofertalimitada
Usuarioscomo parte del sistema
Autoservicio
No sobremesa

Sillas anti-sobremesa
“El comportamiento es función de la persona y su entorno” (Lewin, 1936)
Diseñando el entorno, influenciamos el comportamiento
16

Experiencias en software

Diseño Centrado en el Usuario: un enfoque opuesto a..
Diseñoautoreferencial
Diseñocentrado en la tecnología
Diseñocentrado en sponsors
Diseñocentrado en la competencia

WPF Workflow
Fuente: www.WPFTutorial.net

Diseño de interacción
Define el modelo de operaciónde los productos y sistemas con los queinteractúa el usuario
Considera y modela:
Comportamiento del usuario
Respuesta del sistema
...paralograrmejoresexperienciaspara la mayor cantidad de usuarios

Diseño de interacción

CASO ejemplo:Resto PresentationFoundation

PrimerosPasos
Plantearhipótesissobre los casostípicos
Identificarpartescríticas.
Identificarrelaciones y dependencias de funciones.
El encargado de la caja solo cobra
El mozo solo describe lo queentrega
Buscar un restaurant quetengalascaracterísticasbuscadasparaevaluar.

Definimosalcance
Administración de Mesas
Abrir mesa.
Cargarpedido.
Cerrar mesa.
Reservas

Evaluarmodelo
Evaluacióncompetitiva
Evaluacióncualitativa y funcional
Features queno consideramos
Features que son innecesarios o perjudiciales
Features cuyo valor no entendemos
Evitar un producto
“Feature Rich, Quality Starved”

Validación del Modelo CON USUARIOS
Ejemplo

¿Queoperaciones se registran?
¿Se registra cuando se abre una mesa?
No, se registra con el primer pedido.
¿Se registra el cierre de una mesa?
Si, porque hay que cobrar.

¿Es útil o necesaria la presentación
espacial de las mesas?
Cuando llegan varios comensales
Los comensales o el mozo juntan las mesas.
El mozo avisa por control.
De ahí en adelante, se refiere al conjunto usando el número de una de las mesas.

Se manejan "slots“.
A la noche, por ejemplo, hay un "cena temprano" (8pm a 11 pm) y "cena tarde" (11pm a 1am).
De esta manera se resuelve de forma práctica cuando ir "echando gente".
¿Con qué precisión manejan las reservas?
Desde luego, importa registrar como texto
el horario y nombre de la reserva.

Diseño del Modelo
Ejemplo

Prototipos

Metáforas para Reservas

Colorinche (Caso real)
Redundancia en identificación de botón por posición y color

Slots de reservas
Juntar y Seleccionar
Juntar y Seleccionar
Versiónbasada en drag&drop
Versiónbasada en links

Card Sorting
Agrupar funcionalidades sobre modelo mental del usuario

Prototipo Final

Aplicación web
La aplicación que hicimos no tiene sentido como aplicación web.
Lo quetienesentidocomoaplicación web
Publicar el menú
Tomar pedidos de delivery
Tomar reservas

Aplicación web: Delivery
Version 1.0:
Importarmenú (bajarcosto de adopción)
Exportarmenú a Excel (poor’s man sync)
Version 2.0:
Aplicaciónweb hosteada
Tomarpedidos de delivery
Customizable (ref.Yahoo! Store)
Version Mobile: responsive web design

Aplicación Web: wireframes

Mobile: wireframes

Búsqueda de estilo

Opciones de menú / submenú
A)
A +B)
A+C)
auto scroll up

Mobile: Version final

Revisión de la web en base a la version mobile final

Responsive web design
Consiste en diseñaraplicaciones de maneratalque el contenido se adapte a los distintos dispositivos.
Media Queries: Declaraciones de CSS específicasparadeterminadascondiciones de contexto.
@Media screen and (max-device-width: 480px) {
header { display:none; }
.main { width:100%; }
}
Viewport Meta: Para definir las condiciones iniciales de escala y ancho del dispositivo.
<meta name="viewport" content="width=device-width; initial-scale=1.0">

Responsive web design
El mismo HTML responde de diferentes maneras según el dispositivo.

Responsive web design – Media Queries

Ejemplos basados en sitios reales

¿Cómo podemos hacereste trabajo repetible?

IxD en el proceso de desarrollo

¿Quién desarrollasoftware?

¿Quién incorpora diseño de interacción?

“
Hay un punto en el que sólo se puede mover la complejidad de un lugar a otro.
”
Larry Tesler.Pionero de IxD.

10001010010010
11101010010100
10010010100011
01010010100100
11100101010010
10001001001111
10000000000101

¿Qué es un Diseñador de Interacción?
“
Aquel que facilita lo que una persona quiere lograr con otra a través de dispositivos y servicios.
”
Dan Saffer.Gurú de IxD.

“
Hay diseños intencionales y otros que se cometen.
”
Santiago Bustelo.Filósofo Contemporáneo.

Ya están diseñando la experiencia del usuario.

Sólo resta que elijan cómo quieren hacerlo.

Modelo de Madurez

Calidaden
Ingeniería del Software

𝐶𝑎𝑙𝑖𝑑𝑎𝑑

∞
𝐶𝑜𝑠𝑡𝑜

0

𝑅𝑒𝑞𝑢𝑒𝑟𝑖𝑚𝑖𝑒𝑛𝑡𝑜𝑠


Portabilidad
Reusabilidad
Interoperabilidad
Facilidad de recibir mantenimiento
Flexibilidad
Susceptibilidad de someterse a pruebas
REVISIÓN del PRODUCTO
TRANSICIÓN del PRODUCTO
OPERACIÓN del PRODUCTO
Corrección Confiabilidad Usabilidad Integridad Eficacia


∞
𝐶𝑜𝑠𝑡𝑜

0

Etapas del proceso deDiseño de Interacción
Objetivos y análisisinicial
Decisiones de diseño
iteraciones
Mantenimiento y validación
80

5 Fases de adopción de Metodologías Agiles para Diseñadores
Craig Villamor.Gurú de IxD.

Paradoja
Niveles 4 y 5
Equipo de Desarrollo
Diseñador de Interacción
Una
La
Solución
Solución
Metodologías Agiles

...y los tipos de problemas.
AlfonsCornella

Bien Definidos
Algoritmo
Perversos
Heurísticas

∞
𝑖/𝑡

AlfonsCornella.Especialista en Gestión de las Org.
𝑡/𝑖

0

Tecnología
Psicología
∞
𝑡/𝑖

𝑖/𝑡

0

Tecnología
𝑖/𝑡

𝑡/𝑖

E-
S-
Smart
Electronic

Repasando Agile
Manifiesto

Repasando Agile
En Scrum…

7 Razones por las Cuales Recomendamos Metodologías Agiles

Estrategia de Integración al Sprint: Dentro del Desarrollo
Desarrollo y IxD
Tiempo

Estrategia de Integración al Sprint: Fuera del Desarrollo
Investigación
IxD
Diseño
Desarrollo
Tiempo

El Diseñador de Interacción en la Organización
Centralizada

El Diseñador de Interacción en la Organización
Distribuida

Qué opción elegir?
Centralizada
Distribuida
Fuera del Desarrollo
Dentro del Desarrollo

Depende

Influencia de la Suerte.
Replicabilidad de los Resultados.

Por algún lugar hay que empezar.
Consejos para Mañana a la mañana.

Sincerar el Diseño

Diferenciar Claramente

Pedido vs. Intención vs. Necesidad

La tecnología no es el fin.
Es un medio.

Analicen la competencia.

¿De qué se queja más tu usuario?
Ya tenés por dónde empezar…

No cambiar es más costoso.
Son males evitables.

¡No hace falta ser original!
MUCHA bibliografía.
MUCHAS (buenas) experiencias.

www.keikendo.com

http://www.corvalius.com	183
http://www.palermovalley.com	71
http://corvalius.com	10
url_unknown	1

Keikendo

by Keikendo on Apr 29, 2011

Accessibility

Categories

Tags

Upload Details

Usage Rights

4 Embeds 265

Statistics

Keikendo — Presentation Transcript