Examen final, aplicación del clima: Your Weather

Examen Final: Aplicación del Climapara móviles

IntegrantesDaniela Pardo / Maria Jesus Abarca / Nicol Valenzuela / Bernardo Catrilef / Christopher Fattori

1

Metodologías aplicadas

Estrategia (metodologías, planificación de tareas, benchmarking)

1 2

3

Arquitectura de la información (diseño de contenidos, mapas de navegación)

4

Diseño de la interacción (wireframes navegables)

5

Diseño de la interfaz (tipografía, cromática, iconografía, maquetación)

Comportamiento de las personas (personas y escenarios, expert review, análisis heurístico)

2

Se nos pide realizar una aplicación para móviles, con el fin de desarrollar todos los conocimientos adquiridos, desarrollados y potenciados durante este trimestre. Cada grupo escoge un tema y nuestro equipo de trabajo escoge “Clima”.

Luego se delegan las tareas y se planifican los plazos de entrega de cada fase del proyecto, el gráfico a continuación muestra el proceso de producción y las tareas que fueron necesarias para la realización de la propuesta final.


1

3

Estrategia y benchmarking

Arquitectura de la información

Pruebas de usabilidad

Análisis heurístico

Diseño de interacción

Diseño de la Interfaz

Personas y escenarios

Diseño de los códigos de la interfaz

Expert review

3 días

2 días

3 días

(*) algunas tareas fueron realizadas en forma paralela para reducir el tiempo de producción.

1

2

3

4

5

6

7

8

9

1 día

3 días

3 días


Aplicación del ClimaMóvil - Planificación de tareas

1

4

(1) WeatherPro / (2) Met Office Weather / (3) Amazing Weather HD/ (4) Yahoo Weather / (5) The Weather Channel / (6) WeatherBug

Estudio del mercado Aplicaciones del Clima para móviles

BenchmarkingMóvil -Estudio del Mercado


1

5

Análisis y gráfico comparativo Aplicaciones del Clima para móviles

Hora de Actualización

Hora del Amanecer y Atardecer

Velocidad y Dirección del Viento

Presión

Humedad

Visibilidad

Rayos UV

Precipitación

Lugar

Fecha

Temperatura Min. y Máx.

Temperatura

Weather Live(iOS)

Weather+ Met OfficeWeather

The WeatherChannel

AccuWeather

(7) Aplicaciones Android en Google Play(8) Aplicaciones de Apple(9) Mark Myerson, 24 Junio 2013. Appstorm - Android.

BenchmarkingMóvil - Análisis y gráfico comparativo


1

6

10

50

100

BIEN CALIFICADO (5 estrellas)

250

500

750

1.000

1.500

2.000

2.500

3.000

3.050

MAL CALIFICADO (1 estrellas)

CANTIDAD DE VOTOS

APP

1. AccuWeather 2. The Weather Channel

3. WeatherBug 4. WeatherLive

5. Weather+ 6. WeatherPro 4. Yahoo Weather

(10) Fuente: www.sensortower.com

BenchmarkingMóvil - Visualización de votos


1

7

Nombre: Gabriela PardoEdad: 24Ocupación: estudiante universitaria, carrera ing. civil industrialNivel de usuario (móvil): avanzado, uso frecuente de la apps.

Descripción: Gabriela es una estudiante de último año de su carrera, de la cual egresará este año. Utiliza su tiempo libre en salir con sus amigos y viajar por el país, ya sea por placer o por trabajo. Cuando sale, se preocupa mucho por la ropa que va a utilizar, ya que le gusta estar cómoda, así que revisa el clima cada vez que puede.

Escenario: Está preparando un viaje hacia Punta Arenas y su prioridad es la ropa que llevará. Lo primero que hace antes de preparar el equipaje es ver el clima en su celular, revisa el pronóstico dado para Santiago, para saber qué llevar puesto al llegar al aeropuerto y el pronóstico de Punta Arenas de toda la semana para empacar la ropa necesaria.

Personas y EscenariosEstudiante universitaria, uso frecuente


2

8

Nombre: Cristian OlivaresEdad: 22Ocupación: estudiante universitario, carrera medicina veterinaria Nivel de usuario (móvil): medio, primer uso de la aplicación

Descripción: Cristian es un estudiante universitario que dedica la mayoría de su tiempo libre para jugar en la computadora o salir con sus amigos. Cuando sale no le gusta tener peso extra, por lo que muy pocas veces lleva una mochila o un abrigo, ya que le molestaría tener algo que no va a ocupar.

Escenario: Tiene una junta con unos amigos en un local de la ciudad. Muy pocas veces se fija en el clima, pero amaneció nublado y le preocupa que llueva. Revisa el tiempo en su celular y sólo se enfoca en saber las precipitaciones: la aplicación representa las precipitaciones con gráficos de sol, nubes y lluvia así que sólo necesita un vistazo para saber si lloverá o no.

Personas y EscenariosEstudiante universitario, acción marginal


2

9

Nombre: Paulina BernalesEdad: 27Ocupación: Guía de turismo aventuraNivel de usuario (móvil): avanzado, uso diario

Descripción: Paulina lleva trabajando en el Canopi Mantagua por 2 años como guía para los visitantes. Ella misma definió un recorrido por los distintos obstáculos y cerros del lugar para los visitantes a su cargo. Siempre tiene que estar al tanto de las condiciones del lugar, ya sea por variables físicas o climáticas.

Escenario: Mientras que espera a que llegue su primer grupo, revisa el clima en su celular. Además de informarse acerca de la temperatura y las precipitaciones, ve la presión, que es una variable importante si el recorrido los hace subir y bajar el cerro; la velocidad del viento, para prevenir accidentes en los obstáculos; la intensidad de los rayos UV; la humedad, y la visibilidad del terreno.

