{"id":52,"date":"2016-10-16T17:36:31","date_gmt":"2016-10-16T17:36:31","guid":{"rendered":"http:\/\/willvaughan.me\/blog\/2016\/10\/16\/20161016daily-ui-003\/"},"modified":"2018-02-11T06:14:34","modified_gmt":"2018-02-11T06:14:34","slug":"20161016daily-ui-003","status":"publish","type":"post","link":"http:\/\/willvaughan.me\/blog\/20161016daily-ui-003","title":{"rendered":"Daily UI #003"},"content":{"rendered":"<p>Over the past week I&#8217;ve started taking part in the <a href=\"http:\/\/www.dailyui.co\/\" target=\"_blank\" rel=\"noopener\">Daily UI design challenge <\/a>to showcase and improve on my design skills contained in the rest of my portfolio. Day 3 was a particularly fun challenge as it opened up the prompt to any landing page. I&#8217;ve never designed with video before, so I wanted to experiment with scenic imagery showcasing an elegant experience. I landed on the concept of creating a website for a helicopter tour company, mostly so I could use this beautiful footage.<\/p>\n<p><img decoding=\"async\" src=\"http:\/\/static1.squarespace.com\/static\/57b214cae3df28df0b8ee9ea\/57b215ae9f7456412999deb9\/5803ba6546c3c4d114d2bd05\/1476639359049\/Daily+UI+003.pngDaily+UI+003?format=original\" alt=\"\" \/><\/p>\n<p>The design came together pretty quickly on Sketch, but when I tried to prototype both the video and glass effect, a number of tools came up short. Unable to create the effect I wanted, I decided to take the opportunity to revisit some of my front-end skills that have gotten a bit rusty. You can see the result in the codepen below. Unfortunately the blurred glass effect is only compatible with Safari for now.<\/p>\n<p class=\"codepen\" data-height=\"700\" data-theme-id=\"0\" data-slug-hash=\"XjPpLX\" data-default-tab=\"result\" data-user=\"wvaughan\" data-embed-version=\"2\">See the Pen <a href=\"http:\/\/codepen.io\/wvaughan\/pen\/XjPpLX\/\">Daily UI #003<\/a> by Will Vaughan (<a href=\"http:\/\/codepen.io\/wvaughan\">@wvaughan<\/a>) on <a href=\"http:\/\/codepen.io\">CodePen<\/a>.<br \/>\n<script async src=\"\/\/assets.codepen.io\/assets\/embed\/ei.js\"><\/script><\/p>\n","protected":false},"excerpt":{"rendered":"<p><span style=\"font-size:12px\">Over the past week I&#8217;ve started taking part in the <\/span><a target=\"_blank\" href=\"http:\/\/www.dailyui.co\/\">Daily UI design challenge <\/a><span style=\"font-size:12px\">to showcase and improve on my design skills contained in the rest of my portfolio. Day 3 was a particularly fun challenge as it opened up the prompt to any landing page. I&#8217;ve never designed with video before, so I wanted to experiment with scenic imagery showcasing an elegant experience. I landed on the concept of creating a website for a helicopter tour company, mostly so I could use this beautiful footage.<\/span><\/p>\n","protected":false},"author":1,"featured_media":12,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-52","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-uncategorized"],"amp_enabled":true,"_links":{"self":[{"href":"http:\/\/willvaughan.me\/blog\/wp-json\/wp\/v2\/posts\/52","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/willvaughan.me\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/willvaughan.me\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/willvaughan.me\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/willvaughan.me\/blog\/wp-json\/wp\/v2\/comments?post=52"}],"version-history":[{"count":2,"href":"http:\/\/willvaughan.me\/blog\/wp-json\/wp\/v2\/posts\/52\/revisions"}],"predecessor-version":[{"id":172,"href":"http:\/\/willvaughan.me\/blog\/wp-json\/wp\/v2\/posts\/52\/revisions\/172"}],"wp:attachment":[{"href":"http:\/\/willvaughan.me\/blog\/wp-json\/wp\/v2\/media?parent=52"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/willvaughan.me\/blog\/wp-json\/wp\/v2\/categories?post=52"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/willvaughan.me\/blog\/wp-json\/wp\/v2\/tags?post=52"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}