interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas daniel benmergui

70
Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Upload: pastor-islas

Post on 20-Jan-2015

9 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Interfases de usuario

100 maneras de arruinar un juego y cómo evitarlas

Daniel Benmergui

Page 2: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Mitología

“Las interfases de usuario no influyen en el éxito de mi juego”

Page 3: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

• Un publisher decide no publicar• Un jugador casual decide no comprar• Un reviewer opina “No vale la pena”

Catástrofe

Page 4: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Arte

Gameplay

Falso!

¿La Experiencia de Usuario?

Page 5: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Arte

Gameplay

Interfaz de usuario

La Experiencia de Usuario

Page 6: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Es la comunicación entre el jugador y nuestro juego

Consecuencias de las fallas• Usuarios frustrados• Gameplay arruinado

User Interface (UI)

Page 7: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

La UI es para el usuario

Diseñarlas para ellos!

El Rey de los Principios

Page 8: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

• No lee prácticamente nada• No memoriza nada• Cuando se equivoca, se frustra• Casual vs Hardcore• Espera divertirse

El Usuario

Page 9: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

• Controles principales• Navegación 3D• Menúes y Diálogos• Cutscenes• Fonts y Texto• Tutoriales• Modos• Savegames• Gerenciamiento de UI

Oportunidades para Errar

Page 10: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

La comunicación más importante entre el usuario y el gameplay

Controles Principales

Page 11: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Obligar al usuario a cambiar continuamente entre mouse y teclado

Consecuencias• Cansansancio• Errores

Blooper: Controles Torpes

Page 12: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

(Screenshot Avernum)

Blooper: Controles Torpes

Avernum 3

Page 13: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Solución• Mouse O teclado, o mouse Y teclado

Blooper: Controles Torpes

Page 14: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Usar acciones dificultosas innecesariamente

Blooper: El Mouse Terrorista

Click

Doble Click

Drag &Drop

Page 15: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

(Screenshots Grow RPG)

Blooper: El Mouse Terrorista

Grow RPG

Page 16: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Consecuencias• Cansancio• Errores

Solución• Acciones frecuentes: lo más baratas

posible

Blooper: El Mouse Terrorista

Page 17: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

(Screenshots arreglados del grow)

Blooper: El Mouse Terrorista

Grow RPG

Page 18: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Los juegos 3D tienen muchas libertades de navegación

Navegación 3D

Traslación Zoom Rotación

Page 19: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Soportar innecesarios movimientos de cámara

Consecuencias• El juego es más complejo• El usuario puede romper la

perspectiva por defecto

Blooper: Libertinaje en 3D

Page 20: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

(Screenshot etherlords)

Blooper: Libertinaje en 3DRotación contrareloj

Rotación reloj

Etherlords

Page 21: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

(Screenshot wc3)

Blooper: Libertinaje en 3D

Warcraft 3

Page 22: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Solución• No implementar movimientos de

cámara que no sean críticos

Blooper: Libertinaje en 3D

Page 23: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Objetos a través de los cuales el usuario toma decisiones

Menúes y diálogos

Page 24: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

No respetar las convenciones del género, ni las del sistema operativo

Consecuencias• Usuarios confundidos

Blooper: Menúes y diálogos no convencionales

Page 25: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Atrapar al usuario

• ESC no va al menú• ESC no cancela• No hay “Cancelar”

Blooper: Menúes y diálogos no convencionales

Page 26: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

“OK” y “Cancel” en lugares raros

Blooper: Menúes y diálogos no convencionales

Page 27: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

No hay valores por defecto

Blooper: Menúes y diálogos no convencionales

Page 28: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

No usar los bordes de la pantalla

Blooper: Menúes y diálogos no convencionales

Page 29: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Controles minúsculos

Blooper: Menúes y diálogos no convencionales

Page 30: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Solución• Imitar• Plagiar• Homenajear

Blooper: Menúes y diálogos no convencionales

Page 31: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

• Ambientar al usuario• Hacerlo empatizar con su personaje• Recompensar sus avances

Cutscenes

Page 32: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Cutscenes “La Naranja Mecánica”

Blooper: Cutscenes Insalteables

Page 33: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Consecuencia• El placer se transforma en dolor

Solución• Usar cualquier tecla, como mínimo

ESC

Blooper: Cutscenes Insalteables

Page 34: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

• Informar• Complementar los gráficos

Fonts y Texto

Page 35: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Usar fonts menores a 10 pts.

Consecuencias• Ilegibles para mayores a 45, o con

problemas vista

Blooper: Fonts diminutas

Page 36: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Blooper: Fonts diminutas

(screenshot SAIIS)

Strange Adventures in Infinite Space

Page 37: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Solución• Mínimo 10 pts. • Recomendado 12 pts.

Blooper: Fonts diminutas

Page 38: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Usar Fonts Divertidas en textos largos del juego, que como pueden ver, son molestas de leer por mucho tiempo

Consecuencias• Dolor de cabeza• Esfuerzo visual

Blooper: Fonts divertidas

