AnuarioThinkEPI2010

200

???????????????????????????????????????????????????????????????????RediseñandoGoogle:propuestaparaeldesarrollodeunsistemaoperativomultimodalubicuo–FranciscoTosete

G.2.RediseñandoGoogle:propuestaparaeldesarrollodeunsistemaoperativomultimodalubicuo

PorFranciscoTosete

7marzo2009

Tosete,Francisco.“RediseñandoGoogle:propuestabaseparaeldesarrollodeunsistemaoperativomultimodalubicuo”.En:AnuarioThinkEPI,2010,v.4,pp.200-204

Resumen:LaevolucióndelaWWWylaintroduccióndenuevosdispositivospor-tablesestánconfigurandounentornoubicuoenelquelosusuariospuedenestarpermanente conectados. En este entorno y con las limitaciones espaciales de laspantallasactualesdedispositivoscomoteléfonosmóviles,smartphones,pdas,note-booksuotros,cobragranimportanciaelestudioeinvestigacióndemétodosparadesplegar información e interacción en áreas espacialmente muy reducidas. Parasuperarestaslimitacioneslasinterfacesestándejandodeserrígidasyestáticasparapresentarlasopcionesad-hocenfuncióndelaaccióndeseadaporelusuarioencadamomentomediantediversossistemas.Algunasinterfacessignificativasenestesenti-dosonlabarradeherramientasdePhotoshop,RibbondeOffice,SearchCommandde Office Labs o Ubiquity de Mozilla Labs. Se propone la extrapolación de estasinterfacesparaunrediseñodelaactualhomedeGoogleyseseñalalaoportunidad

deutilizarlosboxdebúsquedacomoelpuntodepartidaybaseparaeldesarrollodenuevossistemasoperativosubicuos,multimodalesymultidispositivos.

Palabrasclave:Plegadodeinformacióneinteracción,Interfacesorgánicas,Sistemasoperativosubicuos,Multimodalidad,Multidispositivos,Webdelascosas,Boxdebúsqueda.

Title:RedesigningGoogle:abasicproposalforthedevelopmentofamultimodalubiquitousoperatingsystem

Abstract:TheevolutionoftheWWWandtheintroductionofnewportabledevicesarecreatingaubi-quitousenvironmentinwhichuserscanbepermanentlyconnectedtotheNet.Inthisenvironmentandwiththescreen-sizelimitationsofcurrentdevicessuchasmobilephones,smartphones,pdas,notebooksorothers,studiesandresearchonmethodsforfoldingandunfoldinginformationandinteractioninverysmallspacesarebecomingveryimportant.Toovercomespatiallimitations,theinterfacesaredesignedtobelessrigidandstatic,withvarioussystemsofofferingad-hocoptionsdependingontheactiondesiredbytheuseratanygiventime.SomesignificantinterfacesinthisregardarethePhotoshopToolbar,OfficeRibbon,SearchCommandfromOfficeLabs,orUbiquityfromMozillaLabs.TheextrapolationoftheseinterfacesisproposedforaredesignofthecurrentGooglehomepage,notingtheopportunitytousethesearchboxasthestartingpointandbasisforthedevelopmentofnewoperatingsystemsthatareubiqui-tous,multimodalandmulti-device.

Keywords:Informationandinteractionfolding,Organicinterfaces,Ubiquitousoperatingsystems,Mul-timodality,Multi-devices,Webofthings,Searchbox.

“NOSOTROS apenas hemos empezado aentenderquelosmotoresdebúsquedasonlapuertadeentradadetodaslasinteraccio-nessociales...”(Pisani;Piotet,2009,p.214).

“Las intranets ya no se organizan pordepartamentos o por listados alfabéticos,sino mediante cajas de búsqueda” (Dans,2008).

Subyacenteaambasreflexioneshayunainte-resante idea que está cambiando el modelo deinteracción de las interfaces estáticas que cono-cemos:

Cuandounusuarioseencuentraanteuncaje-tín o box de búsqueda está ante una cerraduraenlaquenosabemuybienquéesloquetienequehacer.Norecibeningúntipodeayudaqueleposibilitearticular,convertirsudeseodeinfor-maciónendemanda,intuyeloquenecesitaperonosabeloquebusca.

