Kult House - Selected work of Josh Rhode
<script type="text/javascript" src="http://kulthouse.com/code/swfobject.js"></script>
<div class="cargo_link"><a href="http://cargocollective.com/kult#15086/kult-House">About</a> | <a href="mailto:kulthouse@gmail.com">E-Mail</a> </div> <script type='text/javascript'>
$(document).ready(function() { startSlideshow(15429); });
</script>
<div class="header_img" ><a href="http://cargocollective.com/kult" onfocus="this.blur()"><img src="http://payload.cargocollective.com/1/0/2047/headerimg/header.jpg" height="410" width="905"></a></div><img src="_gfx/loadingAnim.gif" id="nav_loadspin"><div class="nav_container horizontal"></div></div><div id="toolset" class="toolset" style="display:none;"><div id="toolset_follow"><a href="kult/following"></a></div></div><div id="content_container" class="bodycopy permalink_page">
<div id="item_15429"><div class="entry" id="entry_15429"><div class="project_content"><div id="flashcontent">Please install flash</div><br />
<script type="text/javascript"><br />
var flashvars = {tTitle:"Nike 77 Burnside", tType:"Interactive Commerce", tCopy:"77Burnside is the Members Only facet of Nike Store, named after the brand's original headquarters address. I art directed, designed, and motion-prototyped the entire experience. The experience was made to be as modular as possible: after launching, it would not be touched by any designers, and had to be easily updated by Nike content managers. "};<br />
var params = { scale: "noScale", wmode:"transparent" };<br />
var attributes = {};<br />
swfobject.embedSWF("http://kulthouse.com/code/kheader.swf", "flashcontent", "905px", "170px", "7", false, flashvars, params, attributes);<br />
</script><br />
<img src="http://payload.cargocollective.com/1/0/2047/15429/1_905.jpg" border="0" width="905" height="966" width_o="905" height_o="966" align="left" /> <img src="http://payload.cargocollective.com/1/0/2047/15429/2_905.jpg" border="0" width="905" height="905" width_o="905" height_o="905" align="left" /> <img src="http://payload.cargocollective.com/1/0/2047/15429/4_905.jpg" border="0" width="905" height="904" width_o="910" height_o="910" align="left" /> <img src="http://payload.cargocollective.com/1/0/2047/15429/5_905.jpg" border="0" width="905" height="904" width_o="910" height_o="910" align="left" /> <br />
<br />
<table class="table_piece"><br />
<tr><br />
<td valign="top" class="table_images"><br />
<div class="slideshow_component"><div class='slideshow_nav_15429 slideshow_nav above' id='slideshow_nav'><a id='prev' class='slide_prev_15429 slide_prev' href='#' onfocus='this.blur()'>Previous</a> <span class="slide_slash">/</span> <a id='next' class='slide_next_15429 slide_next' href='#' onfocus='this.blur()'>Next image</a> <span class='slideshow_count_15429' id='slideshow_count'>(1 of 15)</span></div><div class="slideshow_wrapper_15429 slideshow_wrapper"><a href='#' id='slideclick_15429' class='slideclick_15429' onfocus='this.blur()'><div class='slideshow_container_15429' id='slideshow_container'><img src="http://payload.cargocollective.com/1/0/2047/15429/front.jpg" border="0" width="670" height="715" width_o="670" height_o="715" align="left" /> <img src="http://payload.cargocollective.com/1/0/2047/15429/1_blank.jpg" border="0" width="670" height="670" width_o="670" height_o="670" align="left" /> <img src="http://payload.cargocollective.com/1/0/2047/15429/2_slidein.jpg" border="0" width="670" height="670" width_o="670" height_o="670" align="left" /> <img src="http://payload.cargocollective.com/1/0/2047/15429/3_loading.jpg" border="0" width="670" height="670" width_o="670" height_o="670" align="left" /> <img src="http://payload.cargocollective.com/1/0/2047/15429/4_exitloader.jpg" border="0" width="670" height="670" width_o="670" height_o="670" align="left" /> <img src="http://payload.cargocollective.com/1/0/2047/15429/5_featureloading.jpg" border="0" width="670" height="670" width_o="670" height_o="670" align="left" /> <img src="http://payload.cargocollective.com/1/0/2047/15429/6_featurealmost.jpg" border="0" width="670" height="670" width_o="670" height_o="670" align="left" /> <img src="http://payload.cargocollective.com/1/0/2047/15429/7_loaded.jpg" border="0" width="670" height="670" width_o="670" height_o="670" align="left" /> <img src="http://payload.cargocollective.com/1/0/2047/15429/8_rollover.jpg" border="0" width="670" height="670" width_o="670" height_o="670" align="left" /> <img src="http://payload.cargocollective.com/1/0/2047/15429/9_transitout1.jpg" border="0" width="670" height="670" width_o="670" height_o="670" align="left" /> <img src="http://payload.cargocollective.com/1/0/2047/15429/10_transitout2.jpg" border="0" width="670" height="670" width_o="670" height_o="670" align="left" /> <img src="http://payload.cargocollective.com/1/0/2047/15429/11_collect_in.jpg" border="0" width="670" height="670" width_o="670" height_o="670" align="left" /> <img src="http://payload.cargocollective.com/1/0/2047/15429/12_collect_almost.jpg" border="0" width="670" height="670" width_o="670" height_o="670" align="left" /> <img src="http://payload.cargocollective.com/1/0/2047/15429/13_entering.jpg" border="0" width="670" height="670" width_o="670" height_o="670" align="left" /> <img src="http://payload.cargocollective.com/1/0/2047/15429/14_collect_interact.jpg" border="0" width="670" height="670" width_o="670" height_o="670" align="left" /> </div></a></div></div><br />
</td><br />
<td valign="top" class="table_info"><br />
<span class="project_title">Behind the scenes</span><br />
The experience utilizes an appropriate 7x7 grid that expands and morphs dynamically to the content. However, due to technical constraints with the e-commerce framework, much of the original animation tests and transitions had to be scaled back in the development phase.<br />
<br />
Produced at R/GA.<br />
</td></tr></table><slideconfig transition="fade" is_autoplay="no" auto_delay="2" has_textnav="yes" text_prev="Previous" text_slash="/" text_next="Next image" has_count="yes" count_style="parenth" nav_position="top" has_thumbs="no" thumb_position="bottom" ></slideconfig></div></div></div></div>
<div class="bottompad"> </div>
<div id="foot_container"><input type="hidden" id="current_open" value="none"><input type="hidden" id="prev_open" value="none"><input type="hidden" id="prev_type" value="project_link"><input type="hidden" id="this_spot" value="-1"><input type="hidden" id="is_domain" value="false"><input type="hidden" id="url" value="kult"><input type="hidden" id="current_page" value=""><input type="hidden" id="total_pages" value=""><input type="hidden" id="limit" value="50"><input type="hidden" id="viewtype" value="list"><input type="hidden" id="previewtemplate" value="false"><input type="hidden" id="template" value="escher"><input type="hidden" id="design" value="counterform-bynight"><input type="hidden" id="templatepath" value="designs/escher"><input type="hidden" id="designpath" value="designs/escher/counterform-bynight"><input type="hidden" id="sticky_page" value="top"><input type="hidden" id="o_thumb_nav" value="no"><script language="javascript"> var pid_list = new Array(""); var pr_list = new Array(""); var prt_list = new Array(""); </script> <div class="bottompad"> </div></div> <script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-1837333-7']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</body>
</html>