Personas y EscenariosGuía de Turismo Aventura, uso diario


2

10

(11) Gráfico del formulario realizado a usuarios


2

Análisis y gráficos de los resultadosMóvil - Pruebas de usabilidad

11

Tras el benchmarking realizado, se realiza una serie de encuestas a los usuarios para obtener otra perspectiva respecto a las aplicaciones de clima. Se evalúa aspectos como: uso de la aplicación (frecuencia), requisitos y puntos críticos.

(12) Tiempo de usabilidad de usuarios(13) Datos importante para los usuarios


2

Análisis y gráficos de los resultadosMóvil - Pruebas de usabilidad

12

Arquitectura de la información (diseño de contenidos, mapas de navegación)

3

CLIMA APP

Fecha Temperatura

País

Temperatura

Ubicación

Pronóstico del Día

Presión

Presión

detectar ubicación

Pronóstico de la Semana

no usar GPS

selección ubicación

intervalo de actualización

actual

actual

actual

actual

actual

actual

cantidad

cantidad

dirección

dirección

visibildad

visibildad

nivel UV

nivel UV

unidad de temperaturac°

si

si

escribir

mph m/s

F°

no

no

km/h beaufort

dd-mm-año

pequeño

negro

mm-dd-año

mediano

blanco

año-mm-dd

grande

15 min 1 hora

knot

30 min 3 hora

formato de fecha

español

proveedor

máxima/mínima

máxima/mínima

mayor/menor

mayor/menor

mayor/menor

mayor/menor

hora del día

hora del día

velocidad

velocidad

amanece

amanece

ocaso

ocaso

unidad de velocidad de viento

color de texto

inglés

tamaño de texto

francés

etc ...

Lugar

Precipitación

Región

Precipitación

Acutalización

Temperatura

Viento

Ciudad

búsqueda

Viento

Unidad de Medición

Sensasión Térmica

Sol

Latitud / longitud

Sol

Pronóstico Min y Max

Humedad

Humedad

Idioma

HOMEMi Ubicación

CONFIGURACIÓN DETALLESTiempo local

MAPABusca una ciudad

pantalla 1

mapaseleccionar tag

seleccionar tag

tag

tag

tag

tag

tag

tag

tag

tag

tag

tag

tag

tag

tag

tag

tag

tag

tag

tag

tag

tag

seleccionar tag

seleccionar tag

seleccionar tag

seleccionar tagbotón botón

botón botón botón botón

botón botón

botón botón

botón botón botón

botón botón botón

botón

botón

botón

Ciudadbotón

botón

botón

tag

tag

pantalla 2pantalla 5 pantalla 3pasar a pasar apasar a

Temperatura

Presión

actual

actual

actual

cantidad

dirección

visibildad

nivel UV

máxima/mínima

mayor/menor

mayor/menor

hora del día

velocidad

amanece

ocaso

Precipitación

Viento

Sol

Humedad

tag

tag

tag

tag

tag

tag

SELECCIÓNMis Ciudades

pantalla 2

Hora de Actualización

agregar

(14) Mapa de navegación para aplicación de clima en móviles y/o smartphones

Mapa de NavegaciónMóvil - Aplicación de Clima

13

Creación y aplicación de wireframes navegablesprogramas utilizados html, fireworks y silverback

Diseño de la Interacción (wireframes navegables)

4

Wireframes NavegablesMóvil - Primera versión

14


4

1 2 3 4 5 6 7 8 9 10 11 12 13

SÍ

N/S

NO

¿La aplicación entrega la información del t iempo que estoy buscando?¿La aplicación habla el mismo lenguaje que sus usuarios?¿Emplea un lenguaje claro y conciso?Los rótulos, ¿son significativos?¿Usa rótulos estándar?¿Es predecible la estructura y navegación? ¿Saca provecho del espacio y distr ibuye en él la información de manera adecuada?

1-2-3-4-5-6-7-

¿Se ha evitado la sobrecarga informativa?¿Existen zonas en "blanco" entre los objetos informativos de la página para poder descansar la vista?¿Mantiene una coherencia espacial y visual en cuanto a estructuras según las difentes "pestañas" por las cuales el usuario navega?¿Se hace uso de elementos visuales, como gráficos, fotografías o íconos para ayudarme a comprender más fáci lmente la información que me están entregando?¿El t ipo de fuente, efectos t ipográficos, ancho de l ínea y al ineación emplea-dos faci l i tan la lectura? ¿Tiene el usuario todo el control sobre el interfaz?

8-9-

10-

11-

12-

13-

Persona 1Persona 2Persona 3Persona 4Persona 5

(15) Análisis y gráfico de la evaluación Heurística realizada con los wireframes navegables

Análisis HeurísticoMóvil - Aplicación a wireframes navegables

15


4

Wireframes NavegablesMóvil - Segunda versión

(16) Re- diseño de wireframes navegables; Cambios basados en los datos obtenidos del análisis heurístico (expert review)

16

Diseño de la Interfaz (tipografía, cromática, iconografía, maquetación)

5

(17) Diseño y construcción de la interfaz, Para la aplicación móvil: Clima

Diseño de la Interfaz Móvil - Versiones

17


5


Diseño FinalAplicación Móvil: Your Weather

18

Diseño FinalAplicación Móvil: Your Weather


5


19

Gracias

20

Examen final, aplicación del clima: Your Weather

Design

Transcript of Examen final, aplicación del clima: Your Weather