La funcionalitat a la web La web com un objecte d’us

1. USABILITAT La funcionalitat a la web La web com un objecte d’us

2. http://espanol.games.yahoo.com/games/maze.html Us agraden el laberints ?

3. Tenim temps ? Us convido a visitar: • http://www.anuncios.com// Pero , us agrada treballar en laberints ?

4. ES TRACTA DE FER WEBS NO LABERINTS !

5. Objectius “Aprendre” a idear una web, incorporant elements multimèdia. • Sempre pensant en l'usuari !

6. L'ésser humà, un animal multimèdia Entenem el multimèdia com la unió de diversos medis que puguin actuar de forma simultània sobre tots els nostres sentits: • Olfacte • Tacte • Oida • Vista • Gust, Conclourem que el multimèdia és, en definitiva, una experiència sensitiva inherent al ésser humà i que desperta en ell diferents sentiments.

7. Principis de les aplicacions multimèdia • 1 - Principi d'usabilitat • S'ha parlat molt d'enfocar la web a l'usuari. • La usabilitat fa referència a la rapidesa i facilitat amb que les persones porten a terme certes tasques a través de l'ús d'un producte, en el nostre cas d'aplicacions interactives. • Seran els usuaris, i no els desenvolupadors, qui determinaran finalment si una aplicacióés fàcil d'usar.

8. Principis de les aplicacions multimèdia • 2 - Principi d'accessibilitat Una pàgina web ha de ser accessible de manera fàcil i comprensible per a tots els usuari (tinguin o no deficiències), a no ser que pretenguem el contrari, per exemple en jocs on precisament la dificultat formi part del joc o fins i tot en una web on pugui interessar crear aquesta situació. En definitiva, es tracta de fer webs i no laberints !

9. Principis de les aplicacions multimèdia • 3 - Principi de múltiple entrada • Els tres factors que intervenen en l'emmagatzematge del coneixement: • factor cognitiu • afectiu • i l'experiència prèvia. Així, la forma que gravem la informació en la nostra memòria depèn tant de l'estructura de la informació, de l'impacte afectiu i de l'experiència prèvia.

10. Principis de les aplicacions multimèdia • 4 - Principi d'interactivitat • La interactivitat, a part de reforçar el missatge, té com funció principal la de convertir en actor a l'espectador i així l'usuari crea el seu itinerari particular .

11. Principis de les aplicacions multimèdia • 5 - Principi de feed-back • En les aplicacions interactives l'usuari es converteix en actor, generant respostes de diversa índole enfront de l'aplicació. No ens vam referir tan sols a la capacitat de decidir l'itinerari de navegació, sinó a la possibilitat de generar una resposta o que modifiqui la pròpia aplicació.

12. Principis de les aplicacions multimèdia • 6 - Principi de dinamisme El principi del dinamisme promou la sensació de vitalitat. El guionista té l'oportunitat d'idear aplicacions que van més enllà del trencament de la linealitat. Ja no es tracta només de crear aplicacions que responguin a les ordres de l'usuari; a més, deuríem donar la sensació que l'aplicació està viva. Per exemple www.galsan.net les fotografies canvien aleatòriament a l'entrar un nou visitant. O a www.colpublirp.com on les notícies de la home les genera un boot.

13. Principis de les aplicacions multimèdia • 7 - Principi de necessitat • Tots els productes cobreixen una necessitat. Aquest principi del màrqueting tambéés vàlid en una aplicació interactiva, és a dir, una aplicació cobreix una o diverses necessitats.

14. Principis de les aplicacions multimèdia • 8 - Principi d'atenció Aquest principi també vàlid per a altres mitjans segueix vigent en tota aplicació. Es tracta de pensar en el futur usuari i de com anem a assolir la seva atenció. Quantes vegades no hem visitat una pàgina web, al principi interessant per algun motiu, i ha estat entrar i no hem passat de la primera o primeres pàgines perquè aquesta aplicació ha estat incapaç de mantenir el nostre interès. Devem esforçar-nos a idear pàgines que mantinguin l'interès.

15. Principis de les aplicacions multimèdia • 9 - Principi de unicitat Segons aquest principi, l'usuari ha de percebre l'aplicació com un tot, es a dir com un producte homogeni. Sense que es notin diferents tasques de manera visible (programació incoherent amb el disseny, etc.)

