No tienes acceso a esta clase

隆Contin煤a aprendiendo! 脷nete y comienza a potenciar tu carrera

Adquiere por un a帽o todos los cursos, escuelas y certificados por un precio especial.

Antes: $249

Currency
$219/a帽o

Paga en 4 cuotas sin intereses

Paga en 4 cuotas sin intereses
Comprar ahora

Termina en:

1D
1H
4M
25S
Curso de Adobe XD

Curso de Adobe XD

Ricardo Mendi

Ricardo Mendi

Fases de prototipado: Lo-Fi a Hi-Fi

11/21
Recursos

Aportes 25

Preguntas 2

Ordenar por:

驴Quieres ver m谩s aportes, preguntas y respuestas de la comunidad?

o inicia sesi贸n.

-Wireframes Sketching:

  • Primer boceto a mano

  • Foco sin pensar en el dise帽o

  • Hacerlo siempre: cuesta poco, es muy eficaz.
    _Ventajas: _

  • Colaborativo. 脷til en reuniones de trabajo

  • Participan no dise帽adores.

Wireframes Lo-Fi (Baja):

  • Esquema principal de un dise帽o
  • Estructura y jerarqu铆a de textos e im谩genes aun sin definir su contenido.

Ventajas:

  • Rapidez de cambios ante primeras reiteradas iteraciones.
  • Repositorio de decisiones previas de cada fase del proyecto.

Wireframes High-lo (Alta):

  • Pr贸ximo al final sin la capa de dise帽o.
  • Recoge funcionalidades b谩sicas.
  • M铆nimas iteraciones.

Ventajas:

  • Definici贸n y fiabilidad. Elementos y estructura final.

  • Teste table. Primeras pruebas con usuarios.
    **
    Mockup:**

  • Propuesta final con interacciones reales.

  • Estilos dise帽o con color, tipograf铆a, sombras, comportamientos鈥

Mi idea es hacer una pokedex

"-Ser imaginativo y plasmar tus ideas en el agua.

-Una p谩gina Web o aplicaci贸n digital se compone de una serie de pantallas, que hay que tener muy bien estructuradas.

-Es conveniente tener claro el flujo de navegaci贸n y que cada pantalla tenga un orden, jerarqu铆a, y por supuesto sea visualmente atractiva.

-Wireframes: Pasos necesarios, que agilizar谩n tu proyecto sin invertir mucho tiempo, en aquellos probables cambios que surjan.

  1. Sketching: Es el origen de tu proyecto鈥 es tu idea original y adem谩s es la m谩s directa.

2.Baja: plasmando la estructura y la jerarqu铆a de la composici贸n 鈥 recuerda cada vez que tengas que dar una explicaci贸n de porqu茅 un cambio, acude a tu wireframe en Baja.

3.Alta: Prototipo ideal y perfecto para comenzar a testear con los usuarios, ver sus impresiones y recoger feedback

4.Mockup:Queda definido perfectamente el comportamiento de la aplicaci贸n, porque tambi茅n se habr谩n incluido las interacciones."

En mi caso un prototipo dentro de un sitio web de una concesionaria para una linea de autos, De izquierda a derecha > 1掳 info gen茅rica familia de coches > 2掳 Modelos disponibles > 3掳 Selecci贸n de modelo > 4掳 configurador de caracter铆sticas del veh铆culo, como ejemplo, el motor.
En la fase de prototipado, me parecio mejor dejar recuadros solamente con outline para donde ir铆an las fotos porque se confunden con otros elementos, me gustar铆a saber qu茅 otros recursos de diferenciaci贸n se pueden utilizar en esta etapa, ejemplo color. Gracias!

Este es mi aporte, hay que tener en cuenta que estamos trabajando en una app, los elementos normalmente son mucho m谩s peque帽os que los que aparecen en una web de escritorio.

Hola a todos! Estoy trabajando en un sitio web para adopci贸n de mascotas!

Versi贸n mobile

Versi贸n Desktop

Buenas, mi proyecto es una tienda de caf茅 online

es la mejor herramienta para definir espacios y jerarqu铆as de la informaci贸n.

Hola a todos 馃槃
Mi proyecto es para mi p谩gina web de papeler铆a y encuadernaciones.

Hola, mi proyecto es realizar una tienda de artistas, envi贸 el wireframe realizado

Aqui dejo mi lo-fi

馃憦 Cosas que la m煤sica me ense帽贸

  • Lo-Fi = Baja fidelidad (Baja calidad) 鉁
  • Hi-Fi = Alta fidelidad (Alta Calidad) 馃敟

Este es mi peque帽o aporte. 馃槂 Espero que les guste!

Los _Wireframes Mockup _ est谩n un escal贸n arriba respecto a los Wireframes de Alta Fidelidad (High-fi), puesto que son la propuesta definitiva con las interacciones reales. Est谩 bien detallada, puesto que contiene estilos, dise帽o con color, tipograf铆a, sombras y comportamientos. Ello permite mostrar al equipo exactamente qu茅 es lo que se va a construir y c贸mo debe verse y funcionar el producto, por lo que es la imitaci贸n del producto m谩s cercana a la realidad.

隆Brutal!