{"id":374,"date":"2015-07-28T03:51:48","date_gmt":"2015-07-28T03:51:48","guid":{"rendered":"http:\/\/www.lindsaygensinger.com\/?p=374"},"modified":"2015-08-25T04:07:13","modified_gmt":"2015-08-25T04:07:13","slug":"energy-utilization","status":"publish","type":"post","link":"https:\/\/www.lindsaygensinger.com\/?p=374","title":{"rendered":"Energy Utilization"},"content":{"rendered":"<section class=\"stag-section stag-intro-text\"><p>A web application concept UI to visualize energy utilization data.<\/p>\n<\/section>\n<hr \/>\n<p>This concept uses a modular design and fits into an established design system and development architecture.<\/p>\n<blockquote><p>The\u00a0modular approach to UI design ensures responsiveness is more achievable in code and enables an ease of comprehension for users.<\/p><\/blockquote>\n<p>The UI is broken up into panels and inside each are one or more modules which hold the individual data visualizations. From there a user can drag-and-drop modules to create their own workspaces and experience. Each module can be scoped for data and datasets can be filtered, sorted, binned, and searched.<\/p>\n<p><em>Note: Company logos\/naming have been removed at the client&#8217;s request.<\/em><\/p>\n<div class=\"tiled-gallery type-rectangular tiled-gallery-unresized\" data-original-width=\"975\" data-carousel-extra='null' itemscope itemtype=\"http:\/\/schema.org\/ImageGallery\" > <div class=\"gallery-row\" style=\"width: 975px; height: 716px;\" data-original-width=\"975\" data-original-height=\"716\" > <div class=\"gallery-group images-2\" style=\"width: 570px; height: 716px;\" data-original-width=\"570\" data-original-height=\"716\" > <div class=\"tiled-gallery-item tiled-gallery-item-large\" itemprop=\"associatedMedia\" itemscope itemtype=\"http:\/\/schema.org\/ImageObject\"> <a href=\"https:\/\/i1.wp.com\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utilization-tiles-clean.jpg?ssl=1\" border=\"0\" itemprop=\"url\"> <meta itemprop=\"width\" content=\"566\"> <meta itemprop=\"height\" content=\"354\"> <img data-attachment-id=\"385\" data-orig-file=\"https:\/\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utilization-tiles-clean.jpg\" data-orig-size=\"2560,1600\" data-comments-opened=\"\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"utilization-tiles-clean\" data-image-description=\"\" data-medium-file=\"https:\/\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utilization-tiles-clean-300x188.jpg\" data-large-file=\"https:\/\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utilization-tiles-clean-1024x640.jpg\" src=\"https:\/\/i1.wp.com\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utilization-tiles-clean.jpg?w=566&#038;h=354&#038;ssl=1\" width=\"566\" height=\"354\" data-original-width=\"566\" data-original-height=\"354\" itemprop=\"http:\/\/schema.org\/image\" title=\"utilization-tiles-clean\" alt=\"Desktop: Tile view\" style=\"width: 566px; height: 354px;\" \/> <\/a> <div class=\"tiled-gallery-caption\" itemprop=\"caption description\"> Desktop: Tile view <\/div> <\/div> <div class=\"tiled-gallery-item tiled-gallery-item-large\" itemprop=\"associatedMedia\" itemscope itemtype=\"http:\/\/schema.org\/ImageObject\"> <a href=\"https:\/\/i2.wp.com\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utilization-map-search.jpg?ssl=1\" border=\"0\" itemprop=\"url\"> <meta itemprop=\"width\" content=\"566\"> <meta itemprop=\"height\" content=\"354\"> <img data-attachment-id=\"378\" data-orig-file=\"https:\/\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utilization-map-search.jpg\" data-orig-size=\"2560,1600\" data-comments-opened=\"\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"utilization-map-search\" data-image-description=\"\" data-medium-file=\"https:\/\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utilization-map-search-300x188.jpg\" data-large-file=\"https:\/\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utilization-map-search-1024x640.jpg\" src=\"https:\/\/i2.wp.com\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utilization-map-search.jpg?w=566&#038;h=354&#038;ssl=1\" width=\"566\" height=\"354\" data-original-width=\"566\" data-original-height=\"354\" itemprop=\"http:\/\/schema.org\/image\" title=\"utilization-map-search\" alt=\"Desktop: Map view where a user has searched in the far panel\" style=\"width: 566px; height: 354px;\" \/> <\/a> <div class=\"tiled-gallery-caption\" itemprop=\"caption description\"> Desktop: Map view where a user has searched in the far panel <\/div> <\/div> <\/div> <!-- close group --> <div class=\"gallery-group images-1\" style=\"width: 405px; height: 716px;\" data-original-width=\"405\" data-original-height=\"716\" > <div class=\"tiled-gallery-item tiled-gallery-item-large\" itemprop=\"associatedMedia\" itemscope itemtype=\"http:\/\/schema.org\/ImageObject\"> <a href=\"https:\/\/i1.wp.com\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utlization-mobile.jpg?ssl=1\" border=\"0\" itemprop=\"url\"> <meta itemprop=\"width\" content=\"401\"> <meta itemprop=\"height\" content=\"712\"> <img data-attachment-id=\"381\" data-orig-file=\"https:\/\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utlization-mobile.jpg\" data-orig-size=\"1080,1920\" data-comments-opened=\"\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"utlization-mobile\" data-image-description=\"\" data-medium-file=\"https:\/\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utlization-mobile-169x300.jpg\" data-large-file=\"https:\/\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utlization-mobile-576x1024.jpg\" src=\"https:\/\/i1.wp.com\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utlization-mobile.jpg?w=401&#038;h=712&#038;ssl=1\" width=\"401\" height=\"712\" data-original-width=\"401\" data-original-height=\"712\" itemprop=\"http:\/\/schema.org\/image\" title=\"utlization-mobile\" alt=\"Mobile: Welcome\/onboarding intro\" style=\"width: 401px; height: 712px;\" \/> <\/a> <div class=\"tiled-gallery-caption\" itemprop=\"caption description\"> Mobile: Welcome\/onboarding intro <\/div> <\/div> <\/div> <!-- close group --> <\/div> <!-- close row --> <div class=\"gallery-row\" style=\"width: 975px; height: 575px;\" data-original-width=\"975\" data-original-height=\"575\" > <div class=\"gallery-group images-1\" style=\"width: 325px; height: 575px;\" data-original-width=\"325\" data-original-height=\"575\" > <div class=\"tiled-gallery-item tiled-gallery-item-large\" itemprop=\"associatedMedia\" itemscope itemtype=\"http:\/\/schema.org\/ImageObject\"> <a href=\"https:\/\/i2.wp.com\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utlization-mobile2.jpg?ssl=1\" border=\"0\" itemprop=\"url\"> <meta itemprop=\"width\" content=\"321\"> <meta itemprop=\"height\" content=\"571\"> <img data-attachment-id=\"382\" data-orig-file=\"https:\/\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utlization-mobile2.jpg\" data-orig-size=\"1080,1920\" data-comments-opened=\"\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"utlization-mobile2\" data-image-description=\"\" data-medium-file=\"https:\/\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utlization-mobile2-169x300.jpg\" data-large-file=\"https:\/\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utlization-mobile2-576x1024.jpg\" src=\"https:\/\/i2.wp.com\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utlization-mobile2.jpg?w=321&#038;h=571&#038;ssl=1\" width=\"321\" height=\"571\" data-original-width=\"321\" data-original-height=\"571\" itemprop=\"http:\/\/schema.org\/image\" title=\"utlization-mobile2\" alt=\"Mobile: Tile view\" style=\"width: 321px; height: 571px;\" \/> <\/a> <div class=\"tiled-gallery-caption\" itemprop=\"caption description\"> Mobile: Tile view <\/div> <\/div> <\/div> <!-- close group --> <div class=\"gallery-group images-1\" style=\"width: 325px; height: 575px;\" data-original-width=\"325\" data-original-height=\"575\" > <div class=\"tiled-gallery-item tiled-gallery-item-large\" itemprop=\"associatedMedia\" itemscope itemtype=\"http:\/\/schema.org\/ImageObject\"> <a href=\"https:\/\/i0.wp.com\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utlization-mobile3.jpg?ssl=1\" border=\"0\" itemprop=\"url\"> <meta itemprop=\"width\" content=\"321\"> <meta itemprop=\"height\" content=\"571\"> <img data-attachment-id=\"383\" data-orig-file=\"https:\/\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utlization-mobile3.jpg\" data-orig-size=\"1080,1920\" data-comments-opened=\"\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"utlization-mobile3\" data-image-description=\"\" data-medium-file=\"https:\/\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utlization-mobile3-169x300.jpg\" data-large-file=\"https:\/\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utlization-mobile3-576x1024.jpg\" src=\"https:\/\/i0.wp.com\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utlization-mobile3.jpg?w=321&#038;h=571&#038;ssl=1\" width=\"321\" height=\"571\" data-original-width=\"321\" data-original-height=\"571\" itemprop=\"http:\/\/schema.org\/image\" title=\"utlization-mobile3\" alt=\"Mobile: Tile view when swiped\" style=\"width: 321px; height: 571px;\" \/> <\/a> <div class=\"tiled-gallery-caption\" itemprop=\"caption description\"> Mobile: Tile view when swiped <\/div> <\/div> <\/div> <!-- close group --> <div class=\"gallery-group images-1\" style=\"width: 325px; height: 575px;\" data-original-width=\"325\" data-original-height=\"575\" > <div class=\"tiled-gallery-item tiled-gallery-item-large\" itemprop=\"associatedMedia\" itemscope itemtype=\"http:\/\/schema.org\/ImageObject\"> <a href=\"https:\/\/i1.wp.com\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utlization-mobile4.jpg?ssl=1\" border=\"0\" itemprop=\"url\"> <meta itemprop=\"width\" content=\"321\"> <meta itemprop=\"height\" content=\"571\"> <img data-attachment-id=\"384\" data-orig-file=\"https:\/\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utlization-mobile4.jpg\" data-orig-size=\"1080,1920\" data-comments-opened=\"\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"utlization-mobile4\" data-image-description=\"\" data-medium-file=\"https:\/\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utlization-mobile4-169x300.jpg\" data-large-file=\"https:\/\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utlization-mobile4-576x1024.jpg\" src=\"https:\/\/i1.wp.com\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/utlization-mobile4.jpg?w=321&#038;h=571&#038;ssl=1\" width=\"321\" height=\"571\" data-original-width=\"321\" data-original-height=\"571\" itemprop=\"http:\/\/schema.org\/image\" title=\"utlization-mobile4\" alt=\"Mobile: Map view\" style=\"width: 321px; height: 571px;\" \/> <\/a> <div class=\"tiled-gallery-caption\" itemprop=\"caption description\"> Mobile: Map view <\/div> <\/div> <\/div> <!-- close group --> <\/div> <!-- close row --> <\/div>\n","protected":false},"excerpt":{"rendered":"<p>This concept uses a modular design and fits into an established design system and development architecture. The\u00a0modular approach to UI design ensures responsiveness is more&hellip;<\/p>\n","protected":false},"author":1,"featured_media":376,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"spay_email":"","jetpack_publicize_message":"","jetpack_is_tweetstorm":false},"categories":[21,5,13,14],"tags":[16,9,22,15,17],"jetpack_featured_media_url":"https:\/\/www.lindsaygensinger.com\/wp-content\/uploads\/2015\/08\/util-cover.jpg","jetpack_publicize_connections":[],"jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p5x4IE-62","_links":{"self":[{"href":"https:\/\/www.lindsaygensinger.com\/index.php?rest_route=\/wp\/v2\/posts\/374"}],"collection":[{"href":"https:\/\/www.lindsaygensinger.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.lindsaygensinger.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.lindsaygensinger.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.lindsaygensinger.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=374"}],"version-history":[{"count":4,"href":"https:\/\/www.lindsaygensinger.com\/index.php?rest_route=\/wp\/v2\/posts\/374\/revisions"}],"predecessor-version":[{"id":388,"href":"https:\/\/www.lindsaygensinger.com\/index.php?rest_route=\/wp\/v2\/posts\/374\/revisions\/388"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.lindsaygensinger.com\/index.php?rest_route=\/wp\/v2\/media\/376"}],"wp:attachment":[{"href":"https:\/\/www.lindsaygensinger.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=374"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.lindsaygensinger.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=374"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.lindsaygensinger.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=374"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}