Diferencia entre revisiones de «Antonia Escudero Tarea 4 - MuestraUX»

De Casiopea
 
(No se muestran 4 ediciones intermedias del mismo usuario)
Línea 6: Línea 6:
|Alumnos=Antonia Escudero
|Alumnos=Antonia Escudero
}}
}}
=MuestraUx=
==Introducción==
Sitio web de uso abierto a la comunidad, que este enfocado a la gente del área, o simplemente gente que este investigando del tema.


==Etapa 1: Cardsorting==
==Etapa 1: Cardsorting==
Línea 79: Línea 84:


Primera propuesta de pantallas para el sitio web.
Primera propuesta de pantallas para el sitio web.
Para empezar, en la pagina de inicio se encuentra el menú principal (la barra de arriba), la cual contiene la opción de ingresar a la explicación del proyecto, segundo los Patrones, que son la parte más importante, y por último el colaborar.
La idea es que el sitio sea colaborativo, por eso la importancia del Colaborar en el menú. Se podría colaborar subiendo ejemplos dentro de los patrones, quizá proponiendo nuevas categorías o sub-categorías. Lo ideal sería que la pagina no necesitara registrarse para poder hacer el aporte, pero quizá si dejar los datos de la persona que puso el ejemplo.
La pagina de inicio en sí puede llevar una explicación del proyecto y la explicación de los patrones en general.
Luego, la segunda pantalla, que sigue siendo la pagina de inicio, es al abrir el menú. La idea es que ahí aparezcan las categorías más globales de patrones para poder ingresar directo a alguna de ellas.
Al ingresar a las categorías globales, aparecen las especificas y dentro de las especificas se encuentran los ejemplos.
Cada uno de estos niveles lleva una pequeña descripción, y luego la última que sería el patrón en si, ya va con más información. 


<gallery mode='slideshow'>
<gallery mode='slideshow'>
Línea 91: Línea 107:


===Wireframe Móvil===
===Wireframe Móvil===
El wireframe movíl funciona muy parecido al web, sin embargo acomodado al tamaño de un celular (en este caso iPhone 8), lo cual produce cambios como el menú que se abre, que en este caso ocupa todo el ancho de la pantalla para poder visualizar mejor, y aparte el botón de patrones te envía a la pagina de estos, donde recién se encuentran las categorías globales, a diferencia de la versión web donde en la misma barra de menú se abren las categorías globales.


<gallery mode='slideshow'>
<gallery mode='slideshow'>

Revisión actual - 14:03 31 mar 2020



AsignaturaTaller de Diseño de Interacción
Del CursoTaller de Diseño de Interacción 2020
CarrerasDiseño
4
Alumno(s)Antonia Escudero

MuestraUx

Introducción

Sitio web de uso abierto a la comunidad, que este enfocado a la gente del área, o simplemente gente que este investigando del tema.

Etapa 1: Cardsorting

Patrones de Evaluación

  • Evaluación de producto o servicio
  • Calificación de post

Patrones de Ingreso

  • Creación de cuenta
  • Autenticación de usuario (Ingreso o Log In)
  • Recuperar cuenta

Patrones de Seguridad

  • Cambio de contraseña
  • Cuentas verificadas
  • Captcha o elementos de seguridad
  • Solicitar permisos del usuario

Patrones de Compra

  • Carros de compra
  • Trackeo de envíos
  • Formas de pago

Patrones de sugerencias

  • Contenido recomendado no solicitado
  • Predicción de búsqueda
  • Comparación de productos

Patrones de Ayuda

  • Wizard o Tunneling
  • Chatbots

Patrones de Preferencias

  • Definición de preferencias para servicio personalizado
  • Definir preferencias de mensajería
  • Des-suscripción listas de correo
  • Notificaciones

Patrones de Carnada

  • Acceder a contenido de pago
  • Desbloquear características (Compras dentro de la app)
  • Aplicaciones codependientes

Patrones de Salida

  • Eliminar cuenta
  • Eliminar suscripción
  • Cambiar de cuenta de pago a cuenta gratuita

Patrones de actualización de contenido

  • Actualización de información constante
  • Segmentación del contenido (Paginación o Scroll infinito)

Patrones de Contenido RRSS

  • Compartir
  • Eliminar contenido en RRSS
  • Comentar publicaciónes

Etapa 2: Wireframes

Wireframe Desktop

Primera propuesta de pantallas para el sitio web.

Para empezar, en la pagina de inicio se encuentra el menú principal (la barra de arriba), la cual contiene la opción de ingresar a la explicación del proyecto, segundo los Patrones, que son la parte más importante, y por último el colaborar.

La idea es que el sitio sea colaborativo, por eso la importancia del Colaborar en el menú. Se podría colaborar subiendo ejemplos dentro de los patrones, quizá proponiendo nuevas categorías o sub-categorías. Lo ideal sería que la pagina no necesitara registrarse para poder hacer el aporte, pero quizá si dejar los datos de la persona que puso el ejemplo.

La pagina de inicio en sí puede llevar una explicación del proyecto y la explicación de los patrones en general.

Luego, la segunda pantalla, que sigue siendo la pagina de inicio, es al abrir el menú. La idea es que ahí aparezcan las categorías más globales de patrones para poder ingresar directo a alguna de ellas. Al ingresar a las categorías globales, aparecen las especificas y dentro de las especificas se encuentran los ejemplos.

Cada uno de estos niveles lleva una pequeña descripción, y luego la última que sería el patrón en si, ya va con más información.

Wireframe Móvil

El wireframe movíl funciona muy parecido al web, sin embargo acomodado al tamaño de un celular (en este caso iPhone 8), lo cual produce cambios como el menú que se abre, que en este caso ocupa todo el ancho de la pantalla para poder visualizar mejor, y aparte el botón de patrones te envía a la pagina de estos, donde recién se encuentran las categorías globales, a diferencia de la versión web donde en la misma barra de menú se abren las categorías globales.