PAC 1. La no transparència de les...

Disseny d’interfícies multimèdia PAC 1. La no transparència de les interfícies

Pere Amengual Gomila - Març 2015

2

Disseny d’interfícies multimèdia - PAC 1

Índex

Interfície analògica poc transparent: Korg M1 ..................... 3

Interfície digital transparent: Garageband ............................. 5

Interfície analògica poc transparent: Canon EOS 6D ........... 7

Interfície digital transparent: app Cámara Sony Z3 ............. 9

Conclusions ................................................................................ 11

Referències i bibliografia ......................................................... 12

3


Interfície analògica - Workstation KORG

La estació de treball Korg M1 és un dispositiu de creació musical que es va produïr de l’any 1988 fins al 1994. Incorpora tots els elements per realitzar una composició musi-cal completa: teclat, sintetitzador, seqüenciador i efectes.

Arquitectura de la informació. Organització del contingut. Jerar-quia.

La estructura d’organització és de tipus jeràrquic descendent amb pà-gines de les quals es poden modificar un nombre concret de paràmetres, encara que no aconsegueix trobar un equibri entre profunditat i amplada, presentant poques opcions de selec-ció i menús molt profunds.

L’esquema de navegació és de tipus ambigu, per tasques anomenades “modes” i que es corresponen amb les tecles de selecció de mode COM-BI, EDIT COMBI, PROG, EDIT PROG, SEQ i GLOBAL.

Comportament dels elements d’in-teracció. Quins són i quin ús en fa.

Els elements d’interacció són uns bo-tons de selecció de mode que s’il·lu-minen quan la seva funció està acti-va, un display LCD de 2x40 caràcters, un control lliscant per introduïr dades

que es veu complementat per botons de selecció de pàgina (a la dreta del display) i de selecció de valors (a l’esquerra del display). El parà-metre actual en edició, entre tots els presents a la pàgina actual, pre-senta un cursor intermitent, facilitant la seva localització. Sempre es pot conéixer el mode actual degut a la retro-il·luminació dels botons selectors. Les tecles de cursor es localitzen exactament sota cada un dels parámetres del display, facilitant l’edició ràpida ja que amb una mà es tria el parámetre mentre que amb l’altre es selecciona el seu valor amb el fader de lliscament vertical.

Relació amb les característiques pròpies del dispositiu. Com té en compte les possibilitats i limitacions del dispositiu.

Tenint en compte que és dispositiu dels anys 80, la interfície permet realitzar amb facilitat les tasques més freqüents (selecció de sons a tocar amb el teclat) però dificulta molt la creació de tasques més com-plexes com l’edició de sons o la composició de música amb diferents sons. Això va comportar que la majoria dels usuaris mai fessin servir aquests funcions més avançades.

Tecles de selecció de mode

4


Ajust al perfil d’usuari.

Degut a la complexitat de l’intefície, s’ajusta molt bé al perfil de mú-sic intérpret (només selecciona el so que vol tocar amb el teclat) i no s’ajusta bé al perfil del compositor ocasional o amateur.

Ús dels recursos gràfics (colors, imatges, tipografies, composició, moviment, contrast) i amb quines finalitats.

Es tracta d’una interfície molt espartana, sense cap ús del color, ni icones dins el display, la composició de les dades dins el display és ade-qüada, presentant els noms dels paràmetres a la línia superior i els seus valors a la línia inferior, amb la fina-litat de facilitar la lectura de la gran quantitat d’informació que es presenta en un espai molt reduït.

Convencions culturals. Com aprofita els costums del grup d’usuaris

Aquesta interfície no aprofita les convencions culturals existents, cap dels elements de la seva interfície es relaciona amb els procediments ni els usos dels instrumentistes. No obstant, possibilita una funciona-litat molt complexa si l’usuari vol invertir temps en aprendre el seu ús.

Factors que contribueixen a la usabilitat

