Taller Multimedia Arquitectura de la Informaci贸n
Jorge Barrera
La tecnologĂa es fundamental, pero insuficiente.
Una buena experiencia de usuario se produce cuando una persona puede comprender un sistema
Cuando un sistema no es usable, el usuario se confunde, se frustra y se culpa a sĂ mismo
La Arquitectura de la Informaci贸n es la disciplina que se ocupa de este proceso, que apunta a dise帽ar una buena experiencia de usuario en sistemas electr贸nicos.
Arquitectura de la Informaci贸n crear y estructurar patrones b谩sicos o inherentes de datos digitales y virtuales en el espacio de la WWW
Clarificar la misi贸n y visi贸n del sitio, equilibrando las necesidades de la organizaci贸n y las del p煤blico.
Clarificar la misi贸n y visi贸n del sitio, equilibrando las necesidades de la organizaci贸n y las del p煤blico.
Determina que contenido y funcionalidad tendr谩 el sitio o aplicaci贸n.
define los sistemas de organización, jerarquía, navegación, rotulado, búsqueda y recuperación de información
organización secciones jerarquía títulos, textos navegación menúes rotulado descriptores búsqueda buscadores, tags
menúes títulos, textos descriptores
secciones
recuperaci贸n de informaci贸n
Proyecta el modo en que el sitio se adaptarĂĄ al cambio y al crecimiento a travĂŠs del tiempo.
"Independientemente de cu谩l sea su intenci贸n, los arquitectos de la informaci贸n buscan patrones, luego crean mapas o proyectos originales para ayudar a la gente a alcanzar sus metas a trav茅s de las interfaces. "Jeffrey Veen (2001)
La experiencia del usuario
superficie
concreto
esqueleto estructura alcance estrategia
abstracto
The Elements of User Experience
Jesse James Garrett jjg@jjg.net
A basic duality: The Web was originally conceived as a hypertextual information space; but the development of increasingly sophisticated front- and back-end technologies has fostered its use as a remote software interface. This dual nature has led to much confusion, as user experience practitioners have attempted to adapt their terminology to cases beyond the scope of its original application. The goal of this document is to define some of these terms within their appropriate contexts, and to clarify the underlying relationships among these various elements.
Interface Design: as in traditional HCI: design of interface elements to facilitate user interaction with functionality Information Design: in the Tuftean sense: designing the presentation of information to facilitate understanding
Navigation Design: design of interface elements to facilitate the user's movement through the information architecture Information Design: in the Tuftean sense: designing the presentation of information to facilitate understanding
Interface Design Navigation Design
Information Design Interaction Information Design Architecture
Interaction Design: development of application flows to facilitate user tasks, defining how the user interacts with site functionality
Functional Content Specifications Requirements
Functional Specifications: "feature set": detailed descriptions of functionality the site must include in order to meet user needs User Needs: externally derived goals for the site; identified through user research, ethno/techno/psychographics, etc. Site Objectives: business, creative, or other internally derived goals for the site
Information Architecture: structural design of the information space to facilitate intuitive access to content Content Requirements: definition of content elements required in the site in order to meet user needs User Needs: externally derived goals for the site; identified through user research, ethno/techno/psychographics, etc. Site Objectives: business, creative, or other internally derived goals for the site
User Needs Site Objectives Abstract
Web as hypertext system Visual Design: visual treatment of text, graphic page elements and navigational components
Visual Design
Visual Design: graphic treatment of interface elements (the "look" in "look-and-feel")
task-oriented
Completion
Concrete
time
Web as software interface
30 March 2000
Conception
information-oriented
This picture is incomplete: The model outlined here does not account for secondary considerations (such as those arising during technical or content development) that may influence decisions during user experience development. Also, this model does not describe a development process, nor does it define roles within a user experience development team. Rather, it seeks to define the key considerations that go into the development of user experience on the Web today. Š 2000 Jesse James Garrett
http://www.jjg.net/ia/
dise単o visual dise単o de informacion dise単o de interaccci坦n funcionalidades necesidades de usuario
herramientas
1. Herramientas de anรกlisis - Anรกlisis Comparable Bechmarking - Inventario de contenidos
2. Herramientas de dise単o
2.1 MAPAS DE AI BLUEPRINT
Portal Web Escuela de Diseño - Arquitectura de la Información - Blueprint General
homepage Portal
Login
Items Homepage
0
Menu General
Acerca de
2
historia
Proyectos
Organigrama
Contacto
3
Usuarios
Alumnos
Docentes
Administrativ os
Admisión
Carrerras
4
5
Noticias
6
Galería
Weblog
Empresas BLOG
Carrera en cada sede
Cuerpo Docente
Proyectos
Eventos
Galería
Homepage Carreras
Malla Curricular
Extensión
ShowcaseGalería
Noticias
Proyectos
Noticias
7
Eventos
2.1 WiREFRAMES
WireFrames Arquitectura de la Informaci贸n Desarrollo Portal Web Escuela de Dise帽o DuocUC Jorge Barrera
2.0
Homepage Portal 0
Acerca de
Historia
Proyectos Escuela
Organigrama
Contacto
Se agrega a petición del equipo el texto proyectos escuela
Mapa del sitio
Logo Escuela 1 2
This is where the section help text would go. It should be brief but informative and describe the fields that are in the following section.
This is where the section help text would go. It should be brief but informative and describe the fields that are in the following section. Alumnos
Docentes
Diseño Ambientes
Administrativos
Diseño Gráfico
Admisión
Diseño Industrial
Texto descriptivo escuela
Empresa Diseño de Vestuario
Tipos de usuarios que llevan a una página dedicada Técnico en Diseño Gráfico
Ilustración Digital
Menu de carreras: Este podría llevar directamente al home de carreras o tener un menu propio
3
Noticias
Galería This is where the section help text would go. It should be brief but informative and describe the fields that are in the following section. This is where the section help text would go. It should be brief but informative and describe the fields that are in the following section.
4
This is where the section help text would go. It should be brief but informative and describe the fields that are in the following section.
Weblog This is where the section help 6
8
text would go. It should be brief but informative and describe the fields that are in the following section.
5
This is where the section help text would go. It should be brief but informative and
Eventos Art Center at Night Open House Aug 13, 2008 7:00--9:00 p.m. Summer 2008 Graduation Events Aug 14, 2008 - Aug 16, 2008 Toyota Lecture Series: Jeffrey VeenSep 25, 2008 7:30 p.m.
Pie links Institucionales
La noticias se estractaran de las noticias por carrera. La galería de igual modo hace un llamado de el showcase de cada carrera
legal escuela
7
Weblog de la escuela, se dirige a una sitio propio Enventos es un calendario que también se maneja por cada carrera y centralmente
Gonzalo Fuentes realizó observación sobre orden de las carreras - Se cambia a alfabético - Manteniendo las carreas técnicas separadas
2.1 MOCKUP
Primera Propuesta Prototipo ! Estandarización de la retícula. ! Uso de las Normas Gráficas asociadas a la Escuela. ! Uso y aplicación del estudio de referentes. ! Aplicación de las observaciones de la encuesta a Directores de Carrera