{"id":1283,"date":"2005-07-14T15:22:00","date_gmt":"2005-07-14T15:22:00","guid":{"rendered":"https:\/\/lemelwilliams.com\/?p=1283"},"modified":"2022-09-12T21:21:24","modified_gmt":"2022-09-12T21:21:24","slug":"block-pattern-test","status":"publish","type":"post","link":"https:\/\/lemelwilliams.com\/?p=1283","title":{"rendered":"Pizza Talk Set Explorer"},"content":{"rendered":"\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-28f84493 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:80%\"><figure style=\"margin-bottom:2rem;\" class=\"wp-block-post-featured-image\"><img loading=\"lazy\" decoding=\"async\" width=\"766\" height=\"485\" src=\"https:\/\/lemelwilliams.com\/wp-content\/uploads\/2022\/07\/1.jpg\" class=\"attachment-post-thumbnail size-post-thumbnail wp-post-image\" alt=\"\" style=\"object-fit:cover;\" srcset=\"https:\/\/lemelwilliams.com\/wp-content\/uploads\/2022\/07\/1.jpg 766w, https:\/\/lemelwilliams.com\/wp-content\/uploads\/2022\/07\/1-300x190.jpg 300w\" sizes=\"auto, (max-width: 766px) 100vw, 766px\" \/><\/figure>\n\n\n<figure class=\"wp-block-image alignright size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/lemelwilliams.com\/wp-content\/uploads\/2022\/08\/2.jpg\" alt=\"\" class=\"wp-image-1454\" width=\"222\" height=\"138\"\/><figcaption class=\"wp-element-caption\">A humorous backstory was written for every object on the set, consistent with the character&#8217;s personality. <\/figcaption><\/figure>\n\n\n\n<p><span class=\"brief-callout\">brief<\/span>  Create an interactive web feature that would tie in to the launch of a new media campaign in which the company spokesperson would be fielding guest in a talk show-type setting.<\/p>\n\n\n\n<p>In 2002 this was very cutting edge stuff! I built a multi-plane parallax panning engine<sup>1<\/sup> in Flash ActionScript <span class=\"aside\">1) This was several years ahead of the web&#8217;s parallax scrolling effect trend.<\/span>to allow interactive exploration of a flat photo. I was able to create a relevant online tie-in to the television campaign in a few days, working only from a few static screen grabs.<\/p>\n\n\n\n<p>Provided with very little time and no raw material from the commercial shoot (and no permission to use video footage online) I took screen grabs from the finished commercials and isolated elements in Photoshop. These clipped elements were then brought into Flash, where I built a simple multi-plane parallax panning engine. <\/p>\n\n\n\n<p>For each prop on the richly-decorated set, I developed a humorous backstory (titles and descriptions for each book on the shelves, origins various of items, etc.). I then further built the display engine to allow visitors to pan around, zoom in, mouse over and explore every item on the set.<\/p>\n\n\n\n<div class=\"wp-block-cb-carousel cb-single-slide\" data-slick=\"{&quot;slidesToShow&quot;:1,&quot;slidesToScroll&quot;:1,&quot;speed&quot;:300,&quot;arrows&quot;:true,&quot;dots&quot;:true,&quot;autoplay&quot;:false,&quot;autoplaySpeed&quot;:3000,&quot;infinite&quot;:false,&quot;responsive&quot;:[{&quot;breakpoint&quot;:501,&quot;settings&quot;:{&quot;slidesToShow&quot;:1,&quot;slidesToScroll&quot;:1}}]}\">\n<div class=\"wp-block-cb-slide\">\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"766\" height=\"485\" src=\"https:\/\/lemelwilliams.com\/wp-content\/uploads\/2022\/07\/1.jpg\" alt=\"\" class=\"wp-image-1029\" srcset=\"https:\/\/lemelwilliams.com\/wp-content\/uploads\/2022\/07\/1.jpg 766w, https:\/\/lemelwilliams.com\/wp-content\/uploads\/2022\/07\/1-300x190.jpg 300w\" sizes=\"auto, (max-width: 766px) 100vw, 766px\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-cb-slide\">\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"766\" height=\"485\" src=\"https:\/\/lemelwilliams.com\/wp-content\/uploads\/2022\/08\/2.jpg\" alt=\"\" class=\"wp-image-1454\" srcset=\"https:\/\/lemelwilliams.com\/wp-content\/uploads\/2022\/08\/2.jpg 766w, https:\/\/lemelwilliams.com\/wp-content\/uploads\/2022\/08\/2-300x190.jpg 300w\" sizes=\"auto, (max-width: 766px) 100vw, 766px\" \/><\/figure>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column site-post-marginalnotes has-global-padding is-layout-constrained wp-block-column-is-layout-constrained\" style=\"flex-basis:20%\"><\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Interactive TV Campaign Tie-in<\/p>\n","protected":false},"author":1,"featured_media":1029,"comment_status":"closed","ping_status":"open","sticky":false,"template":"wp-custom-template-case-study","format":"standard","meta":{"footnotes":""},"categories":[14],"tags":[38,51],"class_list":["post-1283","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-work","tag-interactive","tag-round-table-pizza"],"_links":{"self":[{"href":"https:\/\/lemelwilliams.com\/index.php?rest_route=\/wp\/v2\/posts\/1283","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/lemelwilliams.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/lemelwilliams.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/lemelwilliams.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/lemelwilliams.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1283"}],"version-history":[{"count":13,"href":"https:\/\/lemelwilliams.com\/index.php?rest_route=\/wp\/v2\/posts\/1283\/revisions"}],"predecessor-version":[{"id":1489,"href":"https:\/\/lemelwilliams.com\/index.php?rest_route=\/wp\/v2\/posts\/1283\/revisions\/1489"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/lemelwilliams.com\/index.php?rest_route=\/wp\/v2\/media\/1029"}],"wp:attachment":[{"href":"https:\/\/lemelwilliams.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1283"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/lemelwilliams.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1283"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/lemelwilliams.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1283"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}