1. Separació clara i eficient entre la disposició en pantalla dels paràme-tres (part superior) i els seus valors (part inferior)

2. La disposició dels botons de cursor sota els paràmetres del display i un botó per cada paràmetre visible al display facilita la rapidesa d’ús.

3. Fader lliscant vertical per introduïr els valors de forma ràpida.

4. Agrupament dels paràmetres en pàgines escollides de forma molt adeqüada que facilita me-moritzar les múltiples opcions disponibles.

Baixa sensació de transparèn-cia

El dispositiu presenta una sensació de transparència extremadament

pobre, essent un exemple paradigmàtic de les interfícies de control més obscures i complicades de fer servir, exigint a l’usuari memoritzar l’estructura d’organització per poder treballar amb rapidesa. Va supo-sar una passa enrere respecte de les interfícies de control dels sinte-titzadors dels anys 70, que presentaven un botó o un interruptor per cada paràmetre, el que permetia conéixer l’estat de tots els paràme-tres només amb una ullada.

Désquerra a dreta: lliscador vertical d’introducció de dades, botons d’introducció de dades, display LCD de dues files amb vuit dades per pàgina, botons cursor de selecció de valor A-H, botons de selecció de pàgina.

5


Interfície digital - Apple GarageBand

L’aplicació per dispositius mòbils Garage-band permet fer servir gestos multi-touch per tocar teclats, guitarres, instruments de corda, bateries, etc. També serveix per com-posar, gravar i, finalment, compartir les can-çons a les xarxes socials.

Arquitectura de la informació. Organitza-ció del contingut. Jerarquia.

L’estructura d’organització és de tipus jeràr-quic descendent, amb molt poca profunditat ja que les pàgines principals no desapareixen mai per mostrar sub-pàgines.

L’esquema de navegació és de tipus ambigu, presentant pàgines de Cançons, Instruments (amb subpàgines per teclats, violins, guitarres, bateries, etc...), Seqüenciador, Paràmetres de pista, Ajustos i Ajuda.

Comportament dels elements d’interacció. Quins són i quin ús en fa.

L’aplicació fa servir els elements d’interacció disponibles a iOS basats en el concepte de manipulació directe. Així, la pantalla es transforma de manera que cada instrument presenta la seva pròpia interfície i es pot tocar realitzant els gestos habituals dins aquest tipus de dispositius (swipe, tap, pinch...). L’estructura de menús és molt simple, i presenta només les opcions estrictament necessàries fent molt poc ús dels menús textuals.

Relació amb les característiques pròpies del dispositiu. Com té en compte les possibilitats i limitacions del dispositiu.

Fa servir al 100% les possibilitats de la pantalla multi-touch i fins i tot, per dotar de major expressivitat a les interpretacions, recolleix l’infor-mació dels accelerómetres del dispositiu emulant de forma convinçent una sensibilitat al tacte fluix i fort de la qual la pantalla realment no disposa. Així, la guitarra es toca lliscant el dit sobre les cordes i l’instru-ment bateria colpejant amb intensitat variable el dit sobre una repre-sentació gráfica realista d’una bateria acústica.

El lliscament sobre la pantalla és un gest natural per representar la manera com es toca una guitarra

6


Ajust al perfil d’usuari

La interfície senzilla i de fàcil comprensió s’adapta completament al perfil d’usuari al que va dirigida: aficionats a la música que volen composar cançons de forma senzilla sense necessitat d’aprendre a to-car un instrument real.

Ús dels recursos gràfics (colors, imatges, tipo-grafies, composició, moviment, contrast) i amb quines finalitats.

Dins les pantalles corresponent als instruments, el color es fa servir per identificar de forma ràpida els diferents models d’instruments d’una mateixa família (els pianos dels orgues, per exemple). Dins el seqüenciador, una icona permet identificar cada pista amb el seu ins-trument. També destaquen alguns detalls gràfics com el moviment de les cordes del violí quan estan sonant o l’animació dels elements d’una bateria quan es colpeja la superfície de la pantalla.

