{"id":1034,"date":"2014-10-24T09:04:13","date_gmt":"2014-10-24T13:04:13","guid":{"rendered":"http:\/\/blog.agilityfeat.com\/?p=1034"},"modified":"2020-11-10T02:38:50","modified_gmt":"2020-11-10T02:38:50","slug":"designing-iot","status":"publish","type":"post","link":"http:\/\/34.200.113.64\/en\/blog\/2014\/10\/designing-iot\/","title":{"rendered":"Internet of Things Design doesn\u2019t have to be overwhelming"},"content":{"rendered":"<p><img loading=\"lazy\" src=\"\/wp-content\/uploads\/2014\/10\/thematrix700.png\" alt=\"thematrix700\" width=\"700\" height=\"140\" class=\"alignleft size-full wp-image-1035\" style=\"max-width: 700px; max-height: 140px;\" \/><br clear=\"left\"\/><\/p>\n<p>The Internet of Things, Big Data, real time communications and messaging.  It conjures up images of complicated data dashboards with lots of running charts, streaming data, blinking lights, <strong><a href=\"https:\/\/www.youtube.com\/watch?v=wd9NQxIeAAc\" target=\"_blank\" rel=\"noopener noreferrer\">machines that go \u201cping\u201d<\/a><\/strong>, and just for fun maybe a live stream of trending Twitter topics.<\/p>\n<p><strong>These words conjure up information overload and visually complex applications.  But it shouldn\u2019t be this way.<\/strong><\/p>\n<p><img loading=\"lazy\" src=\"\/wp-content\/uploads\/2014\/10\/WhatIfIToldYou7002.png\" alt=\"WhatIfIToldYou700\" width=\"700\" height=\"296\" class=\"alignleft size-full wp-image-1036\" style=\"max-width: 700px; max-height: 296px; border=0px;\" \/><br clear=\"left\"\/><\/p>\n<p>This week I was in San Francisco at the <strong><a href=\"http:\/\/html5devconf.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">HTML5Developers Conference<\/a><\/strong>, which I always find inspiring.  In parallel tracks to this at the Moscone Center was also the <strong><a href=\"http:\/\/www.iotaconf.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">Internet of Things Conference<\/a><\/strong>, and so a common theme to both conferences was real time development in a number of forms:  wearables, iBeacons, WebRTC, Internet of Things, and all things Node.js and Javascript.<\/p>\n<p>One of the best sessions I attended was <strong><a href=\"http:\/\/www.iotaconf.com\/alfred_lui.html\" target=\"_blank\" rel=\"noopener noreferrer\">\u201cRe-orientating- UX Desing for the Internet of Things.\u201d<\/a><\/strong>  <strong><a href=\"https:\/\/twitter.com\/connection76\" target=\"_blank\" rel=\"noopener noreferrer\">Alfred Lui of Seer Labs<\/a><\/strong> made a number of interesting points, but this quote of his sums up the talk best for me.<\/p>\n<p><img loading=\"lazy\" src=\"\/wp-content\/uploads\/2014\/10\/WeNoLongerOwnTheForeground.png\" alt=\"WeNoLongerOwnTheForeground\" width=\"700\" height=\"140\" class=\"alignleft size-full wp-image-1039\" style=\"max-width: 700px; max-height: 140px;\" \/><br clear=\"left\"\/><\/p>\n<p><strong>Attention is a scarce commodity these days.<\/strong>  Your users are only glancing at the phone or browsing the internet for a few minutes before they do something else in the real world (like keep driving!) or before they move on to another application.<\/p>\n<p><strong>Instead, if you have real time information to radiate out to users, the best way to do it is using \u201cAmbient\u201d methods instead of Push or Pull.<\/strong>  The examples Alfred gave involved things like radiating color from a device that indicates the state of the data (red for bad, green for good perhaps).   If that color interests you, then you can go to the device and get more details from it.  But you get the most important information you need, the high level status, from just a glance at the color.<\/p>\n<p><img loading=\"lazy\" src=\"\/wp-content\/uploads\/2014\/10\/ChooseDataWisely.png\" alt=\"ChooseDataWisely\" width=\"700\" height=\"290\" class=\"alignleft size-full wp-image-1040\" style=\"max-width: 700px; max-height: 290px;\" \/><br clear=\"left\"\/><\/p>\n<p>This means you can\u2019t and shouldn\u2019t just throw all the data you have up on the screen.  <strong>The challenge for us as a developers and designers is to understand what few bits of data the user cares about most, and display only those initially unless the user asks for more.<\/strong><\/p>\n<p>Alfred described this with a ratio \u2026 you should try to <strong>maximize the value of the information you are providing, while requiring as little attention from the user as possible.<\/strong><\/p>\n<p><img loading=\"lazy\" src=\"\/wp-content\/uploads\/2014\/10\/InformationValue.png\" alt=\"InformationValue\" width=\"700\" height=\"140\" class=\"alignleft size-full wp-image-1041\" style=\"max-width: 700px; max-height: 140px;\" \/><br clear=\"left\"\/><\/p>\n<p><strong>You can always give them more information on request. <\/strong> Alfred described an example of a weather monitor that only shows you the temperature ambiently, but when you step up to it shows you more details about today\u2019s weather.  When you tap it, then you see the 5 day forecast.<\/p>\n<p>Perhaps this same principle should apply with data dashboards too?  Show a couple of key performance indicators at first, and then allow the user to see more data if they somehow indicate interest.  Interest is probably created by clicking, but maybe there are more creative ways to do that such as hovering over data, bringing the browser to the foreground, resizing the browser, going into full screen mode, or whatever.<\/p>\n<p>Alfred\u2019s talk stuck with me the rest of the conference, and everywhere I looked I was seeing either ambient data or opportunities to simplify an interface.  A presentation on Android Wear talked about how important it is to show minimal information on wearable devices like watches.  My colleague Allan\u2019s talk on using Node.js and Raspberry Pi\u2019s had a small glowing circle in the top corner that let him know if the Pi was still connected to the internet or not (a key concern when dealing with conference wifi).  And everywhere we walked around San Francisco, Allan was pointing out things that could or should be connected to the Internet of Things.<\/p>\n<p><img loading=\"lazy\" src=\"\/wp-content\/uploads\/2014\/10\/matrix_deciphered.png\" alt=\"matrix_deciphered\" width=\"700\" height=\"184\" class=\"alignleft size-full wp-image-1042\" style=\"max-width: 700px; max-height: 140px;\" \/><br clear=\"left\"\/><\/p>\n<p><strong>If we design this new world correctly, it doesn\u2019t have to be overwhelming. <\/strong> It can be simple, elegant, usable, and provide only limited information to the casual glance, but keep available all the power that IoT vendors promise when you make a request for more data.<\/p>","protected":false},"excerpt":{"rendered":"<p>The Internet of Things, Big Data, real time communications and messaging. It conjures up images of complicated data dashboards with lots of running charts, streaming data, blinking lights, machines that go \u201cping\u201d, and just for fun maybe a live stream of trending Twitter topics. These words conjure up information overload and visually complex applications. But [&hellip;]<\/p>","protected":false},"author":4,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_et_pb_use_builder":"","_et_pb_old_content":"","_et_gb_content_width":""},"categories":[100],"tags":[19,101,108,114,124,89,49],"jetpack_featured_media_url":"","yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v15.7 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Internet of Things Design doesn\u2019t have to be overwhelming - AgilityFeat Panama Software Test Center<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/agilityfeatpanama.com\/blog\/2014\/10\/designing-iot\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Internet of Things Design doesn\u2019t have to be overwhelming - AgilityFeat Panama Software Test Center\" \/>\n<meta property=\"og:description\" content=\"The Internet of Things, Big Data, real time communications and messaging. It conjures up images of complicated data dashboards with lots of running charts, streaming data, blinking lights, machines that go \u201cping\u201d, and just for fun maybe a live stream of trending Twitter topics. These words conjure up information overload and visually complex applications. But [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/agilityfeatpanama.com\/blog\/2014\/10\/designing-iot\/\" \/>\n<meta property=\"og:site_name\" content=\"AgilityFeat Panama Software Test Center\" \/>\n<meta property=\"article:published_time\" content=\"2014-10-24T13:04:13+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-11-10T02:38:50+00:00\" \/>\n<meta property=\"og:image\" content=\"http:\/\/34.200.113.64\/wp-content\/uploads\/2014\/10\/thematrix700.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\">\n\t<meta name=\"twitter:data1\" content=\"3 minutes\">\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebSite\",\"@id\":\"https:\/\/34.200.113.64\/#website\",\"url\":\"https:\/\/34.200.113.64\/\",\"name\":\"AgilityFeat Panama Software Test Center\",\"description\":\"AgilityFeat Panama offers customized, multilevel web and mobile software testing for a variety of industries.\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":\"https:\/\/34.200.113.64\/?s={search_term_string}\",\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/agilityfeatpanama.com\/blog\/2014\/10\/designing-iot\/#primaryimage\",\"inLanguage\":\"en-US\",\"url\":\"\/wp-content\/uploads\/2014\/10\/thematrix700.png\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/agilityfeatpanama.com\/blog\/2014\/10\/designing-iot\/#webpage\",\"url\":\"https:\/\/agilityfeatpanama.com\/blog\/2014\/10\/designing-iot\/\",\"name\":\"Internet of Things Design doesn\\u2019t have to be overwhelming - AgilityFeat Panama Software Test Center\",\"isPartOf\":{\"@id\":\"https:\/\/34.200.113.64\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/agilityfeatpanama.com\/blog\/2014\/10\/designing-iot\/#primaryimage\"},\"datePublished\":\"2014-10-24T13:04:13+00:00\",\"dateModified\":\"2020-11-10T02:38:50+00:00\",\"author\":{\"@id\":\"https:\/\/34.200.113.64\/#\/schema\/person\/c8d60d597071526db386b2b8a4afac64\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/agilityfeatpanama.com\/blog\/2014\/10\/designing-iot\/\"]}]},{\"@type\":\"Person\",\"@id\":\"https:\/\/34.200.113.64\/#\/schema\/person\/c8d60d597071526db386b2b8a4afac64\",\"name\":\"arin\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/34.200.113.64\/#personlogo\",\"inLanguage\":\"en-US\",\"url\":\"http:\/\/0.gravatar.com\/avatar\/cc498e210512c707ed769986dd745896?s=96&d=mm&r=g\",\"caption\":\"arin\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","_links":{"self":[{"href":"http:\/\/34.200.113.64\/en\/wp-json\/wp\/v2\/posts\/1034"}],"collection":[{"href":"http:\/\/34.200.113.64\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/34.200.113.64\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/34.200.113.64\/en\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"http:\/\/34.200.113.64\/en\/wp-json\/wp\/v2\/comments?post=1034"}],"version-history":[{"count":2,"href":"http:\/\/34.200.113.64\/en\/wp-json\/wp\/v2\/posts\/1034\/revisions"}],"predecessor-version":[{"id":1336,"href":"http:\/\/34.200.113.64\/en\/wp-json\/wp\/v2\/posts\/1034\/revisions\/1336"}],"wp:attachment":[{"href":"http:\/\/34.200.113.64\/en\/wp-json\/wp\/v2\/media?parent=1034"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/34.200.113.64\/en\/wp-json\/wp\/v2\/categories?post=1034"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/34.200.113.64\/en\/wp-json\/wp\/v2\/tags?post=1034"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}