interficie-resum
TRANSCRIPT
![Page 1: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/1.jpg)
Disseny interactiu III
interfície
Mariona Grané. Laboratori de Mitjans Interactius. Universitat de Barcelona
![Page 2: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/2.jpg)
disseny interactiu
Disseny interactiu de la interficie
Distribució visualSenzillesa visualAtenció visualModels i referents mentalsOrganització dels contingutsEstèticaLegibilitatColorSimplicitat a la interaccióUsabilitat en la interacció
Consistència en el dissenyUs de metàfores
![Page 3: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/3.jpg)
Distribució visual
Composició: equilibri
![Page 4: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/4.jpg)
Distribució visual
Composició: tensió
![Page 5: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/5.jpg)
Distribució visual
Composició: nivellament i agudesa
![Page 6: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/6.jpg)
Distribució visual
Tendim a agrupar els similars
el punt aïllatés un TOT
sobre 2centreml’atenció
més juntsmés agrupats
![Page 7: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/7.jpg)
Distribució visual
Els iguals s’atrauen
i els contraris es repelen
![Page 8: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/8.jpg)
Distribució visual
Visualment agrupem segons les qualitats
![Page 9: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/9.jpg)
Distribució visual
La percepció dona forma allò que no en té iacaba allò inacabat
![Page 10: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/10.jpg)
Distribució visual
Composició: una superficie es divideix en terços horitzontals i verticals per acolocar els elements de forma que es puguin percebre millor.
Alineació: Colocació d'elements alineats a les seves vores, centralment, a duesbandes, ...etc
Bona continuació: els elements distribuits com una recta o una línia suau esperceben com un grup.
Panorama-refugi: tendència a preferir els entorns amb espais oberts i lesàrees d'intimitat i recolliment.
Proximitat: els elements propers entre si es perceben com més relacionats queels separats entre si.
Similitud: els elements similars es perceben com més relacionats entre si queels que són diferents.
Tancament: tendencia a percebre un conjunt d'elements diferents com si fossinun sol objecte.
![Page 11: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/11.jpg)
Distribució visual
http://www.almiron.org/
![Page 12: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/12.jpg)
Distribució visual
http://www.alistapart.com/
![Page 13: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/13.jpg)
Distribució visual
http://www.cadius.org/weblog/
![Page 14: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/14.jpg)
Distribució visual
http://www.elpais.com/
![Page 15: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/15.jpg)
Distribució visual
http://www.guigalaxy.com/
![Page 16: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/16.jpg)
Distribució visual
http://www.halcourier.es/web/nueva.htm
![Page 17: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/17.jpg)
Senzillesa visual
Llei de Hick: a més alternatives per triar més temps dedicarà l'usuari,s'aplica millor a dissenys per decisions simples.
Navalla d'Ockham: la simplicitat i senzillesa d'un entorn el fa mésusable.
Principi de Pareto: La majoria dels efectes venen provocats per unmínim de variables. Cal seleccionar aquelles funcions més rellevants idestacar-les o eliminar les no rellevants del disseny.
Proporció senyal - soroll: proporció de la informació rellevant iirrellevant.
![Page 18: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/18.jpg)
Senzillesa visual
http://www.sindicat.net/
![Page 19: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/19.jpg)
Senzillesa visual
http://www.teachers.tv/node
![Page 20: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/20.jpg)
Senzillesa visual
![Page 21: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/21.jpg)
Senzillesa visual
http://www.pauledwardfleming.com/
![Page 22: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/22.jpg)
Senzillesa visual
http://www.arnoditnodar.com/
![Page 23: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/23.jpg)
Atenció visual
Interferències: problema de disseny que implica soroll i provoca unralentiment del procés mental.
Punt d'entrada: espai o element d'atenció en un disseny, destacar, marcar,situar, ...
Realçament: sistemes per cridar l'atenció sobre un element.
Relació figura-fons: els elements es perceben com figures (centred'atenció visual) o com a fons (resta del camp de percepció).
![Page 24: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/24.jpg)
Atenció visual
http://www.tff.gob.mx/
![Page 25: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/25.jpg)
Atenció visual
http://www.queweb.org/ http://www.eed.es/
![Page 26: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/26.jpg)
Atenció visual
http://persuabilidad.com/
![Page 27: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/27.jpg)
Atenció visual
http://www.sekisuiheim.com/desio-ae/
![Page 28: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/28.jpg)
Atenció visual
![Page 29: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/29.jpg)
Atenció visual
![Page 30: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/30.jpg)
Atenció visual
Diagrama de Gutenberg
La tensió visual es pot aguditzar perquè la nostravisió tendeix a localitzar primer l’angle inferioresquerra en una composició.
zona primaria
zona final
zona forta
zona dèbil
![Page 31: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/31.jpg)
Atenció visual
eyetracking
http://poynterextra.org/eyetrack2004/videos.htm
![Page 32: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/32.jpg)
Models i referents mentals
Adequació: Les característiques físiques d'un objecte influeixen en la sevafunció.
Arquetips: Patrons universals de temes i formes.
Efecte de l'expectativa: Té diferents sentits, en disseny interactiu implicaconèixer els arquetips i experiència de l'usuari.
Imitació: copiar propietats d'objectes, d'organismes i d'entorns.
Models mentals: disseny d'entorns basats en les representacions mentalsdesenvolupades a partir de l'experiència.
Reconeixement enfront de record: es mes fàcil reconèixer coses un coples veiem que recordar-les del no res.
Representació icònica: imatges i pictogrames per a la identificació, elrecord, i l'organització.
![Page 33: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/33.jpg)
Models i referents mentals
http://www.metropro.com.mx/
![Page 34: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/34.jpg)
Models i referents mentals
http://www.elevatormoods.com/
![Page 35: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/35.jpg)
Models i referents mentals
![Page 36: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/36.jpg)
Models i referents mentals
http://www.dontclick.it/
![Page 37: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/37.jpg)
http://www.iconwerk.de/
Models i referents mentals
![Page 38: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/38.jpg)
Models i referents mentals
![Page 39: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/39.jpg)
Organització dels contingutsFragmentació: organització fragmentada de dades per millorar l'accés a lainformació i la memorització.
Modularitat: mètode per controlar la complexitat d'un sistema que implicapartir-lo en diferents sistemes més simples i petits.
Organització de la informació per capes: organitzar la informació engrups relacionats per controlar la complexitat i reforçar les relacionsinformatives
Organització de la informació: sistemes universals d'organització de lainformació: categoria, temps, ubicació, ordre alfabètic, continuat
Piràmide invertida: Presentació de la informació en ordre descendentd'importància.
Revelació progressiva: estratègia per controlar la complexitat de lainformació que consisteix en mostrar només la info necessària en cadamoment
Profunditat de processat: la informació que s'analitza en profunditat esrecorda més que aquella que es treballa superficialment
![Page 40: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/40.jpg)
Organització dels continguts
http://interacciones.wordpress.com/
![Page 41: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/41.jpg)
Organització dels continguts
http://www.nosolousabilidad.com/
![Page 42: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/42.jpg)
Organització dels continguts
![Page 43: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/43.jpg)
EstèticaEfecte de superioritat de la imatge: les imatges es recorden millor que lesparaules
Estètica: La bellesa del disseny importa.
La forma segueix a la funció: com una descripció de la bellesa o com unaidea per assolir-la
Preferència pel llençol: preferència d'entorns semblants a un llençol net,corbes suaus.
Secció aurea: proporció entre els elements d'una forma (alçada,amplada,...) de aproximadament 0,618
Simetria: Equivalència visual entre els elements d'una forma
![Page 44: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/44.jpg)
Estètica
http://www.vangogh-creative.it/index.php
![Page 45: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/45.jpg)
Estètica
http://www.miraruido.com/mira.html
![Page 46: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/46.jpg)
Estètica
http://www.whatyouchoosetoremember.com
![Page 47: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/47.jpg)
Estètica
http://www.rhythmoflines.co.uk/
![Page 48: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/48.jpg)
Estètica
![Page 49: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/49.jpg)
Estètica
![Page 50: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/50.jpg)
Estètica
![Page 51: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/51.jpg)
Estètica
http://www.useit.com
![Page 52: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/52.jpg)
Estètica
http://www.gmvallejo.com/http://www.queweb.org/
![Page 53: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/53.jpg)
Estètica
ttp://www.extremoweb.com.ar/home.html
![Page 54: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/54.jpg)
LegibilitatClaredat: grau en que es pot comprendre un text en funció de la sevacomplexitat
Legibilitat: qualitat visual dels textos, que implica tamany, color, estils,contrast, espaiat, ...
Visibilitat: l'us dels sistema millora quan millora la seva visibilitat
![Page 55: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/55.jpg)
Legibilitat
http://www.residenciamenendezpelayo.com/
![Page 56: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/56.jpg)
Legibilitat
http://www.sabena.com/
![Page 57: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/57.jpg)
Legibilitat
http://www.lapalmaturismo.com/MARCO/MARCO1.htm
![Page 58: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/58.jpg)
ColorColor: en disseny utilitzem el color per atraure atencions, agruparelements, indicar significats, optimitzar l'estètica, millorarllegibilitat i visibilitat d'elements, etc.
![Page 59: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/59.jpg)
Color
http://www.limbus.fr/
![Page 60: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/60.jpg)
Color
http://www.rittenhousedesign.com/
![Page 61: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/61.jpg)
Color
http://www.estudioingenia.com/ingenia.htm
![Page 62: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/62.jpg)
Color
http://www.paginanomade.com.ar/
![Page 63: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/63.jpg)
Color
http://www.thanea.com/ars/
![Page 64: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/64.jpg)
Color
http://www.nexuslondon.com/main.html
![Page 65: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/65.jpg)
Color
http://www.relevare.com/site/
![Page 66: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/66.jpg)
Simplicitat en la interacció
Càrrega de la tasca: si cal molt d'esforç per realitzar una tasca és probableque aquesta no es faci amb èxit.
Confirmació: tècnica de verificació de les accions abans de dur-les a terme,ralentitzen tasques i cal reservar-les per qüestions rellevants.
Economia, costos i beneficis: quantes paraules calen per explicar unmissatge? quan temps pot esperar un usuari sense abandonar?
Equilibri entre flexibilitat i eficàcia: els dissenys flexibles tenen mésfuncions i per aquesta raó són menys eficaços.
Limitació: reducció de les accions que es poden realitzar en un moment(desactivar botons quan no es poden fer servir).
![Page 67: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/67.jpg)
Simplicitat en la interacció
http://llamamelola.com/
![Page 68: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/68.jpg)
Simplicitat en la interacció
http://www.microsiervos.com/
![Page 69: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/69.jpg)
Simplicitat en la interacció
http://www.dontclick.it/
![Page 70: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/70.jpg)
Simplicitat en la interacció
http://www.ingreme.com/start.html
![Page 71: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/71.jpg)
Simplicitat en la interacció
http://www.elastique.de/flash/index.php
![Page 72: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/72.jpg)
Usabilitat en la interaccióAccessibilitat: Els objectes, els espais i els documents s'han de dissenyarde forma que puguin ser utilitzats, sense cap modificació pel major nombrepossible de persones.
Control: el control que els usuaris poden tenir sobre el sistema ha d'estardissenyat en relació a l'eficàcia del sistema i l'experiència dels usuaris.
Feedback: l'acció de l'usuari té unes consecuències al sistema i a la inversa
Indulgència: els dissenys han d'ajudar a evitar errors i minimitzar lesconsequències negatives quan aquests succeeixen.
Intruccions: relació entre els controls i el disseny de les instruccions.
Llei de Fitts: el temps per assolir un objectiu depèn de la distancia vers ell idel seu tamany
![Page 73: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/73.jpg)
Usabilitat en la interacció
http://www.psoetv.es/index.html
![Page 74: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/74.jpg)
Usabilitat en la interacció
http://www.albinoblacksheep.com/flash/blind.php
![Page 75: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/75.jpg)
Usabilitat en la interacció
Llei de fitts
http://fww.few.vu.nl/hci/interactive/fitts/
![Page 76: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/76.jpg)
Usabilitat en la interacció
Llei de fitts
![Page 77: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/77.jpg)
http://www.kurtnoble.com/
Usabilitat en la interacció
![Page 78: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/78.jpg)
Ús de metàfores
Ajuda a situar l’usuari, facilita la seva organització mental
Afavoreix els sistemes de navegació
Ajuda a donar consistència a l’entorn
![Page 79: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/79.jpg)
Ús de metàfores
![Page 80: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/80.jpg)
Ús de metàfores
http://myweb.rust.net/~no2pencl/
![Page 81: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/81.jpg)
Ús de metàfores
http://www.stephanh.com/
![Page 82: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/82.jpg)
Ús de metàfores
http://www.carlosevangelista.com.br/oldport/index.html
![Page 83: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/83.jpg)
Ús de metàfores
http://www.md-extreme.pl
![Page 84: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/84.jpg)
Ús de metàfores
http://www.tvcatalunya.com
![Page 85: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/85.jpg)
Ús de metàfores
http://www.elpais.com/comunes/2005/arco/index.html
![Page 86: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/86.jpg)
Ús de metàfores
http://www.peepshow.org.uk/
![Page 87: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/87.jpg)
Ús de metàfores
http://www.diminuta.com/
![Page 88: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/88.jpg)
Ús de metàfores
http://www.desclides.net/etienne/podfolio/
![Page 89: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/89.jpg)
Ús de metàfores
http://www.srarushmore.com/html/flash.html
![Page 90: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/90.jpg)
Ús de metàfores
¿Podriem pensar en metàforesadients per als nostres projectes?
![Page 91: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/91.jpg)
Consistència en el disseny
Disseny consistent i adient als continguts que es treballen
Estil coherent dels elements de la pantalla.
Evitar fer barreges d’estils
Combinar estils i colors
Intentar pensar en el disseny de la interfície com un tot o com un solelement i no com la suma de molts elemenst diferents
Imaginar entrar en una web i sense llegir res en absolut ja saber de que vao quin tipus de continguts inclou.
Autosimilitud: una forma es composa de parts similars al tot entre si.
![Page 92: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/92.jpg)
Consistència en el disseny
http://www.elblogsalmon.com/
![Page 93: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/93.jpg)
Consistència en el disseny
http://www.bebesymas.com/
![Page 94: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/94.jpg)
Consistència en el disseny
http://www.foxsearchlight.com
![Page 95: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/95.jpg)
Consistència en el disseny
http://www.poesia.com
![Page 96: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/96.jpg)
Consistència en el disseny
![Page 97: Interficie-resum](https://reader033.vdocuments.co/reader033/viewer/2022052907/559080411a28abce518b46e7/html5/thumbnails/97.jpg)
Consistència en el disseny
http://www.elutilitario.net/