Convencions culturals. Com aprofita els costums del grup d’usuaris.

El programa fa servir un gran nombre de convencions culturals específiques de l’ambit de la creació musical. Co-mençant per la representació en pis-tes horitzontals representant cada un

dels instruments gravats, les icones de retrocedir, reproduïr i gravar, i, fins i tot, la línia de temps com una barra vertical que es desplaça d’esquerra a dre-ta. També intenta aprofitar al màxim el coneixement previ que l’usuari pugui tenir sobre l’instrument real emulat: la guitarra es toca com una guitarra, el violí com un violí, el teclat pràcticament igual que un te-clat real, etc...


1. Instruments fàcils d’aprendre a tocar

2. Es pot trobar l’instrument cercat molt ràpidament

3. Es poden aprofitar els coneixements anteriors sobre instruments musicals

4. L’experiència d’ús és divertida i grati-ficant

Alta sensació de transparència

Aquesta aplicació ofereix una sensació de transparència molt ben acon-seguida. Gairebé sense cap coneixement musical previ es pot començar a fer música. També els músics amb experiència poden tocar amb flui-desa els instruments disponibles sense cap aprenentatge previ.

Un toc suau sobre la pantalla fa sonar la bateria

Els acords amb cordes es poden tocar sense coneixements previs d’harmonia

El piano es toca sobre la pantalla

7


Interfície analògica - Canon EOS 6D

La càmera fotogràfica Canon EOS 6D és una càmera digital de tipus réflex amb sensor CMOS de fotograma complet. Presenta tota la funci-onalitat d’un dispositiu de gama professional.

Arquitectura de la informació. Organització del contingut. Jerarquia.

La estructura d’organització és de tipus jeràrquic descendent, amb molt poca profunditat ja que les pàgines principals no desapareixen mai per mostrar sub-pàgines.

L’esquema de navegació és de tipus ambigu, presentant pàgines rela-tives als diferents aspectes tècnics del procés fotogràfic.


El dispositiu presenta una interfície híbrida redundant (una analògica semblant a la de les càmeres ana-lògiques i una digital per a backup i ajustos). A la part analògica, el mode de fotografia, focus, la dis-tància focal, obturació i apertura tenen cada un dial rotatori exclusiu. A la part digital, la tecla MENU ens porta alternativament al menú principal, amb totes les seves pàgines, i al menú “quick” o simplificat. Addicionalment, l’interfície fa servir 15 botons, 2 interuptors de selecció i un joystick.

Relació amb les característiques prò-pies del dispositiu. Com té en compte les possibilitats i limitacions del dis-positiu

La interfície d’una càmera reflex és un estàndar que no presenta gaire variaci-ons entre els diferents models, en canvi, tractant-se d’una càmera digital, el fabri-cant ha volgut implementar no tan sols les funcions de control i ajustos, sino també funcionalitat addicional.

El segon dial selecciona el mode d’operació: manual, automàtic, preseleccionat...

La pantalla ràpida ens mostra tota la informació rellevant

8


Ajust al perfil d’usuari.

La interfície analògica s’adapta amb facilitat a l’usuari professional, que és el públic objectiu al que va dirigit aquest producte. Així i tot, no oblida presentar la informació d’una manera més senzilla fent ús d’una gran pantalla LCD en color que dobla la seva funció com a visor digital.

Ús dels recursos gràfics (colors, imatges, tipografies, composició, moviment, contrast) i amb quines finalitats.

Les pantalles dels menús fan servir petites icones en lloc de noms, i es troben agrupades per colors segons la seva funcionalitat (vermell:

presa d’imatges, blau: visor, groc: globals, taronja: personalització, verd: “mi menú”)

Convencions culturals. Com aprofita els costums del grup d’usuaris.