Conlasprimerasrespuestaspodríadarsecuen-tadecómodebemejorarsuformadepreguntar,pero muchas veces ello no es así y la búsquedafracasa.Elusuariofrustradoabandonaelintento,amenosqueenellolevayalavidaotengauna

AnuarioThinkEPI2010

201

??????????????????????????????????????????????????????????????????????

necesidadrealmenteimportantedesatisfacersudemanda...

Elusuarionopiensa comounmotordebús-queda, sinocomounapersona,ycuantomás leayudemos a delimitar su deseo de información(pasoapaso,definiendoloquequierecomosuce-de en el proceso de búsqueda de, por ejemplo,Idealista),mejor.

Y labasededichocambio radicaen tornoadosconceptosfundamentales:

1. Elpasode interfacesestáticasa interfacesorgánicas,dinámicasocontextuales.

2. Unbuscadornosóloeslapuertadeentradadetodaslasinteraccionessociales:eslapuertadeentradaparalanzarinteracción.

Enlaevolucióndelainformáticaseestápasan-dodeunacomplejayrígidamodelizaciónde lainteracciónhombre-máquina–quepocoteníaqueverconlosmodelosnaturalesdinámicos,flexiblesyasociativosdelamentehumanayquesebasabaenlainteracciónconelsistemamediantecoman-dos cerrados (interfaces de línea de comandosy lenguajes artificiales de interacción como porejemplo Ms-dos)–, a un nuevo modelo de inte-racción. Éste tiene como paradigma la interfazlíquidaocontextual,visualencuantoaicónicaygráfica,yqueaportafeedback,queseconstruyead-hocencadamomentoenbasealanecesidad

RediseñandoGoogle:propuestaparaeldesarrollodeunsistemaoperativomultimodalubicuo–FranciscoTosete

Figura1.Idealista.com

Interfaces líquidasUna de las principales limitaciones a las que deben enfrentarse los diseñadores de interacción cuando crean una interfaz es el espacio disponible en el que se debe trabajar. Este problema se ve agravado ante la proliferación de dispositivos con los que accedemos a la Web, que presentan una gran variedad de pantallas: las que tienen una resolución superior a la actual estándar de los monitores de 1024x768 píxeles de los ordenadores de sobremesa, pasando por las de los portátiles, hasta los equipos más pequeños como los smartphones o los iphones, con resoluciones que rondan los 480x320 píxeles o menores.La interfaz y sus componentes han de adaptarse de manera eficaz al espacio o buscar nuevas formas de mostrar más información en el mismo espacio.Para ello se utilizan distintas técnicas y recursos. Los buscadores, por ejemplo, en los tres últimos años han incorporado a su interfaz principal –el campo de búsqueda– las autosugerencias. Éstas son una capa que aparece cuando el usuario escribe una cadena de caracteres, en la que se muestran palabras asociadas a la cadena escrita.El área desplegable donde se presentan las sugerencias es variable y depende de la información escrita por el usuario. De ahí que se hable de interfaces líquidas. En el mismo espacio se presenta diferente información en función de la acción que se acometa en la interfaz.En estos momentos Google sólo muestra sugerencias en texto, pero otros buscadores experimentan mostrar imágenes. En el buscador del sitio web de Apple se puede observar esta función al escribir, por ejemplo, el nombre de alguno de sus productos.

Sugerencias de Yahoo Search, http://search.yahoo.com

La idea o concepto de la interfaz líquida no se limita a las sugerencias sino a cualquier componente que permite plegar o desplegar más información en/adyacente al área espacial que ocupa. Otro ejemplo es el de la barra de opciones de herramienta de Photoshop situada en la parte superior de la interfaz, que muestra distinta información en función de la herramienta seleccionada en la paleta flotante.

AnuarioThinkEPI2010

202

???????????????????????????????????????????????????????????????????

interactiva del usuario expresada mediante uncomando-verboexplícitoconlainterfaz...

Diseñar una interfaz, diseñar información ydiseñarinteracciónsuponeunprocesoconstantepor parte del diseñador para encontrar mediosquepermitan superar las limitacionesespacialesfísicas e interactivas de la superficie en la queel usuario percibe la información y/o ejecuta lainteracción. O dicho de otro modo, medios omodos para plegar y desplegar información y/ointeracción.

