Espacio para publicar wireframe gráfico manual

[xacarana]

Este post es exclusivo para publicar los wireframes hechos a mano, se puede tomar una foto a la hoja donde dibujo la diagramación de su documento y se puede escanear y realizar ajustes de color o ponerle una marca de agua. El wireframe NO puede ser creado con ninguna aplicación.

[Elit2010]

En el primer wireframe tenemos el logo en un contenedor circular y dos botones en la parte inferior; el primero redireacciona al wareframe 2 y el segundo abre un perfil.

En el segundo tenemos en el lado izquierdo una barra de opciones vertical allí encontraremos el logo en el mismo contenedor circular pero más pequeño y encontramos 5 botones diferentes según las categorías seleccionadas, y el último botón es para regresar a la página anterior.

y por último vemos la interfaz a la que nos re-direcciona según la categoría seleccionada, allí también tendrá un menú con cada una de las categorías.

Elizabeth Tobón Pérez

[xacarana]

Va muy bien, ¿ya tienen claro que tipo de contenido va a tener el sitio?. Otra cosa importante para que le vayan pensando, es que tipo de línea gráfica va a tener, pueden llevar referentes para revisar el alcance del diseño en clase.

[Juan]

El home tiene el logo en el centro y tiene 6 botones: Perfil; Audiovisual, Editorial, Fotografía, Ilustración y Publicaciones digitales.
El perfil tiene mi foto en un contenedor circular.
Los contenidos se encuentran en mi portafolio actual: http://jdmotion.wix.com/jdmotion

En audiovisual hay una franja de todo el ancho con un video que se reproduce automáticamente.
Hay 4 proyectos: Indicios (cortometraje), Entomofobia (motion graphics), UV casino (comercial), El bicho más cool (App); cada uno con su video e imágenes.

En editorial hay franja de todo el ancho con imágenes que van pasando.
Tiene 4 trabajos: En Clave (Revista), Reloj Digital (Libro), gente (Periódico), Designio (juego de cartas); Cada trabajo tiene entre 5 y 6 imágenes que pasan automáticamente.

Juan David Cardona Ardila

[laura.lema]

Buenas tardes adjunto mi wireframe.

wireframe-1-lauralema

wireframe-2-lauralema

wireframe-3-lauralema

[Andres F. Garcia]

Wireframe Andrés Felipe García R.

[xacarana]

Los wireframes que han publicado se ven muy bien, lo importante con este ejercicio es aprender como se hacen. En la clase los vamos a revisar personalmente, por tanto deben llevar las hojas que han elaborado. Recuerden que vamos a realizar un sitio para promocionar la distribución del epub como tema central. El siguiente paso es elaborar el wireframe digital con los ajustes de clase y terminar la construcción de nuestro primer proyecto.

[Catalina Romero]

Wireframe Catalina Romero

[Catalina Romero]

Wireframe Catalina Romero

[xacarana]

Catalina, el wireframe que vamos a revisar en clase debe ser manual ya que vamos a hacer ajustes, luego hacemos el wireframe digital. En este caso publicaste un wireframe digital, el cual se salta el proceso de diseño que estamos realizando, recuerda llevar el wireframe manual para la clase.