L’interfície aprofita amb molt encert les convencions culturals i els cos-tums dels professionals de la fotografia, les icones es poden entendre amb facilitat i el menú ràpid mostra gran quantitat d’informació en for-ma icònica i alfanumèrica ordenada d’una manera lògica i eficient.

Factors que contribueixen a la usabilitat.

Presenta un gran nombre de botons amb funcionalitat única correcta-ment etiquetada i, sobretot, és destacable l´ús de tres dials rotatoris, cadascún d’ells amb un tacte, mides i posició en el cos de la càmera que impossibiliten confondre’ls.

Baixa sensació de transparència.

Encara que s’ha fet un gran esforç per posar a l’abast un gran conjunt d’opcions i funcionalitat, no hem d’oblidar que precisament la fotogra-fia artística i professional es basa en la presa de decisions per part del fotógraf i, per tant, resulta inevitable la presència d’un elevat nombre d’opcions que dificulten el maneig. Suposadament, el mode automàtic hauria de presentar una interfície ultra-simplificada del tipus “apunta i dispara”, però no és així en el cas de l’interfície d’aquesta càmera desti-nada exclusivament al públic professional.

El display “analògic” de quars líquid presenta l’aspecte del d’una càmera convencional professional

9


Aplicació per a dispositius mòbils per realitzar la presa de fotografies i vídeo integrada en el telé-fon mòbil Sony Xperia Z3 amb sistema operatiu Android.

Arquitectura de la informació. Organització del contingut. Jerarquia.

La estructura d’organització és de tipus jeràrquic descendent, amb molt poca profunditat (màxim dos nivells).

L’esquema de navegació és de tipus ambigu, pre-sentant un menú amb opci-ons per els ajustos de foto-grafia, vídeo i generals.

Cal destacar que triant el tipus de fotografia que volem realitzar (time-lapse, multicàmera, escombrat panoràmic, etc.), l’interfície canvia substancialment per mostrar només els parà-metres rellevants.


Tractant-se d’una aplicació per dispositius mòbils, fa servir els gestos multi-touch “tap” i “pinch”. Per exemple, colpejant suaument sobre la pantalla la càmara enfoca sobre el punt senyalat ajustant tam-bé la sensibilitat a la llum, i pessigant realitza la funció de zoom. Es pot assignar el control de volum del teléfon a determinades funcions.

Relació amb les característiques pròpies del dis-positiu. Com té en compte les possibilitats i limi-tacions del dispositiu

Fa servir totes les possibilitats del dispositiu pel que respecta a la funcionalitat de la pantalla mul-ti-touch. El fabricant també ha optat per sacrificar les possibilitats creatives en favor d’una major facilitat d’ús.

Ajust al perfil d’usuari

Inicialment, la càmera fotogràfica era una funcionalitat addicional dels teléfons mòbils però de cada vegada més els usuaris demanen un ma-jor ventall de possibilitats i control, però sense renunciar a l’immedia-tesa.

Interfície digital - app Cámara Sony Z3

Selecció del tipus de flash

Ajustos de fotografia

Ajustos de vídeo

10


Ús dels recursos gràfics (colors, imatges, tipografies, composició, moviment, contrast) i amb quines finali-tats

Els menús són translúcids amb una tipografia llegible i el color només es fa servir per els interruptors de selec-ció dels menús i les icones principals de presa de foto-grafia, presa de video i mode de la càmera.

Convencions culturals. Com aprofita els costums del grup d’usuaris

Fa servir icones fàcilment reconeixibles (els tres punts per al menú, un raig pel flaix, un punt vermell per la gra-vació de vídeo, etc...). Sense cap aprenentatge previ un usuari endevinarà quin botó ha de prémer per realitzar una fotografia.


Permet fer fotos enfocades i amb una exposició ade-qüada només en dos tocs sobre la pantalla: el primer enfoca i ajusta l’exposició, el segon captura l’imatge.