Elespaciofísicode lapantallaode la super-ficie es limitado. Presentar cualquier otro tipode información en la misma que no sea la ini-cialmentemostradaimplicalasustitucióndeunainformaciónporotra.Biendeformapermanente(hacemosclicenunhiperenlacey“nosvamos”→ apareceunanuevapantallaconnueva informa-ción)otemporal,utilizandocapas,menúsdesple-gablesopanelesoáreasretráctilesydesplegablesbajoaccióndelusuario.

Y lomismosucedecon la interacción.Posibi-litarotro tipode interacciónmásalláde laquepermitanloselementospresentesen lapantallaen cada momento, no es posible, a no ser queestemos en entornos multimodales o hápticos(quepodamosinteractuarconlavozoeltacto).Esnecesarioantesdesplegarlosypresentarlosal

usuarioyensucaso,ofrecerunaretroalimenta-ciónoayudasobrecómousarlos.

Porcitarunejemplo,conelpasodeltiempolainterfazdePhotoshopsehahechomáslíquida.Sehapasadode losmenúsdearchivoyde labarrade herramientas estática a la definición y adicióndeunáreadinámica,la“barradeopciones”,enlaqueenfuncióndelaherramientaseleccionadaporelusuarioenlaprimerasepresentanunassubherra-mientasuopcionesdeterminadasenlasegunda.Asísepliegaydespliegainformacióneinteracción.

En el caso de Office, Ribbon juega un papelsimilar sustituyendo o enriqueciendo los –hastalaversión2003–comandospuramentetextualesde losmenús, con iconosgráficosacompañadosonodesucorrespondienteetiqueta.

La interfaz comienza a hacerse líquida. Sirvacomo ejemplo el Search command de Officelabs:http://www.youtube.com/watch?v=jl6chxBeURE&eurl=http://tentandole.blogsome.com/wp-admin/post.php?action=edit&post=317&feature=player_embedded

Se evoluciona del estatismo al dinamismo,deunamodelizaciónde la interacciónreducida,rígida y centrada en el recuerdo (asociaciónde un comando textual con una acción) a unmodelomás flexible ydinámico cognitivamente

hablando, menos costoso en esfuerzomentalparaelusuario,centradoenelreconocimiento(asociacióndeiconosalasacciones).Yenelmomentoactualy último estadio de evolución hastaahora, tiende a desaparecer, diluirseo hacerse invisible y dinámica, siendosustituidapor:

1. Unpuntodeentradadeinterac-ción,uncajetínoboxdebúsqueda.

2. Un área espacial dinámica en laque presentar los iconos asociados alasfuncionesquesecorrespondanconlos términos introducidos en el box.Interfazvisualparafacilitarelrecono-cimientofrentealrecuerdoyreducirlacargacognitivadelusuario.

3. En su caso, un área de ayuda osistemaderetroalimentacióndinámicoyconstantequea)guíaalusuariopasoa paso y b) ayude a completar si es

RediseñandoGoogle:propuestaparaeldesarrollodeunsistemaoperativomultimodalubicuo–FranciscoTosete

Figura2.BarradeherramientasdePhotoshophttp://tentandole.blogsome.com/

Figura3.Ribbon,deMicrosoftOffice

AnuarioThinkEPI2010

203

??????????????????????????????????????????????????????????????????????

oportuno la instrucción operativa para ejecutarlaaccióndeseada.

Esteeselnuevoparadigmadeinteracciónquesubyaceenalgunasinterfacesqueseestándesa-rrollando actualmente, como Ubiquity o Searchcommand,deOfficeLabs.

Uncajetínoboxdebúsquedaeslapuertadeentrada o punto de inicio para la ejecución deinteracción. En base a esta idea Google puederediseñarsecomo:

– Un box de búsqueda en el que introdu-cir las búsquedas/sentencias o términos que secorrespondancon lasaccionesonecesidadesdeinteracciónexpresadasenlenguajenatural.

– Un área líquida en la que se le presentendinámicamente al usuario en función de lostérminosqueintroduzca,losiconosvisualesaso-ciados a las funcionalidades pertinentes con suscorrespondientes rótulos textuales descriptivosdecadauno.

Seleccionandounosevaconstruyendola ins-truccióndeinteracciónyselanzalamismadesdeel box pulsando retorno o haciendo clic en unbotóndeejecución.

– Unáreadeayudaopcionalen laque se leproporcioneunfeedbackconstanteparadesarro-llarlainteracciónconéxito.

