Instituto Superior de Electrónica Gamma

Etapa 2:Desarrollo de la estructura

Etapa 2: Desarrollo de la estructura

• La estructuración de cualquier sitio implica ver el proyecto desde 3 puntos de vista.

– 2.1 Relativo al contenido– 2.2 Relativo al sitio– 2.3 Relativo a la página

Etapa 2: Desarrollo de la estructura

• Cuando el diseño de la información no está bien pensada, la experiencia del usuario puede resultar confusa.

• Mientras la arquitectura de la información esté bien estructurada, el diseño visual dirigirá la experiencia del usuario.

2.1 Relativo al contenido

• El contenido de un sitio es fundamental.• Sin un buen contenido, su tecnología y sus

gráficos son contenedores vacíos.

• No solo hay que tener un buen contenido, es necesario saber organizarlo.

2.1 Tips de lectura en pantalla

• No leemos linealmente

• No tenemos el todo• Somos flojos

2.1 Como adaptar un texto para web

• Recorta el texto en 50%

• Practica la pirámide invertida

• Las palabras claves al inicio del párrafo

• Formatea el texto

• Agrega acción al texto

2.1 Preguntas para escribir noticias

• ¿Que?• ¿Cuando?• ¿Como?• ¿Donde?• ¿Quienes?

2.2 Relativo al sitio: Mapa de sitio

• Un mapa de sitio es la columna vertebral del proyecto.

• Es una representación visual de la estructura, organización, el flujo y el agrupamiento del contenido y la información del sitio.

• Es una representación de la totalidad del proyecto.

2.2 Estructuras de mapas de sitio: Lineal

2.2 Estructuras de mapas de sitio: Jerárquica

2.2 Estructuras de mapas de sitio: Radial

2.2 Estructuras de mapas de sitio: Red

3.1 Relativo a la página: Wireframes

• Son bocetos no orientados al diseño.• Muestran jerarquía de información.• Son la base del diseño visual y de la

producción HTML.• Deben incluir una representación de todos

los elementos principales de la página.

3.1 Relativo a la página: Wireframes