DIPLOMADO ANDROID USER INTERFACE DIA 2. Prototipos de media (wireframes) COMO SON: Grises Sin imágenes Sin diseño CUANDO DE USAN: después de definir la.

Presentación del tema: "DIPLOMADO ANDROID USER INTERFACE DIA 2. Prototipos de media (wireframes) COMO SON: Grises Sin imágenes Sin diseño CUANDO DE USAN: después de definir la."— Transcripción de la presentación:

1 DIPLOMADO ANDROID USER INTERFACE DIA 2

2 Prototipos de media (wireframes) COMO SON: Grises Sin imágenes Sin diseño CUANDO DE USAN: después de definir la arquitectura y antes de iniciar la fase creativa y de diseño emocional PARA QUÉ: Para mostrar la arquitectura con claridad Para ver los componentes de la interfaz Para iterar con el equipo

3 Prototipos de media Balsamic http://balsamiq.com/products/mockups/ (free) Codiqa https://codiqa.com/ (licenciado) Índigo http://www.infragistics.com (licenciado / 30 días free) Pencil http://pencil.evolus.vn/ (free) Axure Prototipos interactivos(licenciado / 30 días free) Sencha http://www.sencha.com/products/architect/ (licenciado) Prototyper http://www.justinmind.com/(licenciado / free) Protoshare http://www.protoshare.com/(licenciado / 30 días free) Fluid https://www.fluidui.com/(licenciado / free 10 screens) POP: appstore /google play(free) Software disponible

4 Ejercicio por equipos: Crear su propio prototipo con PROTOTYPER de Justmind instalado en los equipos Mínimo 4 páginas 20 minutos

5 En el primer pantallazo ¿se puede saber que es esta app y para que sirve? ¿Los términos usados son claros y obvios ? Al hacer clic en cada opción, ¿encontró lo que esperaba encontrar? Déjele una lista de sugerencias a sus compañeros Ejercicio 2 (20 Minutos) Cambio de grupos y prototipos Deje que su prototipo lo analice otro grupo y usted analice otro prototipo PREGÚNTESE

6 Revise el informe de sus compañeros…, ¿qué se puede mejorar? Ejercicio 3 (10 Minutos)

7

8 Evaluación heurística Realizada por expertos

9

10

11

12

13 Ejercicio 4 Vamos a corregir el prototipo pero vamos a aplicar principios básicos para crear buenos CTA (call to actions) Qué son los call to actions (CTA) ?

14 Herramientas de verificación User test: http://www.usertesting.com/http://www.usertesting.com/ Verify: http://verifyapp.com Solidify: http://solidifyapp.com/tour/examplesVerify Five second test http://fivesecondtest.com/ Landing page: www.landerapp.com

15