16. Principis de les aplicacions multimèdia • 10 – Pensa en multimèdia Tots estem familiaritzats amb la cultura audiovisual imposada pel cinema, la televisió i el llenguatge publicitari... i sense poder-lo evitar acabem traslladant aquesta concepció al multimèdia, quan realment es tracta de molt més. Aquesta màxima consisteix a tenir una visió de conjunt simultània de tots els principis. Un director de cinema converteix la seva ment en una camera, nosaltres tenim el repte de pensar en multimèdia

17. El guió multimèdia Argument - Objectius Índex de continguts El diagrama de fluxos Storyboard d’ interactius

18. És una moda la usabilitat ? Si un client no pot trobar un producte no el podrà utilitzar, ni comprar, ni llegir, veure, etc. La usabilitat dirigeix la web però el poder està en mans de l'usuari. L'usuari decideix, no l'aplicació .

19. Concepte d’usabilitat El terme usabilidad és definit pel document per a l'estàndard internacional ISO/Dis 9241-11 (1995), com: "El límit fins al qual un producte pot ser utilitzat per usuaris determinats per a aconseguir objectius específics amb efectivitat, eficiència i satisfacció, en un context d'ús determinat". L'efectivitat d'un sistema es refereix als objectius de treball. L'eficiència es relaciona amb l'efectivitat en termes dels recursos necessitats per a portar a terme les tasques. La satisfacció es refereix al grau de agradabilidad i comoditat en l'ús. Altre criteri per a definir la usabilidad es refereix al límit fins al qual l'usuari pot interactuar eficientment amb el sistema, sense esforços mentals innecessaris causats per problemes del context cognitiu, tals com processos de treball ineficaços, execució deficient, etc.

20. Regles bàsiques 1. Fàcil navegació, estructurant l'aplicació en les categories que interessen a l'usuari. El disseny deu ser el més senzill i clar possible. 2. Els textos deuen ser breus i concisos, abordant directament a l'assumpte tractat. Es deuen evitar llargues instruccions d'ús. 3.  Pocs gràfics, per a evitar que la pagina es recarregui a l'excés, i petits, per a evitar llargues descàrregues. 4.  Ràpides descàrregues de les pàgines, evitant llargues esperes. 5.  Bon servei de recerca, que ofereixi resultats ràpids i precisos. Es deuen evitar resultats massa engruixats o irrellevants en les recerques. 6.  Ample de pàgina apropiat, triant la resolució més adequada perquè la majoria dels usuaris visualitzin correctament les pàgines. 7.  Evitar els errors de programació: no permetre que apareguin missatges d'error a la meitat d'una connexió en internet ni enllaços erronis.

21. Usabilitat i e-commerce Una usabilitat de qualitat és bàsica per a qualsevol model de negoci en la Xarxa, però sobretot ho és en les vendes en la xarxa. El comprador online bàsicament cerca : Facilitat per a trobar el producte que busca i comprar-lo. Rapidesa en les operacions Seguretat de la transacció Confidencialitat Un disseny acurat que reforci la imatge de marca de la web

22. Inspecció i test d’usabilidad Es denomina inspecció d’usabilitat al conjunt de mètodes que utilitzen avaluadors per a inspeccionar una interfície. Encara que existeix un bon nombre de mètodes, els més utilitzats són els quals es descriuen a continuació. Universitat de Stanford

23. Mètodes • Evaluació heurística • Exploració cognitiva • Inspecció formal • Inspecció col·lectiva • Inspecció del elements del sistema • Inspecció de la consistència • Inspecció d’estàndars • Test de usuaris online

24. Inspecció heurística heurística   (gr. heurisko, trobar) 1 f. Art d’inventar Aquest mètode consisteix en la revisió per part d'especialistes en usabilitat, que examinen cadascun dels elements de la interfície per a determinar si responen als principis fonamentals d’usabilitat. Nielsen, J. Ten usability heuristics. En: http://www.useit.com/papers/heuristic/heuristic list.html

