{"id":723,"date":"2012-06-26T21:04:56","date_gmt":"2012-06-26T21:04:56","guid":{"rendered":"http:\/\/multimedia.uoc.edu\/di\/?p=723"},"modified":"2012-06-26T21:04:56","modified_gmt":"2012-06-26T21:04:56","slug":"cas-destudi-io-brush-the-world-as-a-palette-pinzell-es-el-mon-com-a-paleta","status":"publish","type":"post","link":"http:\/\/multimedia.uoc.edu\/blogs\/di\/es\/2012\/06\/26\/cas-destudi-io-brush-the-world-as-a-palette-pinzell-es-el-mon-com-a-paleta\/","title":{"rendered":"CAS D&#8217;ESTUDI :: I\/O BRUSH: The World As A Palette (Pinzell E\/S: el m\u00f3n com a paleta)"},"content":{"rendered":"<p><br \/>\n<\/p>\n<h2>I\/O Brush: The world as a palette<\/h2>\n<p><a title=\"Web de Businessweek\" href=\"http:\/\/images.businessweek.com\/ss\/05\/06\/idea2005\/source\/139.htm\" target=\"_blank\"><strong><em>Gold Award &#8211; Industrial Design Society of America 2005 &#8211; Industrial Design Excellence Award\u00a0<\/em><\/strong><\/a><\/p>\n<ul>\n<li><a title=\"Web de Kimiko Ryokai en el MIT\" href=\"http:\/\/web.media.mit.edu\/~kimiko\" target=\"_blank\">Kimiko Ryokai<\/a> , <a title=\"Web de Stefan Marti en el MIT\" href=\"http:\/\/web.media.mit.edu\/~stefanm\" target=\"_blank\">Stefan Marti<\/a> , <a title=\"Web de Hiroshi Ishii en el MIT\" href=\"http:\/\/tangible.media.mit.edu\/people\/hiroshi.php\" target=\"_blank\">Hiroshi Ishii<\/a> \/ \u00a92003-2006 <a title=\"Web del MIT Media Lab\" href=\"http:\/\/www.media.mit.edu\/\" target=\"_blank\">MIT Media Lab<\/a><\/li>\n<li><a title=\"Projecto en la web de Ryokai\" href=\"http:\/\/web.media.mit.edu\/~kimiko\/iobrush\/\" target=\"_blank\">I\/O Brush [projecte]<\/a> [web \/ angl\u00e8s]<\/li>\n<li><a title=\"Video en la web de Ryokai\" href=\"http:\/\/web.media.mit.edu\/~kimiko\/iobrush\/iobrush_quicktime_medium.mov\" target=\"_blank\">I\/O Brush [Video]<\/a> [25MB \/ Quicktime]<\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n<h3>T\u00e9cnicas<\/h3>\n<ul>\n<li>HCI \u2192 H.5.1 [Interfaces de informaci\u00f3n y presentaci\u00f3n].<\/li>\n<li>Realidad artificial \/ aumentada \/ virtual.<\/li>\n<li>Ingenier\u00eda electr\u00f3nica.<\/li>\n<\/ul>\n<h3>An\u00e1lisis del dise\u00f1o de interacci\u00f3n<\/h3>\n<h4>Descripci\u00f3n<a href=\"http:\/\/multimedia.uoc.edu\/blogs\/di\/files\/2012\/06\/IO-brush-1.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignright size-full wp-image-734\" title=\"IO brush 1\" src=\"http:\/\/multimedia.uoc.edu\/blogs\/di\/files\/2012\/06\/IO-brush-1.jpg\" alt=\"\" width=\"275\" height=\"477\" \/><\/a><\/h4>\n<p><em>I\/O Brush<\/em>\u00a0es una herramienta que permite al usuario crear proyectos art\u00edsticos con elementos (color, textura y patrones en movimiento) extra\u00eddos directamente de su entorno inmediato. La herramienta \u00abI\/O Brush\u00bb tiene un aspecto parecido a un pincel real pero contiene una c\u00e1mara de video, sensores t\u00e1ctiles y fotosensores. Colocando o arrastrando el pincel sobre objetos o superficies se pueden recoger colores, texturas y movimientos para, a continuaci\u00f3n, utilizar esta \u00abtinta\u00bb capturada y dibujar sobre un lienzo que consiste en un panel t\u00e1ctil sobre una pantalla de proyecci\u00f3n trasera. El panel tambi\u00e9n permite la interacci\u00f3n utilizando los dedos para difuminar los trazos realizados.<\/p>\n<p>Durante el desarrollo de esta herramienta y despu\u00e9s de las pruebas con usuarios, se coincidi\u00f3 en que ser\u00eda muy \u00fatil poder ver qu\u00e9 muestra se estaba recogiendo con el pincel antes de pintar con ella en el lienzo. Una primera opci\u00f3n fue mantener una ventana en una esquina de la pantalla que funcionase como vista preliminar aunque estorbaba y obligaba al artista a mirar la pantalla cont\u00ednuamente. La soluci\u00f3n fue desarrollar una paleta complementaria que el usuario pod\u00eda tener cerca implementada en un tablet.<\/p>\n<blockquote><p><span style=\"color: #808080\">Otro aspecto interesante del proyecto es que el sistema mantiene un historial de la procedencia de cada muestra o color utilizado. La videoc\u00e1mara env\u00eda constantemente video en \u00abstreaming\u00bb al ordenador i almacen los \u00faltimos cinco segundos antes de que el pincel haga un trazo en la pantalla. Este historial se mapea junto con el trazo realizado de modoe que, cuando se toca, la pel\u00edcula con la grabaci\u00f3n se reproduce en el mismo lienzo y permite visualizar el origen de la muestra utilizada.<\/span><\/p><\/blockquote>\n<h3>Diagrama de flujo<\/h3>\n<p><a href=\"http:\/\/multimedia.uoc.edu\/blogs\/di\/files\/2012\/06\/IO-brush-3.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-736 alignnone\" title=\"IO brush 3\" src=\"http:\/\/multimedia.uoc.edu\/blogs\/di\/files\/2012\/06\/IO-brush-3.jpg\" alt=\"\" width=\"721\" height=\"409\" srcset=\"http:\/\/multimedia.uoc.edu\/blogs\/di\/files\/2012\/06\/IO-brush-3.jpg 721w, http:\/\/multimedia.uoc.edu\/blogs\/di\/files\/2012\/06\/IO-brush-3-300x170.jpg 300w, http:\/\/multimedia.uoc.edu\/blogs\/di\/files\/2012\/06\/IO-brush-3-624x353.jpg 624w\" sizes=\"auto, (max-width: 721px) 100vw, 721px\" \/><\/a><\/p>\n<h3>Usabilidad<\/h3>\n<p>Utilizar I\/O Brush es muy parecido a utilizar las herramientas cl\u00e1sicas de pintura: <a href=\"http:\/\/multimedia.uoc.edu\/blogs\/di\/files\/2012\/06\/IO-brush-tabla.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-780\" title=\"IO brush tabla\" src=\"http:\/\/multimedia.uoc.edu\/blogs\/di\/files\/2012\/06\/IO-brush-tabla.jpg\" alt=\"\" width=\"661\" height=\"202\" \/><\/a><br \/>\n<a href=\"http:\/\/multimedia.uoc.edu\/blogs\/di\/files\/2012\/06\/IO-brush-4.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignleft size-full wp-image-737\" style=\"margin-right: 8px;border-width: 1px;border-color: black;border-style: solid\" title=\"IO brush 4\" src=\"http:\/\/multimedia.uoc.edu\/blogs\/di\/files\/2012\/06\/IO-brush-4.jpg\" alt=\"\" width=\"126\" height=\"136\" \/><\/a><br \/>\nLa interacci\u00f3n con el pincel es \u00abnatural\u00bb. Los sensores de presi\u00f3n del I\/O Brush permiten variar el volumen de tinta: cuanto mayor es la presi\u00f3n que se hace sobre la pantalla, m\u00e1s grosor\/densidad tiene la tinta que fluye sobre el lienzo, controlando de esta manera el tama\u00f1o de la imagen sampleada. Por otro lado, el inclin\u00f3metro inclu\u00eddo en el pincel permite obtener muestras que, adem\u00e1s de la imagen, capturan la orientaci\u00f3n. As\u00ed, la expresividad obtenida con el movimiento del pincel sumada a la presi\u00f3n ejercida en el pincel dotan al I\/O Brush de mayores capacidades expresivas. <a href=\"http:\/\/multimedia.uoc.edu\/blogs\/di\/files\/2012\/06\/IO-brush-2.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignright size-full wp-image-735\" style=\"border-width: 1px;border-color: black;border-style: solid;margin: 8px\" title=\"IO brush 2\" src=\"http:\/\/multimedia.uoc.edu\/blogs\/di\/files\/2012\/06\/IO-brush-2.jpg\" alt=\"\" width=\"150\" height=\"147\" \/><\/a><\/p>\n<p>Muy interesante es, tambi\u00e9n, la posibilidad de interactuar con el historial de muestras. A medida que se utiliza el I\/O Brush el sistema conserva un historial en video de los \u00faltimos segundos de uso hasta que se pinta sobre el lienzo. Eso posibilita que cada color del retrato tenga una pel\u00edcula documental asociada referente a la procedencia de esa tinta. Cuando se toca cualquier zona del lienzo, la pel\u00edcula con ese historial se reproduce sobre el mismo retrato durante unos instantes.<\/p>\n<p>Hay un tercer elemento usable presente en este proyecto y se trata de la posibilidad de actuar tambi\u00e9n sobre el lienzo (que se convierte en dispositivo de entrada y salida) mediante la t\u00e9cnica del difuminado.<\/p>\n<h3>Valoraci\u00f3n personal \/ Aportaciones creativas<\/h3>\n<p>\u00abLa herramienta <em>tamp\u00f3n de clonar y motivo<\/em> en Photoshop y otros editores de imagen con un <em>mango anal\u00f3gico<\/em>\u00ab: eso parece I\/O Brush. Este proyecto a\u00f1ade un nuevo aspecto de interactividad a dos bandas: interactuar con esta herramienta te obliga a interactuar, adem\u00e1s, con tu entorno, y el resultado se convierte tambi\u00e9n en entorno\u2026 (demasiado filos\u00f3fico).<\/p>\n<p>Algunas de las mejoras que se podr\u00edan a\u00f1adir a este interesant\u00edsimo proyecto probablemente pasan por aumentar sus capacidades, como por ejemplo:<\/p>\n<ul>\n<li>poder cambiar el grosor del pincel a voluntad<\/li>\n<li>tener mayor n\u00famero de colores en la paleta (ahora es un m\u00e1ximo de 5)<\/li>\n<li>poder actuar sobre aspectos del trazo (m\u00e1s dilu\u00eddo o m\u00e1s puro), y sobre todo<\/li>\n<li>hacerlo portable, inal\u00e1mbrico: poder utilizar un color rosa obteniendo la muestra de rosa real (o un lavanda, un violeta&#8230;) y convertirnos en los nuevos impresionistas.<\/li>\n<\/ul>\n<p style=\"text-align: center\">\u00a7<\/p>\n<h3>Bibliograf\u00eda \/ Referencias<\/h3>\n<ul>\n<li>RYOKAI, K., MARTI, S., ISHII, H. (2004), <em>I\/O Brush: Drawing with Everyday Objects as Ink<\/em>. In Proceedings of Conference on Human Factors in Computing Systems (CHI &#8217;04), (Vienna, Austria, April 24 &#8211; April 29, 2004)<\/li>\n<\/ul>\n<p><\/p>","protected":false},"excerpt":{"rendered":"<p>I\/O Brush: The world as a palette Gold Award &#8211; Industrial Design Society of America 2005 &#8211; Industrial Design Excellence Award\u00a0 Kimiko Ryokai , Stefan Marti , Hiroshi Ishii \/ \u00a92003-2006 MIT Media Lab I\/O Brush [projecte] [web \/ angl\u00e8s] I\/O Brush [Video] [25MB \/ Quicktime] &nbsp; T\u00e9cnicas HCI \u2192 H.5.1 [Interfaces de informaci\u00f3n y &hellip; <\/p>\n<p class=\"link-more\"><a href=\"http:\/\/multimedia.uoc.edu\/blogs\/di\/es\/2012\/06\/26\/cas-destudi-io-brush-the-world-as-a-palette-pinzell-es-el-mon-com-a-paleta\/\" class=\"more-link\">Seguir leyendo<span class=\"screen-reader-text\"> \u00abCAS D&#8217;ESTUDI :: I\/O BRUSH: The World As A Palette (Pinzell E\/S: el m\u00f3n com a paleta)\u00bb<\/span><\/a><\/p>\n","protected":false},"author":18,"featured_media":774,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2,3],"tags":[30,31,32,39,42],"class_list":["post-723","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-articles-2012","category-casosestudi-2012","tag-hiroshi-ishii","tag-io-brush","tag-kimiko-ryokai","tag-ruben-valero","tag-stefan-marti","entry"],"_links":{"self":[{"href":"http:\/\/multimedia.uoc.edu\/blogs\/di\/es\/wp-json\/wp\/v2\/posts\/723","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/multimedia.uoc.edu\/blogs\/di\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/multimedia.uoc.edu\/blogs\/di\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/multimedia.uoc.edu\/blogs\/di\/es\/wp-json\/wp\/v2\/users\/18"}],"replies":[{"embeddable":true,"href":"http:\/\/multimedia.uoc.edu\/blogs\/di\/es\/wp-json\/wp\/v2\/comments?post=723"}],"version-history":[{"count":0,"href":"http:\/\/multimedia.uoc.edu\/blogs\/di\/es\/wp-json\/wp\/v2\/posts\/723\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"http:\/\/multimedia.uoc.edu\/blogs\/di\/es\/wp-json\/wp\/v2\/media\/774"}],"wp:attachment":[{"href":"http:\/\/multimedia.uoc.edu\/blogs\/di\/es\/wp-json\/wp\/v2\/media?parent=723"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/multimedia.uoc.edu\/blogs\/di\/es\/wp-json\/wp\/v2\/categories?post=723"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/multimedia.uoc.edu\/blogs\/di\/es\/wp-json\/wp\/v2\/tags?post=723"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}