[arquitectura de la informació] pac 3: arbre de continguts, navegació i wireframe
DESCRIPTION
Més informació a elmeuordinador.blogspot.comTRANSCRIPT
ARBRE DE CONTINGUTS, NAVEGACIÓ I WIREFRAME
JORDI LLONCH ESTEVE
ARQUITECTURA DE LA INFORMACIÓ – PAC 3 CC BY-NC-SA
Arquitectura de la informació – PAC 3 Jordi Llonch Esteve CC BY-NC-SA Pàgina 1 de 6
ÍNDEX
1. Arbre de continguts ............................................................. 2
2. Wireframe .............................................................................. 3
3. Objectius ............................................................................... 4
4. Conclusió .............................................................................. 5
5. Bibliografia i altres recursos .................................................. 6
5.1 Llibres ............................................................................... 6
5.2 Recursos web ................................................................. 6
5.3 Imatges ........................................................................... 6
Arquitectura de la informació – PAC 3 Jordi Llonch Esteve CC BY-NC-SA Pàgina 2 de 6
1. ARBRE DE CONTINGUTS
Inici
Novetats
Notícies
Mes actual
Mesos passats
Properament
Catàleg anual
Blocs
Bloc del Còmic
Bloc del Manga
Quadre de cerca Fòrum Contacte Catàleg
Cerca per
Origen
Europeu
Nordamericà
Japonès
Tipus
Manga
Còmic
Edat
Infantil
Juvenil
Adult
Supervendes
Reimpressions
CIMOC Còmics online
Informació complementària
Autors
Daniel Torres
Hernán Migoya
Luis Royo
Victoria Francés
Xoan Marín
Microsites
Lydie
Una judía americana perdida en
Israel
Andando
Tristísima ceniza
Muertos de sueño
Hágase el caos
Arturo
Barcelona TM
Tsubasa
Sobre l'empresa
Presentació
Enviament d'arts
Sala de premsa
Borsa de feina
Norma Còmics
Distribució
Localitzador de tendes
Arquitectura de la informació – PAC 3 Jordi Llonch Esteve CC BY-NC-SA Pàgina 3 de 6
2. WIREFRAME
Exemple dels menús desplegables dinàmics:
El nom d’usuari de la secció “Opina” apareix automàticament si l’usuari s’ha registrat en el quadre de registre del lateral dret.
Arquitectura de la informació – PAC 3 Jordi Llonch Esteve CC BY-NC-SA Pàgina 4 de 6
3. OBJECTIUS
Amb aquestes propostes d’arbre de contingut i wireframe 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. En aquella PAC es va fer especial èmfasi en la necessitat d’optimitzar la navegació, cosa que s’ha portat a terme en aquesta PAC per a millorar la usabilitat i accés a la informació.
Per començar, s’ha remodelat l’arbre de continguts, que ara permet accedir a la informació que es busca de manera més àgil ja que s’hi ha afegit més categories i s’han reestructurat els seus continguts. Amb això s’aconsegueix disminuir la dificultat de trobar la informació que es busca per part de l’usuari.
A continuació, s’ha creat un wireframe que pretén mostrar visualment l’aspecte final de la fitxa d’un llibre. Es pot veure que s’ha respectat força el format de la pàgina original, però s’hi ha afegit grans transformacions. Amb això s’aconsegueix que l’usuari reconegui la pàgina, però alhora aquesta li ofereixi noves funcions molt útils.
Aquestes modificacions comencen en la part superior, on s’ha optimitzat l’espai partint de la premissa que la tendència actual és l’ús de pantalles panoràmiques. S’ha reduït la mida de la capçalera per no ocupar massa espai a la pantalles dels usuaris.
Seguint amb la intenció d’optimitzar espai, s’ha redissenyat el quadre de cerca per a fer les mateixes funcions en menys espai i s’ha aprofitat l’espai guanyat per afegir informació sobre la pàgina en que es troba l’usuari en el seu lloc. D’aquesta manera s’estalvia espai vertical i s’evita que l’usuari hagi de fer un ús excessiu de la barra de desplaçament vertical.
Pel que fa al menú de navegació de la part esquerra manté la seva disposició i estètica dinàmica, però agrupa la nova jerarquia de l’arbre de continguts. A sota d’aquest s’ha afegit un núvol d’etiquetes amb els còmics més valorats, potenciant d’aquesta manera, l’aspecte social que manca a la web.
Arquitectura de la informació – PAC 3 Jordi Llonch Esteve CC BY-NC-SA Pàgina 5 de 6
La barra lateral dreta inclou una secció nova, la qual permet el registre dels usuaris que servirà tant per deixar comentaris als còmics com per accedir al fòrum.
A les parts inferiors de les barres laterals s’ha reduït el nombre de bàners per a no sobrecarregar l’experiència de l’usuari i s’han dividit en dues seccions: una que mostra els blocs i autors destacats segons els editors; i una altra que conté la publicitat a la revista Dibus, a la pàgina de Facebook de Norma Editorial, a concursos patrocinats o a publicacions destacades.
Per últim, la part central de la fitxa del llibre manté la mateixa informació que mostra la pàgina original, però s’ha reestructurat per a fer-la més clara per a l'usuari i s’ha afegit una línia amb les paraules clau de cada llibre, les quals serviran per a indexar molt millor el contingut de la pàgina web. Cal dir que s’ha eliminat algun botó que conduïa a confusió i s’ha afegit la secció “Obres similars”.
4. CONCLUSIÓ
Per concloure, haig de dir que aquesta proposta ha estat possible gràcies a l’estudi previ i anàlisi dut a terme a la PAC 2, imprescindibles per al plantejament de les solucions que he expressat en aquesta PAC.
Crec que sense aquest estudi hagués estat molt difícil, inclús impossible en alguna situació, descobrir les mancances i deficiències del lloc web de Norma Editorial i el treball realitzat no hagués estat eficient ni útil per a l’usuari final.
Arquitectura de la informació – PAC 3 Jordi Llonch Esteve CC BY-NC-SA Pàgina 6 de 6
5. BIBLIOGRAFIA I ALTRES RECURSOS
5.1 LLIBRES
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 RECURSOS 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: abril 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: abril 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: abril 2012]
5.3 IMATGES
Imatge de la portada: base de dades de Microsoft Office Word.
La resta d’imatges són de producció pròpia.