25. Inspecció heurística • Visibilitat de l'estat del sistema. El sistema ha de mantenir a l'usuari informat sobre l'estat dels processos que s'estan duent a terme. • Grau de consistència entre el sistema i el món real. El sistema ha dirigir-se a l'usuari en termes que li resultin familiars, i seguint una estructura lògica. • Control de l'usuari i llibertat d'ús. L'usuari ha de poder explorar el sistema amb llibertat i abandonar-lo en el moment que desitgi. Les accions deurien poder anul·lar-se (undo) i repetir-se (redo) amb facilitat. • Consistència i manteniment d'estàndards. Per a cada acció o situació idèntica, la representació deu ser la mateixa. Per altra banda, el sistema ha de tenir en compte els estàndards del context, de manera que l'usuari no hagi de reaprendre rutines que acostumava a executar d'altra manera. • Prevenció d'errors. El disseny de la interfície ha de prevenir les possibilitats d'error.

26. Inspecció heurística 6 . El reconeixement és millor que la memorització. Totes les opcions han de ser visibles. No s’ha d’obligar a l'usuari a memoritzar-les per a poder executar-les. 7 . Flexibilitat i eficiència. El sistema ha de preveure la seva utilització tant per part d'usuaris experts com per part de novells. Per als experts, és aconsellable preparar dreceres de teclat que permetin agilitar el procés de treball. 8 . Disseny minimalistes. Les finestres de diàleg no han de contenir més informació que aquella que resulta rellevant; qualsevol excés d'informació serveix solament per a confondre a l'usuari i ralentir el procés. 9 . Ajuda a l'usuari en la correcció d'errors. Els missatges d'error han de ser breus i clars, descrivint el problema en termes intel·ligibles i presentant suggeriments per a la seva solució. 10 . Ajuda i documentació. L'ajuda del sistema ha de ser fàcilment accessible i ha d'exposar la descripció dels processos pas a pas i de manera concreta.

27. Test d’usuaris online UserZoom és una poderosa eina d'investigació basada en la metodologia de anàlisi per objectius d'usuaris o escenaris, que permet millorar la usabilitat i l'experiència d'usuari a través d'un sofisticat programari de testeig remot. Permet capturar i interpretar el comportament dels usuaris davant una pàgina Web o qualsevol producte visible via navegador (prototips, maquetes, noves funcionalitats, banners, etc.). Permet adequar l'eficàcia, eficiència i rendibilitat d'una inversió, detectar oportunitats de millora i obtenir informació crítica per a la presa de decisions..

28. Disseny de pàgina web El disseny no està renyit amb la usabilitat http://www.macromedia.com/software/flash/productinfo/usability/

29. Al utilitzar una eina o a l'interactuar amb un sistema, acostuma haver-hi “alguna cosa” entre l'usuari i l'objecte que s'usa. En una porta el timbre. En un ascensor els botons. Aquest límit i espai comú entre ambdues parts és la interfície. Disseny de pàgina webLa interfície

30. LA MILLOR INTERFÍCIE ES LA QUE NO ES VEU Windows és una interfície que es basa en la metàfora del escriptori.

31. Escriure per a la web:

32. Herald Tribune – Explorerwww.iht.com Disseny líquid

33. Herald Tribune – Netscape Disseny líquid

34. Herald TribuneNetscape Herald TribuneExplorer Disseny líquid

35. http://www.flash99good.com/index_flash.html Bons i mals exemples

36. Noves formes de presentar la informació: • www.inxight.com Mapa dinàmic de la web • www.thebrain.com • http://www.mapasconceptuales.com Programari per a guió multimèdia • http://guir.cs.berkeley.edu/projects/denim/

37. Links imperdibles • www.flash99good.com/index_flash.html • www.macromedia.com/devnet/mx/flash/articles/flash99good.html • www.emergia.net • www.macromedia.com/software/flash/productinfo/usability/tips/ • www.ainda.info • www.cadius.org • www.girlzilla.com/ • www.webusabile.it/ • www.xs4all.nl/~ppk/js/index.html?version5.html • www.useit.com • www.usableweb.com • www.cadius.org • http://www.cooper.com/ • http://www.hipertext.net • http://www.webstandards.org/learn/resources/ • http://www.grancomo.com/

38. Gràcies per l’assistència y por haver ACCEDIT I USAT aquest seminari. Carles Sanabrecarles.sanabre@urv.net