Alta sensació de transparència

Prendre una fotografia és tan senzill com obrir l’aplicació i fer un toc suau sobre la icona que representa una càmera. No-més en cas de voler canviar l’enfocament o l’exposició seria necessari fer ús de dos tocs. L’interfície variable segons el ti-pus de fotografia a realitzar facilita molt la sensació de trans-parència, amagant als usuaris inexperts una gran quantitat d’opcions inútils per la majoria de situacions.

Ajustos generals

Menú de segon nivell

11


Conclusions

Després de realitzar l’anàlisi dels dispositius, cal demanar-se com seria l’instrument electrònic, o la càmera fotogràfica, amb l’interfície més transparent?

D’una banda, Golden Krishna(1) proposa que “la millor interfície és que no hi hagi interfície”. No obstant, aquesta no s’ha d’entendre literal-ment (és impossible) sinó com l’objectiu d’apropar el més possible una interacció més relacionada amb el cos humà i que no suposi un proble-ma afegit.

En primer lloc, Krishna defensa l’idea de que l’interfície ha de solucio-nar un problema, no crear una eina i, en definitiva, un nou problema a resoldre. Així, considera millors les interfícies que reduexien el nombre de passos a realitzar dins la IU de manera absoluta. Cap de les interfí-cies propostes aconsegueix aquest resultat “ideal”, un fet que no ens hauria de sorprendre.

Les interfícies han de solucionar problemes que no sabem com resoldre o ni tan sols sabem que existeixen. En aquest punt, la manera que la aplicació Garageband gestiona la creació de ritmes i harmonies d’una manera tan senzilla que l’usuari ni es planteja la tasca que el programa està realitzant. Totes les opcions disponibles semblen “sonar bé”.

D’altra banda, Krishna es partidari de les solucions automàtiques tals com per exemple panys que s’obren automàticament quan ens apro-pem. En aquest sentit, alguns dels dispositius analitzat incorporen al-guns d’aquests processos automàtics i l’usuari no arriba a ser consci-ent de la seva existència, com per exemple el sistema d’autofocus i el fotómetre de la aplicació fotogràfica per Android

En canvi, Timo Arnall(2) proposa negar l’absència de la UI en el seu ar-ticle “no to no-ui”. El director creatiu de Berg entén que cal corregir l’identificació de l’interfície amb la GUI. Encara que les pantalles des-aparesquin, la interfície éstarà sempre on hi hagi un intercanvi d’in-formació entre un humà i una màquina. Sota el meu punt de vista, en el cas dels dispositius analitzats, podriem dir que és irrellevant el fet de que portin o no una pantalla i un sistema de menús ja que fer des-aparéixer la pantalla d’un instrument musical no farà desaparéixer el necessari procés d’intercanvi d’informació. La màquina no pot respon-dre a les nostres ordres (ni nosaltres ser conscients de que està llesta per executar-les) si no s’estableix una interfície, sigui quin sigui el seu grau de “transparència.

Carlos A. Scolari(3) en el seu article “El ideológico retorno de las inter-faces transparentes” ens avisa de que les interfícies no desapareixen i seguint la seva argumentació podem proposar l’exemple dels cotxes tradicionals. Un cotxe dels anys 50 semblaria en una anàlisi superficial que no té interfície però no només és així sinó que existeix fins i tot un aprenentatge i una certificació oficial de que es domina aquesta interfície (el carnet de conduïr) per poder menar un vehicle.

Finalment, en la meva opinió, crec que cal destacar que la transparèn-cia percebuda depén també del grau de seguiment de les convencions culturals. La càmera Canon segueix fidelment aquestes convencions culturals afegint al funcionalitat extra a manera d’una capa addicional que proporciona funcionalitat ampliada. L’aplicació Garage Band pre-senta un elevat grau d’skeumorfisme que pretén seguir aquestes con-vencions culturals per resultar propera i “intuitiva” als usuaris.

