{"id":757,"date":"2010-03-28T13:19:17","date_gmt":"2010-03-28T21:19:17","guid":{"rendered":"http:\/\/blog.rongeorge.com\/?p=757"},"modified":"2013-11-08T10:04:10","modified_gmt":"2013-11-08T15:04:10","slug":"ocgm-at-chi-2010","status":"publish","type":"post","link":"https:\/\/rongeorge.com\/blog\/ocgm-at-chi-2010\/","title":{"rendered":"OCGM is being presented at CHI 2010 and a prime example of OCGM"},"content":{"rendered":"<p>I know this is a bit late, because my co-author has <a href=\"http:\/\/nui.joshland.org\/2010\/02\/ocgm-universal-foundational-metaphors.html\">already reported it<\/a>, but I am very happy to announce that <a href=\"http:\/\/www.stevenseow.com\/chi10\/\">some ears have been listening<\/a>. The CHI &#8217;10 Workshop,<a href=\"http:\/\/www.stevenseow.com\/chi10\/\"> &#8220;Natural User Interfaces: The prospect and challenge of Touch and Gestural Computing&#8221;<\/a> has granted an audience to the new metaphor for design.<\/p>\n<p>The workshop is going to be an all day event on Saturday, where each of the authors will present and offer discussion about their position papers. The real benefit of this is that in such a narrow expertise, you really get amazing peer reviews and leave with amazing new ideas. These types of scoped interaction gatherings are a wonderful thing to foster innovation and creativity. It&#8217;s like a specialty conference inside of a specialty conference.<\/p>\n<p>One of the most interesting things, as I read the position papers that were accepted, was a cite from my writings.\u00a0 In the paper, &#8220;<a href=\"http:\/\/hci.uni-konstanz.de\/downloads\/NUI2010_CJ_JG_HR.pdf\">Natural User Interfaces: Why We Need<br \/>\nBetter Model-Worlds, Not Better Gestures.<\/a>(PDF)&#8221;\u00a0 the authors argue the need for separation between &#8220;symbolic gestures&#8221; and &#8220;manipulations.&#8221;<\/p>\n<blockquote><p>Manipulations are not gestures.<br \/>\nWe believe in a fundamental dichotomy of multi-touch<br \/>\ngestures on interactive surfaces. This dichotomy<br \/>\ndifferentiates between two classes of multi-touch<br \/>\ninteractions: symbolic gestures and manipulations.<\/p><\/blockquote>\n<p>They go on to define each specifically.<\/p>\n<blockquote><p>For us, symbolic gestures are close to the keyboard<br \/>\nshortcuts of WIMP systems. They are not continuous<br \/>\nbut are executed by the user at a certain point of time<br \/>\nto trigger an automated system procedure. There is no<br \/>\nuser control or feedback after triggering.<\/p>\n<p>&#8230;<\/p>\n<p>The opposite class of multi-touch interactions is<br \/>\nmanipulations. Unlike symbolic gestures, manipulations<br \/>\nare continuous between manipulation initiation (e.g.<br \/>\nuser fingers down) and completion (e.g. user fingers<br \/>\nup). During this time span, user actions lead to smooth<br \/>\ncontinuous changes of the system state with immediate<br \/>\noutput.<\/p><\/blockquote>\n<p>It is a lovely way to differentiate the two and I couldn&#8217;t agree more. As the crevasse between the two interactions widens, we begin to see many more differences. I have gotten a few emails from bewildered Interaction Designers, both young and old, asking &#8220;why do we need this separation?&#8221;<\/p>\n<p>The answer is not quite as apparent as it will be in the next few years. We need this distinction because designers and developers need to think about experiences differently. We need to plan and design for interactions in a fluid and responsive way. Arbitrarily throwing a manipulation on a destructive action, could have dire consequences for the user. Using a complex gesture for a simple help menu, would create a pause in your user&#8217;s experience.<\/p>\n<h2>Let me give you an example of the two with a nice crisp physical metaphor demonstrating OCGM<\/h2>\n<p>You have a pile of sticks.<\/p>\n<div id=\"attachment_758\" style=\"width: 465px\" class=\"wp-caption alignright\"><a href=\"http:\/\/blog.rongeorge.com\/wp-content\/uploads\/pile-of-sticks.jpg\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-758\" class=\"size-large wp-image-758 \" title=\"Sticks on a table\" src=\"http:\/\/blog.rongeorge.com\/wp-content\/uploads\/pile-of-sticks-650x577.jpg\" alt=\"\" width=\"455\" height=\"404\" \/><\/a><p id=\"caption-attachment-758\" class=\"wp-caption-text\">Just a pile of sticks<\/p><\/div>\n<p>Think of the sticks as <strong>Objects<\/strong>. Think of the table as a <strong>Container<\/strong>. Now let&#8217;s examine the relationship between the two. The container contains many objects, therefore operations executed on the container will have multiple effects on each of the singular instances of the objects.<\/p>\n<p>Now, let&#8217;s give you a few things to do those operations. First, let&#8217;s give you a hand, which we will call a <strong>Manipulation<\/strong>. Then let&#8217;s give you a chainsaw, which we will call a <strong>Gesture<\/strong>.<\/p>\n<p>To move the sticks, to rearrange them, to take them in and out of the container (on or off the table) we can use a hand. It might not be the most efficient, but it gets the job done and we can do these methodically. All the while, we can always <span style=\"text-decoration: underline;\">undo our actions easily<\/span>.<\/p>\n<p>If someone comes up and talks to us, we don&#8217;t hesitate to respond because there is nothing really at jeopardy here. In fact, it might be nice for someone to come up and interact with us while we are doing these <span style=\"text-decoration: underline;\">chores<\/span>.<\/p>\n<p>This also puts us at ease. We can do these things and if we get interrupted, we have no stress. Why? Because everything is undo-able. Things are easily moved back and forth with no real consequences. Even if we push the entire stack to the ground, we can easily pick them up and put them back. One handed.<\/p>\n<p><strong><span style=\"text-decoration: underline;\">This is the physical realization of a manipulation.<\/span><\/strong><\/p>\n<p><span style=\"text-decoration: underline;\"><\/p>\n<div id=\"attachment_761\" style=\"width: 310px\" class=\"wp-caption alignleft\"><span style=\"text-decoration: underline;\"><a href=\"http:\/\/blog.rongeorge.com\/wp-content\/uploads\/craftsman-chainsaw-35020.jpg\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-761\" class=\"size-medium wp-image-761\" title=\"Chainsaw\" src=\"http:\/\/blog.rongeorge.com\/wp-content\/uploads\/craftsman-chainsaw-35020-300x300.jpg\" alt=\"\" width=\"300\" height=\"300\" \/><\/a><\/span><p id=\"caption-attachment-761\" class=\"wp-caption-text\">a Chainsaw &quot;gesture&quot;<\/p><\/div>\n<p><\/span><\/p>\n<p>Now, we take your chainsaw. This is a complex piece of machinery. This is going to take focus, intent, and possibly a plan to implement. The things we can do with this are destructive, irreversible, and should be taken with care because they could damage other things around the single container or multitude of objects.<\/p>\n<p>We consult the manual, don safety gear, check the gasoline in the chainsaw, pull the handle, and then fire it up. Each one of these actions were simple and <span style=\"text-decoration: underline;\">were not harmful, until they were combined<\/span>. Combining all of these harmless manipulations results in a gesture that could do harm.<\/p>\n<p>Let&#8217;s think about what we just did though. We had to do things<span style=\"text-decoration: underline;\"> in a certain order<\/span>, we <span style=\"text-decoration: underline;\">had to do each of them<\/span>, and<span style=\"text-decoration: underline;\"> they were predetermined<\/span> by something other than us.<\/p>\n<p>Now could we take our gesture chainsaw and destroy the Container and all of the objects inside? Yes. Could we also affect other containers and things in the vicinity? Yes. There is no undo, when its done its done.<\/p>\n<p><strong><span style=\"text-decoration: underline;\">This is the physical realization of a Gesture.<\/span><\/strong><\/p>\n<p><strong>So I digress&#8230;.<\/strong><\/p>\n<p>Why is it important in interface design to distinguish between the two? To promote a better experience through expected interactions and results. Do you want your users concentrating on the most mundane of tasks? Let your user relax when they can. Do not make them concentrate on these details of where to move an object when they don&#8217;t have to.<\/p>\n<h3>Allowing your users to free up precious concentration allows your interface to become more complex. Right now, the main impediment for complexity in interface design is the user. By distinguishing between the two, we can begin to create more complex interfaces by relinquishing as much focus as possible, when possible.<\/h3>\n","protected":false},"excerpt":{"rendered":"<p>I know this is a bit late, because my co-author has already reported it, but I am very happy to announce that some ears have been listening. The CHI &#8217;10 Workshop, &#8220;Natural User Interfaces: The prospect and challenge of Touch and Gestural Computing&#8221; has granted an audience to the new metaphor for design. The workshop [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-757","post","type-post","status-publish","format-standard","hentry","category-design"],"_links":{"self":[{"href":"https:\/\/rongeorge.com\/blog\/wp-json\/wp\/v2\/posts\/757","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rongeorge.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/rongeorge.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/rongeorge.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/rongeorge.com\/blog\/wp-json\/wp\/v2\/comments?post=757"}],"version-history":[{"count":1,"href":"https:\/\/rongeorge.com\/blog\/wp-json\/wp\/v2\/posts\/757\/revisions"}],"predecessor-version":[{"id":852,"href":"https:\/\/rongeorge.com\/blog\/wp-json\/wp\/v2\/posts\/757\/revisions\/852"}],"wp:attachment":[{"href":"https:\/\/rongeorge.com\/blog\/wp-json\/wp\/v2\/media?parent=757"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/rongeorge.com\/blog\/wp-json\/wp\/v2\/categories?post=757"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/rongeorge.com\/blog\/wp-json\/wp\/v2\/tags?post=757"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}