Page 39: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Historia: Jorge el Temible volvió de la guerra del Cónclave a través del valle dorado donde se encontró con un dragón que le pidió pan pero como no tenía le dio una piedra marrón y el dragón se atragantó y se murió y por eso ahora tiene un escudo de escamas de dragón que pesa mucho pero es a prueba de cascotes como los que le tiraron un rato antes en el valle dorado y porqué no tenía el escudo cuando pasó eso, porque los que tiran cascotes no son a prueba de dragones, y por axioma de Darwin se exinguieron antes de que los mate un meteorito y…blablabla…

El usuario no va a leer esto, no vale la pena.

Blooper: Mucho Texto

Page 40: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Consecuencia• El usuario pierde tiempo salteándolo• Puede perderse información

importante

Blooper: Mucho Texto

Page 41: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Cuidado con la terminología

Especialmente• Abort (Cancel)• Kill (End)• Execute (Start)

Casual Blooper: Technobabble

Page 42: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

• Evitan los manuales• Orientan al usuario• Enseñan cómo se supone que se

tiene que jugar

Tutoriales

Page 43: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Tutoriales con instrucciones que desaparecen

Consecuencias• Desorientación• Pérdida de tiempo

Blooper: Instrucciones Efímeras

Page 44: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Solución• Dejar las instrucciones hasta que se

completen

Blooper: Instrucciones Efímeras

Page 45: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

• Texto al mínimo• Tutoriales cortos• El ser humano es mucho mejor

imitando que siguiendo instrucciones

Tips: Tutoriales

Page 46: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

(Screenshot wik)

Tutorials por Imitación

Wik and the Fable of Souls

Page 47: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

¿Qué es un modo?

Modos

Page 48: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Implementar modos innecesariamente

Consecuencia• Errores• La interfaz se siente “ineficiente”

Blooper: Muchos Modos

Page 49: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Blooper: Muchos Modos

Monkey Island

Page 50: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Solución• Cambios de modo automáticos• Cuasimodos

Blooper: Muchos Modos

Page 51: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Blooper: Muchos Modos

Full Throttle

Page 52: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

• ¿Qué es un cuasimodo?• ¿Qué ventajas ofrece?

Tip: Cuasimodos

Mantener 5

Presionado

Soltarlo

Page 53: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

• Dejar al usuario hacer algo más importante que jugar

• Protegerlo de sus propios errores

Savegames y sus Diálogos

Page 54: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

El Organo Inextirpable

Page 55: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Obligar al usuario a ingresar una descripción

• No mostrar screenshots• No ordenar cronológicamente• No tener quicksave• No tener Autosave• No poder grabar en cualquier

momento

Bloopers: Savegames

Page 56: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

No proteger al usuario de sus propios errores, o hacerlo torpemente

Solución• Savegames ordenados

cronológicamente• No intrusivos

Blooper general: Savegames

Page 57: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

• Decidir quién es el responsable del diseño de las interfases de usuario

• Decidir cuán importantes son las interfases de usuario en el proyecto en general

Gerenciamiento (Management)

Page 58: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Asignar el diseño de interfases a la persona equivocada

Consecuencias• El diseñador de facto diseña para sí

mismo• No hay “responsables” de la

usabilidad• Intefases plagadas de errores

funcionales

Blooper: No hay diseñador de UI

Page 59: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

• ¿Es el artista?• ¿Los programadores?• ¿Los testers?

Diseñador de Interfases

Page 60: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

UI Designer Game Designervs

Interfases Gameplay

¿Y si no hay “experto”?

Page 61: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

…cuando el deadline de entrega está cerca, y no hay tiempo de arreglar nada

Consecuencia• La interfaz queda exactamente igual

Blooper: Dejar la UI para el final

Page 62: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

En muchos casos, las mejores decisiones de UI para un juego son mucho más fáciles de implementar que los malas

Detectar los errores de UI es muy fácil…

Tip

Page 63: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

User Testing!

• No es caro ni complicado como el testing de funcionalidad

• Es muy eficiente• Es divertido

Solución para todos los problemas de UI

Page 64: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

1) 4 o 5 personas2) Ponerlas a jugar3) Sentarse fuera de su campo de visión4) Pedirles que hagan tareas como

• Pasar de nivel• Bajar el volumen• Salir del juego

5) Tomar nota de las dificultades que tienen

User Testing: Receta

Page 65: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

• Pedirles que piensen en voz alta• No guiarlos• No contestar preguntas• Se está probando el juego, no la

competencia del tester• Anotar las observaciones

Testers: Qué hacer

Page 66: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

• Implementar los consejos de los testers

• No verificar los arreglos• Concluir que los problemas son

culpa de la incompetencia del tester

Qué NO hacer

Page 67: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

• Los fallos estructurales en las UI son muy pocos

• Los usuarios los detectan con facilidad

• Refuerza la autoconfianza

User Testing: ¿Sirve?

Page 68: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

La felicidad es el neto entre nuestras frustraciones y éxitos cotidianos

Conclusión

Page 69: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Preguntas!

Page 70: Interfases de usuario 100 maneras de arruinar un juego y cómo evitarlas Daniel Benmergui

Muchas Gracias!

Daniel [email protected]