{"id":23242,"date":"2014-05-16T07:15:16","date_gmt":"2014-05-16T11:15:16","guid":{"rendered":"http:\/\/webdesignledger.com\/?p=23242"},"modified":"2015-08-18T14:44:23","modified_gmt":"2015-08-18T21:44:23","slug":"how-wearable-technology-will-impact-web-design","status":"publish","type":"post","link":"https:\/\/webdesignledger.com\/how-wearable-technology-will-impact-web-design\/","title":{"rendered":"How Wearable Technology Will Impact Web Design"},"content":{"rendered":"<p>Remember how wearing a calculator watch back in the day made you feel like George Jetson or his boy Elroy? Technology has come a long way from spelling out naughty words (upside down) on your calculator. These days, you can make calls, record videos, check your health, and buy coffee from your smartwatch&#8211;and that\u2019s just the beginning. With the advent of <a href=\"http:\/\/www.google.com\/glass\/start\/\">Google Glass<\/a>, <a href=\"http:\/\/www.android.com\/wear\/\">Android Wear<\/a>, and the distant promise of <a href=\"http:\/\/www.t3.com\/news\/apple-iwatch-rumours-features-release-date\">Apple iWatch<\/a>, the world is slowly getting comfortable with the idea of wearing technology, instead of holding it. This idea of wearing a computer will undoubtedly shift the way users interact with the internet and its design. Is your web design future proof?<!--more--><\/p>\n<h2>What Exactly is Wearable Technology?<\/h2>\n<p>Wearable technology can be clothing or accessory items. Most wearable technology comes in the form of wrist wear or eyeglasses. It\u2019s normally light-weight and unassuming. The most popular and accessible uses for wearable tech exist in the realm of fitness gadgets, such as <a href=\"http:\/\/www.fitbit.com\/\">Fitbit<\/a>, and smartwatches, like <a href=\"https:\/\/getpebble.com\/\">Pebble<\/a>. Google Glass has gotten a lot of attention but, at $1500 a pop, it\u2019s cost prohibitive from most folks. That said, so was the iPod when it was <a href=\"http:\/\/www.ilounge.com\/index.php\/articles\/comments\/instant-expert-a-brief-history-of-ipod\/\">first introduced<\/a>. Eventually, a competitive marketplace will drive the price to a reasonable cost, and you\u2019ll need to be ready when it happens.<\/p>\n<div id=\"attachment_23259\" style=\"width: 1034px\" class=\"wp-caption alignnone\"><a href=\"https:\/\/storage.googleapis.com\/webdesignledger.pub.network\/WDL\/2014\/05\/Moto-360-Cafe-image.jpg\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-23259\" class=\"size-large wp-image-23259 lazyload\" data-src=\"https:\/\/storage.googleapis.com\/webdesignledger.pub.network\/WDL\/2014\/05\/Moto-360-Cafe-image-1024x1024.jpg\" alt=\"Moto 360 \" width=\"1024\" height=\"1024\" data-srcset=\"https:\/\/webdesignledger.com\/wp-content\/uploads\/2014\/05\/Moto-360-Cafe-image-1024x1024.jpg 1024w, https:\/\/webdesignledger.com\/wp-content\/uploads\/2014\/05\/Moto-360-Cafe-image-150x150.jpg 150w, https:\/\/webdesignledger.com\/wp-content\/uploads\/2014\/05\/Moto-360-Cafe-image-300x300.jpg 300w, https:\/\/webdesignledger.com\/wp-content\/uploads\/2014\/05\/Moto-360-Cafe-image-100x100.jpg 100w, https:\/\/webdesignledger.com\/wp-content\/uploads\/2014\/05\/Moto-360-Cafe-image.jpg 2048w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/1024;\" \/><noscript><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-23259\" class=\"size-large wp-image-23259\" src=\"https:\/\/storage.googleapis.com\/webdesignledger.pub.network\/WDL\/2014\/05\/Moto-360-Cafe-image-1024x1024.jpg\" alt=\"Moto 360 \" width=\"1024\" height=\"1024\" srcset=\"https:\/\/webdesignledger.com\/wp-content\/uploads\/2014\/05\/Moto-360-Cafe-image-1024x1024.jpg 1024w, https:\/\/webdesignledger.com\/wp-content\/uploads\/2014\/05\/Moto-360-Cafe-image-150x150.jpg 150w, https:\/\/webdesignledger.com\/wp-content\/uploads\/2014\/05\/Moto-360-Cafe-image-300x300.jpg 300w, https:\/\/webdesignledger.com\/wp-content\/uploads\/2014\/05\/Moto-360-Cafe-image-100x100.jpg 100w, https:\/\/webdesignledger.com\/wp-content\/uploads\/2014\/05\/Moto-360-Cafe-image.jpg 2048w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/noscript><\/a><p id=\"caption-attachment-23259\" class=\"wp-caption-text\">Motorola&#8217;s Moto 360 uses Google&#8217;s Android Wear to create an interactive experience with your watch. Moto360.motorola.com<\/p><\/div>\n<h2>Why Should You, Web Designer, Care?<\/h2>\n<p>A lot of naysayers are quick to write off wearable technology as a fad, but a <a href=\"http:\/\/www.pewinternet.org\/2014\/05\/14\/internet-of-things\/\">recent report<\/a> from Pew Research Center Internet Project indicates that 83% of industry experts believe that wearable technology will see huge growth within the next 10 years. By 2025, we\u2019ll be fully immersed in the <a href=\"http:\/\/www.techopedia.com\/2\/30087\/internet\/web-20\/what-the-is-the-internet-of-things\">Internet of Things (IoT)<\/a>. This means that users will be accessing websites from various platforms, not just desktops and mobile devices.<\/p>\n<p>As technology expands and more users embrace wearables, more of your clients will want to their sites to be accessible. If you\u2019re unprepared for such requests, clients will search elsewhere to fit their needs.<\/p>\n<p>Although wearable technology is in its infancy now, it\u2019s rapidly growing. Expect it to develop like a kid in puberty&#8211; overnight. All of the primitive functions of wearable tech are already in place&#8211; browsing, social media, instant messaging, camera, and video. As a web designer, your job will be getting rid of the pimples and awkwardness that comes along with pubescent technology. Like now, your future in wearable tech will consist of creating a beautiful and functional space that allows users to effectively access the information they care about.<\/p>\n<p>Full-blown web design for wearable tech may be a ways off, but it\u2019s not too early to start thinking about how this type of technology will inform your design decisions.<\/p>\n<h2>How Will Wearable Tech Impact Your Design?<\/h2>\n<p>There\u2019s no doubt that wearable tech will impact your web design, the question is how. We can look at how the introduction of mobile technology, such as smart phones and tablets, challenged the web design community to create responsive language. In much that same way, the advent of wearable tech will cause designers to streamline and ruthlessly edit the superfluous.<\/p>\n<h2>Here\u2019s 7 considerations for wearable tech web design:<\/h2>\n<h3>1. Designs are responsive.<\/h3>\n<p>This cannot be emphasized enough. When I browse over mobile devices, I encounter a huge number of websites that aren\u2019t optimized for mobile viewing. <em>In 2014.<\/em> According to a recent <a href=\"http:\/\/restive.io\/insights\/state-of-the-mobile-web-ee-Q1-2014.html\">study<\/a> performed by Restive Labs, only 3% of Fortune 1000 websites are responsive and fast. If they can\u2019t get it right, you can imagine how most fair.<\/p>\n<p>Currently, browser-capable wearable technology uses mobile viewports. Don\u2019t wait to implement this meta tag into your web design.<\/p>\n<h3>2. Information is instant.<\/h3>\n<p>Wear techies (a term I made up, affectionately) want information immediately. Instant access is the whole point of wearing technology as opposed to putting it in your pocket. This means that your web design shouldn\u2019t get in the way and slow the user\u2019s access to information.<\/p>\n<p>Why is the visitor on your website? Figure it out and plan your design around the answer. Once you get away from designing for design\u2019s sake, and understand what\u2019s most important to the visitor, you\u2019ll be able to strip away elements or flaws in your design that slow down your site, or clutter the user\u2019s path to information.<\/p>\n<h3>3. Interactivity is everything.<\/h3>\n<p>Wearable tech is a soft introduction into augmented reality. Take a look at the <a href=\"http:\/\/innovega-inc.com\/press_ces_2014.php\">Innovega iOptik platform<\/a> that will provide users with a \u201cvirtual canvas\u201d through the combination of contact lenses and micro-projector eyeglasses.<\/p>\n<div id=\"attachment_23249\" style=\"width: 963px\" class=\"wp-caption alignnone\"><a href=\"https:\/\/storage.googleapis.com\/webdesignledger.pub.network\/WDL\/2014\/05\/innovega.jpg\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-23249\" class=\"size-full wp-image-23249 lazyload\" data-src=\"https:\/\/storage.googleapis.com\/webdesignledger.pub.network\/WDL\/2014\/05\/innovega.jpg\" alt=\"Innovega iOptik\" width=\"953\" height=\"635\" data-srcset=\"https:\/\/webdesignledger.com\/wp-content\/uploads\/2014\/05\/innovega.jpg 953w, https:\/\/webdesignledger.com\/wp-content\/uploads\/2014\/05\/innovega-300x199.jpg 300w\" data-sizes=\"(max-width: 953px) 100vw, 953px\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" style=\"--smush-placeholder-width: 953px; --smush-placeholder-aspect-ratio: 953\/635;\" \/><noscript><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-23249\" class=\"size-full wp-image-23249\" src=\"https:\/\/storage.googleapis.com\/webdesignledger.pub.network\/WDL\/2014\/05\/innovega.jpg\" alt=\"Innovega iOptik\" width=\"953\" height=\"635\" srcset=\"https:\/\/webdesignledger.com\/wp-content\/uploads\/2014\/05\/innovega.jpg 953w, https:\/\/webdesignledger.com\/wp-content\/uploads\/2014\/05\/innovega-300x199.jpg 300w\" sizes=\"(max-width: 953px) 100vw, 953px\" \/><\/noscript><\/a><p id=\"caption-attachment-23249\" class=\"wp-caption-text\">Use a combination of contact lens and enhanced eyeglasses to augment reality. Innovega-inc.com<\/p><\/div>\n<p>Voice navigation is another interactive element in wearable tech. If you don\u2019t want to talk, you can just move your <a href=\"https:\/\/support.google.com\/glass\/answer\/3064184?hl=en\">head<\/a>, <a href=\"https:\/\/www.kickstarter.com\/projects\/114216817\/dizmo-a-new-revolutionary-user-interface\">hand<\/a>, or possibly only your <a href=\"https:\/\/www.kickstarter.com\/projects\/1761670738\/ring-shortcut-everything\">finger<\/a> to navigate.<\/p>\n<p>Wearable tech allows users to get inside of technology in a way that\u2019s never been done before.<br \/>\nWhat does that mean for web design?<br \/>\nFor one thing, it means your web design can\u2019t be static and resting on pretty. It should be dynamic with a clear understanding of who your visitors are and how best to meet their needs.<\/p>\n<h3>4. Design is minimalist.<\/h3>\n<p>Minimalism has been on trend for the last few years in web design, but expect it to go even further. Minimalist design is more appealing for the wearable platform because it doesn\u2019t overwhelm. Too often, web designers over-stylize in an attempt to impress. The harder work is in creating a quiet design that lets the content take center state. Your ability to edit is in direct proportion to your maturity as a designer.<\/p>\n<p>Think about how you\u2019d like your website to be perceived on a wearable device. Screen space is limited.<\/p>\n<h3>5. Text is larger.<\/h3>\n<p>When will the small text finally die? I\u2019m a big believer in 12 pt or higher, but no where is this more important than with wearable technology.<\/p>\n<p>Let\u2019s take a look at Google Glass. Although limited in scope and navigation, users can still access web pages. If your website hasn\u2019t been optimized for mobile browsing (see #1), visitors may not be able to read the text on the screen. In Google Glass, the display is akin to looking a 25\u201d TV from 8 feet away. Imagine trying to read tiny text on that TV. No bueno.<\/p>\n<h3>6. Pop-ups are ostracized.<\/h3>\n<p>I\u2019m not a big fan of pop-ups, no matter how sleek. It may be controversial, but pop-ups have absolutely no place in wearable technology, at least not yet. Try closing the \u201cx\u201d of a pop-up window in the aforementioned Google Glass.<\/p>\n<p>If you must include a pop-up window, be gracious enough to include a huge \u201cclose\u201d button.<\/p>\n<h3>7. Web design is intuitive.<\/h3>\n<p>Answer this question: Why is someone accessing your site from wearable technology? Is it to stay informed, to be entertained, to get directions, to find a coupon? Whatever the need, your web design must understand and guide your visitor to their natural conclusion.<\/p>\n<p>Intuitive design is more important than ever when it comes to wearable tech. Users won\u2019t have the flexibility (or patience) to browse your website. Instead, your website must intuitively anticipate the user experience.<\/p>\n<div id=\"attachment_23252\" style=\"width: 1034px\" class=\"wp-caption alignnone\"><a href=\"https:\/\/storage.googleapis.com\/webdesignledger.pub.network\/WDL\/2014\/05\/metaspaceglasses.jpg\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-23252\" class=\"size-large wp-image-23252 lazyload\" data-src=\"https:\/\/storage.googleapis.com\/webdesignledger.pub.network\/WDL\/2014\/05\/metaspaceglasses-1024x575.jpg\" alt=\"Meta SpaceGlasses\" width=\"1024\" height=\"575\" data-srcset=\"https:\/\/webdesignledger.com\/wp-content\/uploads\/2014\/05\/metaspaceglasses-1024x575.jpg 1024w, https:\/\/webdesignledger.com\/wp-content\/uploads\/2014\/05\/metaspaceglasses-300x168.jpg 300w, https:\/\/webdesignledger.com\/wp-content\/uploads\/2014\/05\/metaspaceglasses.jpg 1366w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/575;\" \/><noscript><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-23252\" class=\"size-large wp-image-23252\" src=\"https:\/\/storage.googleapis.com\/webdesignledger.pub.network\/WDL\/2014\/05\/metaspaceglasses-1024x575.jpg\" alt=\"Meta SpaceGlasses\" width=\"1024\" height=\"575\" srcset=\"https:\/\/webdesignledger.com\/wp-content\/uploads\/2014\/05\/metaspaceglasses-1024x575.jpg 1024w, https:\/\/webdesignledger.com\/wp-content\/uploads\/2014\/05\/metaspaceglasses-300x168.jpg 300w, https:\/\/webdesignledger.com\/wp-content\/uploads\/2014\/05\/metaspaceglasses.jpg 1366w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/noscript><\/a><p id=\"caption-attachment-23252\" class=\"wp-caption-text\">Meta SpaceGlasses give you Ironman precision with a 3D Stereoscopic Display. SpaceGlasses.com<\/p><\/div>\n<h3>In Conclusion<\/h3>\n<p>Wearable technology is just beginning to take off. Be prepared with future-proof web designs that respond to this exciting new medium.<\/p>\n<p><em>What\u2019s your favorite wearable technology?<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Remember how wearing a calculator watch back in the day made you feel like George Jetson or his boy Elroy? Technology has come a long way from spelling out naughty words (upside down) on your calculator. These days, you can make calls, record videos, check your health, and buy coffee from your smartwatch&#8211;and that\u2019s just [&hellip;]<\/p>\n","protected":false},"author":201,"featured_media":23262,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3157],"tags":[],"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/webdesignledger.com\/wp-json\/wp\/v2\/posts\/23242"}],"collection":[{"href":"https:\/\/webdesignledger.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/webdesignledger.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/webdesignledger.com\/wp-json\/wp\/v2\/users\/201"}],"replies":[{"embeddable":true,"href":"https:\/\/webdesignledger.com\/wp-json\/wp\/v2\/comments?post=23242"}],"version-history":[{"count":0,"href":"https:\/\/webdesignledger.com\/wp-json\/wp\/v2\/posts\/23242\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/webdesignledger.com\/wp-json\/wp\/v2\/media\/23262"}],"wp:attachment":[{"href":"https:\/\/webdesignledger.com\/wp-json\/wp\/v2\/media?parent=23242"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/webdesignledger.com\/wp-json\/wp\/v2\/categories?post=23242"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/webdesignledger.com\/wp-json\/wp\/v2\/tags?post=23242"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}