Loquegráficamentepuedeplasmarseenunprototipoinicialcomoelsiguiente:

2. Comienzaaescribirunabúsquedaoexpre-sasunecesidaddeinteracciónenlenguajenatu-ral(figura5).

3. En el área de interacción se le presentan,junto a iconos o imágenes fotorrealistas repre-sentativas, lasaccionesquepuedeejecutar rela-cionadasconlacadenaintroducida.

4. En el área de resultados se le presentansugerencias de búsquedas coincidentes con lacadenaintroducida.

5. Adicionalmente se puede habilitar si esnecesario una tercera área en la parte inferiorpara ofrecer mensajes de ayuda o proporcionarfeedbacksobreelprocesodeinteracciónquevaarealizar(figura6).

6. Elusuariopulsasobreeliconodelaacciónquecorrespondaylaacciónsereflejaenelboxdebúsquedaqueactúacomounalíneadecomandos(figura7).

7. A continuación, el sistema le muestra loscontactosdesuagenda;sielusuarionoencuen-tra el deseado puede ir escribiendo el nombreen el box de búsqueda y las miniaturas de loscontactosvariaránconformealaraízintroducida(figura8).

8. Por último, pulsa retorno para ejecutar laacción, se lanza Gmail y se presenta su interfaz

RediseñandoGoogle:propuestaparaeldesarrollodeunsistemaoperativomultimodalubicuo–FranciscoTosete

Figura5

Figura6

Figura4

1. ElusuarioseidentificaenGoogle(figura4),apartirdeesemomentosuspreferencias,datos,búsquedas, documentos, contactos y programasestaránaccesiblesdesdelainterfazoatravésdelboxdebúsqueda.Sinoseidentificapuedehacer-lomásadelante,enelmomentodelallamadaalaacción,oelbuscadorpuedeactuarcomolanzadordelosprogramasoportunosdelsistemaoperativositienepermisoparaello.

AnuarioThinkEPI2010

204

???????????????????????????????????????????????????????????????????RediseñandoGoogle:propuestaparaeldesarrollodeunsistemaoperativomultimodalubicuo–FranciscoTosete

Figura8

Figura9

con la dirección del contacto escogido ya selec-cionada(figura9).

Estos prototipos se pueden descargar en elsiguienteurl:http://www.imaginas.net/pdf/FranciscoTosete_Redisenando_Google_v2.0.pdf

Esta propuesta es aplicable a cualquier granbuscador,Microsoft Live Search,Yahoo!,Apple.com,etc.Endefinitiva,acualquierinterfazenlaqueexistaunboxdesdeelquesepuedanejecutarbúsquedas o cualquier otro tipo de interacciónen base a comandos expresados en lenguajenatural,labasedecualquierfuturosistemaope-rativoubicuo,multimodalymultidispositivo,porsu extrema sencillez y extraordinaria capacidad

paraplegarydesplegar informaciónenunáreamínimadeespacio.

Nota:paravisualizarlainteracciónylacineste-siapropuesta(transicionesentreacciones),sereco-miendaverelpdfconlaúltimaversióndeAdobeReaderyutilizarlosbotonesdeavancedepágina(AvPage)yretrocesodepágina(RePage).

Referencias

Dans,Enrique.“ElalfabetoconAdeanticuado”.ElblogdeEnriqueDans,2008.http://www.enriquedans.com/2008/03/alfabeto-con-a-de-anticuado.html

Introducingubiquity.MozillaLabs.http://labs.mozilla.com/2008/08/introducing-ubiquity/

Norman,Don.“UIbreakthrough-commandlineinter-faces”.Jnd.org,2007.http://www.jnd.org/dn.mss/ui_breakthroughcomma.html

Pisani, Francis;Piotet,Dominique.Laalquimiadelasmultitudes.Madrid:Paidós,2009.

Ribbon(computing).Wikipedia.http://en.wikipedia.org/wiki/Ribbon_(computing)

Searchcommands.OfficeLabs.http://www.officelabs.com/projects/searchcommands/Pages/default.aspx

Tosete,Francisco.“Findabilityyloscajetinesdebús-queda”.Tentándole(Interacción),2006.http://tentandole.blogsome.com/2006/10/13/findability-y-los-cajetines-de-busqueda/

Figura7