12


Referències bibliogràfiques i en línia

Col·laboradors de la Viquipèdia. Korg M1 [en línia]. Viquipèdia, l’Enciclopèdia Lliure, 2014 [data de consulta: 5 de març del 2015]. Disponible en <http://ca.wikipedia.org/w/index.php?tit-le=Korg_M1&oldid=14597481>

Col·laboradors de la Viquipèdia. GarageBand [en línia]. Viquipèdia, l’Enciclopèdia Lliure, 2014 [data de consulta: 5 de març del 2015]. Disponible en <http://ca.wikipedia.org/w/index.php?-title=GarageBand&oldid=13628475>

Wikipedia contributors, ‘IOS’, Wikipedia, The Free Encyclopedia, 25 February 2015, 23:14 UTC, [data de consulta: 5 de març del 2015] <http://en.wikipedia.org/w/index.php?title=IOS&ol-did=648858515>

Wikipedia contributors, ‘Canon EOS 6D’, Wikipedia, The Free Encyclopedia, 20 February 2015, 08:14 UTC, [data de consulta: 5 de març del 2015] <http://en.wikipedia.org/w/index.php?tit-le=Canon_EOS_6D&oldid=648010033>

http://www.smallfarmdesign.com/blog/2009/04/02/5-usability-factors-to-get-right/

EIMT.UOC.EDU. La no transparència de les interfícies. Universitat Oberta de Catalunya 2014 [data de consulta: 6 de març del 2015]. Disponible en <http://multimedia.uoc.edu/blogs/dim/intro/no-transparencia-interficies/>

(1) Golden Krishna. The best interface is no interface [en línia]. Cooper, 2015 [data de consulta: 6 de març del 2015.]. Disponible en <http://www.cooper.com/journal/2012/08/the-best-in-terface-is-no-interface>

(2) Timo Arnall. No to no-ui. Elastic space 2015 [data de consulta: 6 de març del 2015]. Dispo-nible en <http://www.elasticspace.com/2013/03/no-to-no-ui>

(3) Carlos A. Scolari. El ideológico retorno de las interfaces transparentes. [data de consulta: 5 de març del 2015]. Disponible en <http://hipermediaciones.com/2009/11/23/el-ideologi-co-retorno-de-las-interfaces-transparentes/>

Imatges

Imatge de la portada. Finger touching a multitouch-screen (cc by-sa) Protoplasmakid. http://en.wikipedia.org/wiki/Multi-touch#mediaviewer/File:Aldea_Digital_2013_01.jpg

M1 (c) Audiofanzine. http://medias.audiofanzine.com/images/normal/korg-m1-8176.jpg http://medias.audiofanzine.com/images/normal/korg-m1-568036.jpg

Garageband (c) Obamanpacman. http://obamapacman.com/wp-content/uploads/2011/04/Garageband-iPad-2-We-Believe-Ad.jpg

Icona Garagabend (c) makeuseof. http://cdn.makeuseof.com/wp-content/uploads/2011/11/garageband_icon-300x300.png?bd76e7

Garageband (c) ipad3-release-date.com. http://www.ipad3-release-date.com/wp-content/uploads/2011/10/ipad-2-garageband.jpg

Garageband (c) http://www.ipaca.uk.com/wp-content/uploads/2014/10/ipad-2-garage-band.jpg

Garageband (c) mzstatic.com http://a5.mzstatic.com/us/r30/Purple3/v4/b2/8e/02/b28e02c6-38b2-7e13-81d0-4ec1c5d46fed/screen640x640.jpeg

Canon 6D. (c) imaging-resource.com. http://www.imaging-resource.com/PRODS/canon-6d/Z_canon_6D_dial2-sx.JPG

La resta de les imatges (cc by-sa) Pere Amengual

PAC 1. La no transparència de les...

Documents

Transcript of PAC 1. La no transparència de les...