PRÀCTICA: PROPOSTA JUSTIFICADA DE L’AI D’UN LLOC WEB JORDI LLONCH ESTEVE
ARQUITECTURA DE LA INFORMACIÓ – PRÀCTICA
CC BY-NC-SA
Í NDEX 1. Arbre de continguts ............................................................. 2 2. Wireframes ............................................................................ 3 2.1 Inici .................................................................................. 3 2.2 Pàgina de segon nivell .................................................. 4 2.3 Pàgina d’una fitxa ......................................................... 5 2.4 Pàgina de resultats d’una cerca.................................. 6 2.5 Pàgina de procés de compra d’un llibre .................... 7 2.6 Pàgina de contacte ...................................................... 8 2.7 Mapa Web ..................................................................... 9 2.8 Pàgina d’interès: Localitzador de tendes .................. 10 3. Objectius ............................................................................. 11 4. Opinió personal .................................................................. 12 5. Bibliografia i altres recursos ................................................ 13 5.1 Llibres............................................................................. 13 5.2 Recursos web ............................................................... 13 5.3 Imatges ......................................................................... 13
Arquitectura de la informació – Pràctica CC BY-NC-SA
Jordi Llonch Esteve Pàgina 1 de 13
1. A RBRE DE CONTINGUTS Inici
Actualitat
Notícies
Mes actual
Mesos passats
Properament
Blocs
Quadre de cerca
Fòrum
Contacte
Bloc del Còmic
Bloc del Manga
Catàleg
Navegació segons
Origen
Tipus
Edat
Sobre l'empresa
Presentació
Autors
Superherois
Sèries
Enviament d'arts
Europeu
Manga
Infantil
Sala de premsa
Nordamericà
Còmic
Juvenil
Borsa de feina
Adult
Norma Còmics
Japonès
Supervendes
Microsites
Distribució
Localitzador de tendes
Reimpressions
CIMOC Còmics online
Catàleg anual
Arquitectura de la informació – Pràctica CC BY-NC-SA
Jordi Llonch Esteve Pàgina 2 de 13
2. W IREFRAMES 2. 1 I NICI
Arquitectura de la informació – Pràctica CC BY-NC-SA
Jordi Llonch Esteve Pàgina 3 de 13
2.2 P ÀGINA
DE SEGON NIVELL
Arquitectura de la informació – Pràctica CC BY-NC-SA
Jordi Llonch Esteve Pàgina 4 de 13
2.3 P ÀGINA
D ’ UNA FITXA
Arquitectura de la informació – Pràctica CC BY-NC-SA
Jordi Llonch Esteve Pàgina 5 de 13
2.4 P ÀGINA
DE RESULTATS D ’ UNA CERCA
Arquitectura de la informació – Pràctica CC BY-NC-SA
Jordi Llonch Esteve Pàgina 6 de 13
2.5 P ÀGINA
DE PROCÉS DE C OMPRA D ’ UN LLIBRE
Arquitectura de la informació – Pràctica CC BY-NC-SA
Jordi Llonch Esteve Pàgina 7 de 13
2.6 P ÀGINA
DE CONTACTE
Arquitectura de la informació – Pràctica CC BY-NC-SA
Jordi Llonch Esteve Pàgina 8 de 13
2.7 M APA W EB
Arquitectura de la informació – Pràctica CC BY-NC-SA
Jordi Llonch Esteve Pàgina 9 de 13
2.8 P ÀGINA
D ’ INTERÈS :
L OCALITZADOR
DE
TENDES
Arquitectura de la informació – Pràctica CC BY-NC-SA
Jordi Llonch Esteve Pàgina 10 de 13
3. O BJECTIUS Amb aquestes propostes d’arbre de contingut i wireframes es pretén millorar l’arquitectura present a la pàgina web de Norma Editorial, de la qual se’n van presentar les mancances a la PAC 2 i es va presentar una primera proposta de millora a la PAC 3, pretenent millorar la usabilitat i accés a la informació.
La reestructuració de l’arbre de continguts permet localitzar la informació que es busca a la web de manera més ràpida. Això s’aconsegueix amb la completa remodelació de la categoria “Catàleg”, la qual disposa de vàries formes d’accedir a la informació més important que els usuaris busquen en una pàgina d’aquest tipus.
S’ha eliminat la categoria “Enllaços” de la pàgina original per passar a incloure el que aquella contenia de manera desendreçada a les fitxes de cada autor, llibre, subapartat, etc. depenent de cada cas. Així s’aconsegueix una navegació més fluïda sense que l’usuari percebi una sobrecàrrega d’informació mal estructurada.
L’apartat de registre, situat a la part superior dreta de cada pàgina permet que els usuaris s’hi puguin identificar i tinguin una experiència personalitzada, ja que el nou lloc web registra totes les accions d’aquests (clics, compres, pàgines visitades, entrades al fòrum...) per a proporcionar-los informació (a la part inferior esquerra) valuosa basada en les seves preferències.
Pel que fa al disseny web, les dimensions de cada pàgina són un exemple per a una finestra oberta de manera vertical, per la qual cosa el contingut que s’hi mostra està perfectament alineat. La proposta de la nova web s’adapta dinàmicament a l’amplada i alçada de cada pantalla, evitant mostrar barres de desplaçament vertical i lateral per part del navegador. D’aquesta manera s’aconsegueix que l’usuari sempre pugui veure la informació que l’arquitecte ha decidit i fent l’experiència d’usuari més personalitzada. En cas que s’hagi de mostrar més informació de la que hi cap a la pantalla, apareixeran automàticament barres de desplaçament vertical.
Arquitectura de la informació – Pràctica CC BY-NC-SA
Jordi Llonch Esteve Pàgina 11 de 13
4. O PINIÓ PERSONAL En conclusió, trobo que la posada en pràctica d’una bona arquitectura de la informació en una pàgina web permet que els usuaris que la visiten se sentin còmodes buscant qualsevol tipus d’informació i quan menys visible sigui (l’AI), menys s’adonaran que estan visitant una pàgina web.
Això aconsegueix que un usuari torni a la pàgina i hi dediqui més temps, cosa que sol generar ingressos per al seu propietari. Així doncs, una bona arquitectura de la informació és una eina bàsica per a qualsevol negoci, tot i que esdevé indispensable per aquells negocis amb forta presència al ciberespai.
Arquitectura de la informació – Pràctica CC BY-NC-SA
Jordi Llonch Esteve Pàgina 12 de 13
5. B IBLIOGRAFIA I ALTRES RECURSOS 5.1 L LIBRES Morville, Peter i Rosenfeld, Louis. Arquitectura de la informació per al World Wide Web. Barcelona: Fundació per a la Universitat Oberta de Catalunya, 2012. Gil Rodríguez, Eva Patricia; de Lera Tatjer, Eva i Monjo Palau, Antònia. Usuaris i sistemes interactius. Barcelona: Eureca Media, S.L., 2010.
5.2 R ECURSOS
WEB
Wikipedia. Arquitectura de la información [en línia]. 8 de febrer de
2012.
Disponible
a
internet
http://es.wikipedia.org/wiki/Arquitectura_de_la_informacion [Consulta: maig 2012] Olga Carreras. Wireframes [en línia] 11 de març de 2008. Disponible
a
internet
http://olgacarreras.blogspot.com.es/2007/02/wireframes.html [Consulta: maig 2012] I
love
wireframes.
[en
línia].
Disponible
a
internet
http://wireframes.tumblr.com/ [Consulta: abril 2012] MockFlow. [en línia]. Disponible a internet www.mockflow.com/ [Consulta: maig 2012]
5.3 I MATGES Imatge de la portada: base de dades de Microsoft Office Word. La resta d’imatges són de producció pròpia.
Arquitectura de la informació – Pràctica CC BY-NC-SA
Jordi Llonch Esteve Pàgina 13 de 13