Second Story Clothesline

Second Story Clothesline http://blog.secondstory.com Curiosity fuels our projects, and our projects propel the imagination. Along the way we seek inspiration, we research and learn, we push and innovate. Here we hang out our creative laundry posterous.com Tue, 22 May 2012 12:49:21 -0700 Launching Satellite http://feedproxy.google.com/~r/secondstory/~3/b6uTRzPPjjI/launching-satellite http://blog.secondstory.com/launching-satellite <p> <p><iframe src="http://player.vimeo.com/video/42312417?portrait=0" frameborder="0" height="283" width="500"></iframe></p> <p>The typical interactive surface does very little to engage our very fine touch senses. Our fingers reach out and find smooth glass, rather than objects. Finding new ways to integrate tangible interaction into digital experiences has long been a goal of Second Story’s. </p> <p>While brainstorming ideas for a new collaborative table interactive experience we hit on the idea of using Sifteo cubes in tandem with Microsoft Surface. The Sifteo cubes are both tactile and interactive as well as aware of their position in space: you can shake them, tilt them, rotate them. The Surface is a multitouch table that can "see" what’s touching it. </p> <p>The opportunity to combine these capabilities into one experience was too intriguing to pass up.</p> <p>While the technical challenge was to combine the two different technologies, there was also the user experience challenge: What type of experience would suit the interaction between these small, peripheral devices and a multitouch table?</p> <p><div class='p_embed p_image_embed'> <a href="http://getfile1.posterous.com/getfile/files.posterous.com/temp-2012-05-22/EJfdEiedsgJJtfqjoqDvptfIGEHGfBwcneuAmtpIdEcbyrpsAvIdFEuuEBzi/diagram.jpg.scaled1000.jpg"><img alt="Diagram" height="273" src="http://getfile2.posterous.com/getfile/files.posterous.com/temp-2012-05-22/EJfdEiedsgJJtfqjoqDvptfIGEHGfBwcneuAmtpIdEcbyrpsAvIdFEuuEBzi/diagram.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile0.posterous.com/getfile/files.posterous.com/temp-2012-05-22/jqodpwtvzedAAkrAhpfqiIjbacEzrHBsyxjnBhgdFvubcixnlwnxIibiowgD/sketch.jpg.scaled1000.jpg"><img alt="Sketch" height="456" src="http://getfile4.posterous.com/getfile/files.posterous.com/temp-2012-05-22/jqodpwtvzedAAkrAhpfqiIjbacEzrHBsyxjnBhgdFvubcixnlwnxIibiowgD/sketch.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile5.posterous.com/getfile/files.posterous.com/temp-2012-05-22/ABnyEAklklabsfFAnwpinnjeGeJtvAumcblhkxsgpxHgdbiiraJJhzfIHrJE/IMG_8627.jpg.scaled1000.jpg"><img alt="Img_8627" height="281" src="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2012-05-22/ABnyEAklklabsfFAnwpinnjeGeJtvAumcblhkxsgpxHgdbiiraJJhzfIHrJE/IMG_8627.jpg.scaled500.jpg" width="500" /></a> <div class='p_see_full_gallery'><a href="http://blog.secondstory.com/launching-satellite">See the full gallery on Posterous</a></div> </div> </p> <p> </p> <p>The answer evolved into Satellite, a collaborative musical table that link these intriguing new technologies: users play with the Sifteo cubes, turning them into "satellites" that communicate with the main unit.</p> <p>The experience is fun, fluid, and creative: A planet is surrounded by four orbits, each of which represents a musical track. Placing a cube on an orbit claims the track. When the player presses the cube’s screen, a note appears. Tilting the cube in different directions changes the pitch of the note. The music evolves over time, forming an ephemeral, ambient composition that varies from polyrhythm to soothing melody, as the playhead sweeps across.</p> <p>We’re fascinated with the potential of meshing digital interfaces with hybrid digital/tangible objects. The implications of groups using objects to interact with tables and each other are very exciting. While Satellite is a music-making experience, it’s just one in a galaxy of possible applications we look forward to exploring.</p> </p> <p><a href="http://blog.secondstory.com/launching-satellite">Permalink</a> </p><img src="http://feeds.feedburner.com/~r/secondstory/~4/b6uTRzPPjjI" height="1" width="1"/> http://files.posterous.com/user_profile_pics/762745/2storypdx.png http://posterous.com/users/5Al0rmDXf2UN Second Story Second Story Second Story http://blog.secondstory.com/launching-satellite Mon, 21 May 2012 13:01:00 -0700 Tracking Faces http://feedproxy.google.com/~r/secondstory/~3/66QdBFC-MlU/tracking-faces http://blog.secondstory.com/tracking-faces <p> <p><a href="https://vimeo.com/42567736"><iframe src="http://player.vimeo.com/video/42567736?portrait=0" frameborder="0" height="283" width="500"></iframe></a></p> <p>Second Story Labs has created a unique user experience by combining the new head tracking capabilities recently added to Microsoft Kinect’s arsenal of features, with a transparent EL screen from Planar. As people approach the camera, the depth-sensing device passively tracks their faces and provides a computer with the 3d position and orientation of the user's head. We combined this information with openGL code and the electroluminescent display from Planar to create a type of holographic 3D display. <p /> By carefully calibrating the display and camera, we can make it appear as though a 3d model is floating behind the screen (as seen in this experiment) or just as easily augment an actual item located behind the screen with layers of information and graphics. This experience only works for one user at a time, but the effect is captivating and holds exciting potential for future transparent display installations.</p> <p>—Matt Arnold, <em>Lead Integration Engineer</em></p> </p> <p><a href="http://blog.secondstory.com/tracking-faces">Permalink</a> </p><img src="http://feeds.feedburner.com/~r/secondstory/~4/66QdBFC-MlU" height="1" width="1"/> http://files.posterous.com/user_profile_pics/762745/2storypdx.png http://posterous.com/users/5Al0rmDXf2UN Second Story Second Story Second Story http://blog.secondstory.com/tracking-faces Tue, 15 May 2012 12:09:00 -0700 In-Depth Storytelling http://feedproxy.google.com/~r/secondstory/~3/C6DvBLhvmr8/in-depth-storytelling http://blog.secondstory.com/in-depth-storytelling <p> <p><iframe src="http://player.vimeo.com/video/42218144?portrait=0" frameborder="0" height="283" width="500"></iframe></p> <p>Here in the Second Story Lab, we research new and emerging technologies that have the potential to enhance user experiences. As part of this ongoing quest, we are always on the lookout for new ways of sensing people in spaces. When we saw the depth-sensing camera at the Emerging Technologies exhibit area of Siggraph in 2008, we were intrigued by the possibilities. It would be several more years before the technology matured and was made available to us in the many forms we see today.</p> <p>The advent of the depth-sensing camera has enabled us to sense people in new and innovative ways. As this technology has evolved over the last two years, we’ve been experimenting with and incorporating it into exhibit spaces. Through the use of these simple cameras, we have introduced new ways in which people can interact with media and vice versa. This video explores some of the applications and innovations we’ve developed in the world of depth-sensing technology. As we look forward to the next evolution in this emerging field, we are excited as ever about the possibilities it opens for interactive storytelling.</p> <p>—Matt Arnold, <em>Lead Integration Engineer</em> </p> <p> </p> </p> <p><a href="http://blog.secondstory.com/in-depth-storytelling">Permalink</a> </p><img src="http://feeds.feedburner.com/~r/secondstory/~4/C6DvBLhvmr8" height="1" width="1"/> http://files.posterous.com/user_profile_pics/762745/2storypdx.png http://posterous.com/users/5Al0rmDXf2UN Second Story Second Story Second Story http://blog.secondstory.com/in-depth-storytelling Mon, 07 May 2012 17:52:00 -0700 Dream of the 90s Is Alive... http://feedproxy.google.com/~r/secondstory/~3/JwRyJKUz-Bc/dream-of-the-90s-is-alive http://blog.secondstory.com/dream-of-the-90s-is-alive <p> <p><div class='p_embed p_image_embed'> <a href="http://getfile2.posterous.com/getfile/files.posterous.com/temp-2012-05-07/CmBJFAhFGzcBlwCoEowwtHAoaFuvwzvyApqbfwcqwwraDndktbJFvFnxgmua/IMG_6052.JPG.scaled1000.jpg"><img alt="Img_6052" height="333" src="http://getfile7.posterous.com/getfile/files.posterous.com/temp-2012-05-07/CmBJFAhFGzcBlwCoEowwtHAoaFuvwzvyApqbfwcqwwraDndktbJFvFnxgmua/IMG_6052.JPG.scaled500.jpg" width="500" /></a> <a href="http://getfile8.posterous.com/getfile/files.posterous.com/temp-2012-05-07/sHrlynEjqrBbjmhvoDfGycyCypafJfwljDHppbdhGqaDgwpJJGGkGAmxakkp/IMG_5857.JPG.scaled1000.jpg"><img alt="Img_5857" height="333" src="http://getfile3.posterous.com/getfile/files.posterous.com/temp-2012-05-07/sHrlynEjqrBbjmhvoDfGycyCypafJfwljDHppbdhGqaDgwpJJGGkGAmxakkp/IMG_5857.JPG.scaled500.jpg" width="500" /></a> <a href="http://getfile0.posterous.com/getfile/files.posterous.com/temp-2012-05-07/mfptGokhCzltIDgrsenzfesckyktvAxkAFtAJDlnaEFHpzqpdldBcjxjiAmG/IMG_5950.JPG.scaled1000.jpg"><img alt="Img_5950" height="333" src="http://getfile8.posterous.com/getfile/files.posterous.com/temp-2012-05-07/mfptGokhCzltIDgrsenzfesckyktvAxkAFtAJDlnaEFHpzqpdldBcjxjiAmG/IMG_5950.JPG.scaled500.jpg" width="500" /></a> <a href="http://getfile3.posterous.com/getfile/files.posterous.com/temp-2012-05-07/bxjDxAArftuCiibiGmxwtzwDgqEHlxAbrrhrgthGntgDoiyIcCepJEFyHwcF/IMG_6001.JPG.scaled1000.jpg"><img alt="Img_6001" height="333" src="http://getfile6.posterous.com/getfile/files.posterous.com/temp-2012-05-07/bxjDxAArftuCiibiGmxwtzwDgqEHlxAbrrhrgthGntgDoiyIcCepJEFyHwcF/IMG_6001.JPG.scaled500.jpg" width="500" /></a> <a href="http://getfile6.posterous.com/getfile/files.posterous.com/temp-2012-05-07/GCoBptoajIogFbbnhoEsihmegzmgFqrGpyreszJFglDeafwgmftsuvuoqlzf/IMG_5786.JPG.scaled1000.jpg"><img alt="Img_5786" height="333" src="http://getfile2.posterous.com/getfile/files.posterous.com/temp-2012-05-07/GCoBptoajIogFbbnhoEsihmegzmgFqrGpyreszJFglDeafwgmftsuvuoqlzf/IMG_5786.JPG.scaled500.jpg" width="500" /></a> <a href="http://getfile2.posterous.com/getfile/files.posterous.com/temp-2012-05-07/GjvczDhtICHmvbvEntrjwljxhbCHmiHtEfdfJAidJfmfiheyoBlsFxIifouF/IMG_5792.JPG.scaled1000.jpg"><img alt="Img_5792" height="333" src="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2012-05-07/GjvczDhtICHmvbvEntrjwljxhbCHmiHtEfdfJAidJfmfiheyoBlsFxIifouF/IMG_5792.JPG.scaled500.jpg" width="500" /></a> <a href="http://getfile7.posterous.com/getfile/files.posterous.com/temp-2012-05-07/FEjibhkDEzbHFnxAewGhxxbiJIrndukmopAcBrwuuDwvEkmadtAsjCykapdI/IMG_5829.JPG.scaled1000.jpg"><img alt="Img_5829" height="333" src="http://getfile1.posterous.com/getfile/files.posterous.com/temp-2012-05-07/FEjibhkDEzbHFnxAewGhxxbiJIrndukmopAcBrwuuDwvEkmadtAsjCykapdI/IMG_5829.JPG.scaled500.jpg" width="500" /></a> <a href="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2012-05-07/AphAxtlHguyHvahhBDmggHJqccnIcyHiqhnamoxhBsjrIHEhpJCwfJokyrcc/IMG_5836.JPG.scaled1000.jpg"><img alt="Img_5836" height="333" src="http://getfile4.posterous.com/getfile/files.posterous.com/temp-2012-05-07/AphAxtlHguyHvahhBDmggHJqccnIcyHiqhnamoxhBsjrIHEhpJCwfJokyrcc/IMG_5836.JPG.scaled500.jpg" width="500" /></a> <a href="http://getfile4.posterous.com/getfile/files.posterous.com/temp-2012-05-07/AverwikDBEAIqIxcEcfsizyybFjxsDDEvtftIdgfemgIlBmijByjrBIsnopw/IMG_6056.JPG.scaled1000.jpg"><img alt="Img_6056" height="333" src="http://getfile5.posterous.com/getfile/files.posterous.com/temp-2012-05-07/AverwikDBEAIqIxcEcfsizyybFjxsDDEvtftIdgfemgIlBmijByjrBIsnopw/IMG_6056.JPG.scaled500.jpg" width="500" /></a> <a href="http://getfile1.posterous.com/getfile/files.posterous.com/temp-2012-05-07/iDqkGxoAfFEzxifroxEyGifDdwmhAGiHtJAsDdHyGHzoIzvgukrCfkbxocCC/IMG_5924.JPG.scaled1000.jpg"><img alt="Img_5924" height="333" src="http://getfile6.posterous.com/getfile/files.posterous.com/temp-2012-05-07/iDqkGxoAfFEzxifroxEyGifDdwmhAGiHtJAsDdHyGHzoIzvgukrCfkbxocCC/IMG_5924.JPG.scaled500.jpg" width="500" /></a> <a href="http://getfile1.posterous.com/getfile/files.posterous.com/temp-2012-05-07/afczJjwHloggJzCJnJokupAFJbqEAtfvGygdAxxnosBwuwEeocwdIAgdzHek/IMG_5938.JPG.scaled1000.jpg"><img alt="Img_5938" height="333" src="http://getfile5.posterous.com/getfile/files.posterous.com/temp-2012-05-07/afczJjwHloggJzCJnJokupAFJbqEAtfvGygdAxxnosBwuwEeocwdIAgdzHek/IMG_5938.JPG.scaled500.jpg" width="500" /></a> <a href="http://getfile3.posterous.com/getfile/files.posterous.com/temp-2012-05-07/ldiAABstmkmbgIBemGoFECslfCDhkymEjpkknoeftyuaFkGkwdcoidofwlEE/IMG_5959.JPG.scaled1000.jpg"><img alt="Img_5959" height="333" src="http://getfile8.posterous.com/getfile/files.posterous.com/temp-2012-05-07/ldiAABstmkmbgIBemGoFECslfCDhkymEjpkknoeftyuaFkGkwdcoidofwlEE/IMG_5959.JPG.scaled500.jpg" width="500" /></a> <a href="http://getfile6.posterous.com/getfile/files.posterous.com/temp-2012-05-07/iaDdhbdgHkeacEICrJqyacpicIszDikkrqsgsksCasshxoxmltFbFIyzapEw/IMG_5961.JPG.scaled1000.jpg"><img alt="Img_5961" height="333" src="http://getfile2.posterous.com/getfile/files.posterous.com/temp-2012-05-07/iaDdhbdgHkeacEICrJqyacpicIszDikkrqsgsksCasshxoxmltFbFIyzapEw/IMG_5961.JPG.scaled500.jpg" width="500" /></a> <a href="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2012-05-07/IknHhDjDsmajlgiHcDjsnhhnqbylCyBgrfaofEyanIBspfJhyeDlwtBIfqDv/IMG_5969.JPG.scaled1000.jpg"><img alt="Img_5969" height="333" src="http://getfile4.posterous.com/getfile/files.posterous.com/temp-2012-05-07/IknHhDjDsmajlgiHcDjsnhhnqbylCyBgrfaofEyanIBspfJhyeDlwtBIfqDv/IMG_5969.JPG.scaled500.jpg" width="500" /></a> <a href="http://getfile4.posterous.com/getfile/files.posterous.com/temp-2012-05-07/ewfCkfapIBGGochGaDpBbIbzuuHtfieryreIEGybtaIeynHsaFzddlhgxams/IMG_5974.JPG.scaled1000.jpg"><img alt="Img_5974" height="333" src="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2012-05-07/ewfCkfapIBGGochGaDpBbIbzuuHtfieryreIEGybtaIeynHsaFzddlhgxams/IMG_5974.JPG.scaled500.jpg" width="500" /></a> <a href="http://getfile6.posterous.com/getfile/files.posterous.com/temp-2012-05-07/dxiIoBjlhqsymIclxiaFsvrDkdbiaEHGxDGaveIGgurslarxoikyazfJfrmi/IMG_6021.JPG.scaled1000.jpg"><img alt="Img_6021" height="333" src="http://getfile1.posterous.com/getfile/files.posterous.com/temp-2012-05-07/dxiIoBjlhqsymIclxiaFsvrDkdbiaEHGxDGaveIGgurslarxoikyazfJfrmi/IMG_6021.JPG.scaled500.jpg" width="500" /></a> <div class='p_see_full_gallery'><a href="http://blog.secondstory.com/dream-of-the-90s-is-alive">See the full gallery on Posterous</a></div> </div> Last summer, the crew from Portlandia descended upon Second Story and turned our workplace into a television set. Our guest appearance finally aired in March in an episode called <a href="http://www.ifc.com/shows/portlandia/episodes/season-2/no-olympics">No Olympics</a>. The studio (which plays the part of downtown’s Federal Building) and a few select staff (you can see Traci and Alyssa) have joined the ranks of other sweet cameos from the likes of Mayor Sam Adams and that guy from Modest Mouse. We were surprised, and amazed, at how much of the dialogue is improvised on the spot. At the end of the shoot (only some of us got craft services), Fred and Carrie said that if they were forced to work in an office, they’d want to work here.</p> <p>Enjoy a few snapshots of us hanging out on the set.</p> <p /> <p> </p> </p> <p><a href="http://blog.secondstory.com/dream-of-the-90s-is-alive">Permalink</a> </p><img src="http://feeds.feedburner.com/~r/secondstory/~4/JwRyJKUz-Bc" height="1" width="1"/> http://files.posterous.com/user_profile_pics/762745/2storypdx.png http://posterous.com/users/5Al0rmDXf2UN Second Story Second Story Second Story http://blog.secondstory.com/dream-of-the-90s-is-alive Wed, 02 May 2012 14:46:00 -0700 One State, Ten Days, Many Voices http://feedproxy.google.com/~r/secondstory/~3/PdIvhamJ6fo/128193090 http://blog.secondstory.com/128193090 <p> <p><iframe src="http://player.vimeo.com/video/40565208?portrait=0" frameborder="0" height="283" width="500"></iframe></p> <p>For two weeks in April 2012, Second Story creative director David Waingarten and his crew, Jefe Greenheart and Kirsten Southwell, set out on a whirlwind tour of North Carolina. Their mission: to capture stories of real citizens speaking about issues that affect their lives. These short documentary films will be featured in the Emerging Issues Commons, an interactive exhibit and web app launching later this year in the new James B. Hunt Library on the North Carolina State University’s Centennial campus in Raleigh.</p> <p>Driving from the Blue Ridge Mountains to the Atlantic, the film crew traveled North Carolina’s back roads to find faces, landscapes, and moments that show the diversity and humanity of the state.</p> <p>“Second Story’s been working on this project for almost two years,” says David, “with the goal of using interactive media to help illuminate how policies affect everyday people in North Carolina, to understand the state as a whole, its complexities, and educate people about the challenges the state is facing. This trip was a personal awakening to the importance of the Commons itself, both a physical location and an online avenue that reaches out to the entire state and beyond. We’ve steeped ourselves in facts, data, maps, state history, and policy ideas. But the crucial element is always the people. To me, our trip underlines the need to connect visitors emotionally to the reality of the land and the people whose lives we’re talking about. That’s what I hope these films will do.”</p> <p>David, Jefe, and Kirsten logged thousands of miles, met hundreds of people, and came back with their own stories to tell. Get a glimpse of their journey in this video.</p> <p> </p> </p> <p><a href="http://blog.secondstory.com/128193090">Permalink</a> </p><img src="http://feeds.feedburner.com/~r/secondstory/~4/PdIvhamJ6fo" height="1" width="1"/> http://files.posterous.com/user_profile_pics/762745/2storypdx.png http://posterous.com/users/5Al0rmDXf2UN Second Story Second Story Second Story http://blog.secondstory.com/128193090 Tue, 01 May 2012 12:33:00 -0700 Creativity in Motion http://feedproxy.google.com/~r/secondstory/~3/cNc2vir64Vw/creativity-in-motion http://blog.secondstory.com/creativity-in-motion <p> <p><iframe src="http://player.vimeo.com/video/41126680?portrait=0" frameborder="0" height="283" width="500"></iframe></p> <p>It began with a full-studio, open brainstorm and ended ten days later with a 40-foot-long, floor-to-ceiling interactive sculpture. The studio was alive with an interdisciplinary effort that combined the analog (sewing, model-making, silk-screening) with the digital (Kinect depth-sensing devices, C++ using openFrameworks, C# using OpenTK). It was a creative spree with all hands on deck; here’s a behind-the-scenes video demonstrating the process in motion.</p> <p>More details about the concept and application are available on <a href="http://secondstory.com/project/tedx2012">the project page</a> and our initial <a href="http://blog.secondstory.com/uncharted-territory">blog post</a> about the installation.</p> </p> <p><a href="http://blog.secondstory.com/creativity-in-motion">Permalink</a> </p><img src="http://feeds.feedburner.com/~r/secondstory/~4/cNc2vir64Vw" height="1" width="1"/> http://files.posterous.com/user_profile_pics/762745/2storypdx.png http://posterous.com/users/5Al0rmDXf2UN Second Story Second Story Second Story http://blog.secondstory.com/creativity-in-motion Thu, 26 Apr 2012 09:56:00 -0700 Uncharted Territory http://feedproxy.google.com/~r/secondstory/~3/4Q2pnbDV25U/uncharted-territory http://blog.secondstory.com/uncharted-territory <p> <p>This past weekend, Second Story created a reactive media experience for the TEDx Portland afterparty at the Pacific Northwest College of Art. For one night only, partygoers charted new landscapes from their movements. That day, TEDx Portland had presented a slate of presenters, all speaking on the theme “Uncharted Territory.” </p> <p>This theme had great resonance to us here in Portland. Inspired by the iconic imagery of the Cascade Range and the dramatic skies that comes with our wonderful weather, we designed an experience that combined the solid and the fluid, the physical and the ephemeral. </p> <p>The physical installation consisted of a large free-standing wall made of repeated cardboard shapes. A translucent white fabric wrapped the structure and then rose up, stretching for 45 feet over partygoers’ heads, like a billowing sail or snow blowing off the top of a mountain. </p> <p>As partygoers danced in front of the wall, they saw their own bodies become landscapes, which flowed up, becoming more abstract with time and distance. Depth sensing cameras picked up the movements, transforming raw data into generative graphics. </p> <p>Stay tuned for a behind-the-scenes video, coming later this week.</p> <p><div class='p_embed p_image_embed'> <a href="http://getfile2.posterous.com/getfile/files.posterous.com/temp-2012-04-26/BgDCtiBfJGtwiwfzbxzEAzlpDqBknHhrJokblkFDnBfpqFzkzptwnikhGpaz/ted_interactive_landscape.jpg.scaled1000.jpg"><img alt="Ted_interactive_landscape" height="752" src="http://getfile4.posterous.com/getfile/files.posterous.com/temp-2012-04-26/BgDCtiBfJGtwiwfzbxzEAzlpDqBknHhrJokblkFDnBfpqFzkzptwnikhGpaz/ted_interactive_landscape.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile8.posterous.com/getfile/files.posterous.com/temp-2012-04-26/HggAEDlhzcuotzblFiGkaapAblqCqhetmsxrlxwdvcbxJnAtenDwycyuFiDp/ted_panorama.jpg.scaled1000.jpg"><img alt="Ted_panorama" height="365" src="http://getfile8.posterous.com/getfile/files.posterous.com/temp-2012-04-26/HggAEDlhzcuotzblFiGkaapAblqCqhetmsxrlxwdvcbxJnAtenDwycyuFiDp/ted_panorama.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile4.posterous.com/getfile/files.posterous.com/temp-2012-04-26/rFzExEsbtoAccoEfwkoxcgHomkmaqHxaJxAcfsiaipkcDuuDotbwomJiopBv/marnold.jpg.scaled1000.jpg"><img alt="Marnold" height="453" src="http://getfile0.posterous.com/getfile/files.posterous.com/temp-2012-04-26/rFzExEsbtoAccoEfwkoxcgHomkmaqHxaJxAcfsiaipkcDuuDotbwomJiopBv/marnold.jpg.scaled500.jpg" width="500" /></a> <div class='p_see_full_gallery'><a href="http://blog.secondstory.com/uncharted-territory">See the full gallery on Posterous</a></div> </div> </p> <p> </p> <p> </p> </p> <p><a href="http://blog.secondstory.com/uncharted-territory">Permalink</a> </p><img src="http://feeds.feedburner.com/~r/secondstory/~4/4Q2pnbDV25U" height="1" width="1"/> http://files.posterous.com/user_profile_pics/765707/scott_smith-2.jpg http://posterous.com/users/5BhyKAxz0Ii5 Scott Smith sholdensmith Scott Smith http://blog.secondstory.com/uncharted-territory Tue, 20 Mar 2012 11:15:58 -0700 Real Fast Draw http://feedproxy.google.com/~r/secondstory/~3/Llh68uf4Tx8/real-fast-draw http://blog.secondstory.com/real-fast-draw <p> <p><iframe src="http://player.vimeo.com/video/38860210?portrait=0" frameborder="0" height="283" width="500"></iframe></p> <p> </p> <p><span style="font-size: medium;"><em>Concept</em></span></p> <p>Real Fast Draw began with a simple impetus: to add interactivity to our lectures and presentations. Interactivity is central to everything we do at Second Story, so it felt strange and almost hypocritical to stand before a group of people and simply orate. In order to better align medium with message, we decided to make an interactive deck of slides that audience members could play with while a speaker presented.</p> <p> </p> <p class="p1"><span style="font-size: medium;"><em>Constraints</em></span></p> <p class="p2">Real Fast Draw had two eponymous constraints:</p> <ol class="ol1"> <li class="li3">It had to be built <em>Real Fast</em>. We had very little time and resources with which to build it: two people, one week.</li> <li class="li3">It had to work <em>Real Fast</em>. Namely, users needed to be able to interact with the canvas in real time, over a regular 3G network.</li> </ol> <p class="p2">Constraints, of course, can be motivators as much as they can be impediments. In this case, they led us to use two relatively new "HTML5" web technologies: WebSockets and WebGL.</p> <p class="p2"> </p> <p class="p1"><span style="font-size: medium;"><em>Drawing on Earlier Drawing Applications</em></span></p> <p class="p2">To get real faster we decided to use a previous Second Story project as a point of reference. The project that best fit our goals was <a href="http://secondstory.com/project/infinite-creativity" title="Infinite Creativity">Infinite Creativity</a>, a multiuser drawing experience. Infinite Creativity allowed users to draw shapes on their mobile devices or multi-touch screens and then send them to a shared canvas. Beautifully designed, it was exemplary of Second Story's work. Its multi-user model was a perfect fit for the sort of "interactive presentation" we aspired to:</p> <p> </p> <p class="p2"><div class='p_embed p_image_embed'> <a href="http://getfile1.posterous.com/getfile/files.posterous.com/temp-2012-03-20/mArIEiFukGkmGHbcGkAunvFsvGFjgfinvhIqCvikDCkaqpfCvwigGJoGtkCI/8230_image.jpg.scaled1000.jpg"><img alt="8230_image" height="312" src="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2012-03-20/mArIEiFukGkmGHbcGkAunvFsvGFjgfinvhIqCvikDCkaqpfCvwigGJoGtkCI/8230_image.jpg.scaled500.jpg" width="500" /></a> </div> </p> <p class="p2"> </p> <p class="p1"><span style="font-size: medium;"><em>WebSockets: node.js and socket.io</em></span></p> <p class="p2">Unlike Infinite Creativity, Real Fast Draw needed to be in <em>Real Time</em>: that is, rather than have users compose on their devices and subsequently send their compositions to the canvas, we would treat devices like mouse pads. As users moved their fingers on the screen, they would see immediate feedback up on the presentation screen.</p> <p class="p2">To this end, communicating via standard HTTP would not suffice. Nor did we have a backend developer to create the necessary services for this to happen. These two constraints made it quite clear that the WebSockets were the way to go.</p> <p class="p2">Our first step was to set up a server with <a href="http://nodejs.org/"><span class="s1">node.js</span></a>. Node.js makes it incredibly easy to build multi-user applications like Real Fast Draw. It is featherweight, simple to install, and a breeze to use.</p> <p class="p2">Next we installed <a href="http://socket.io/"><span class="s1">socket.io</span></a>, a framework for making WebSocket connections between browser clients and our node server. Socket.io even supports browsers that can't run HTML5 or WebSockets, by falling back on Flash and other technologies. The logic for our whole server is as simple as the following:</p> <p class="p2" style=""><span style="color: #99ccff;">io.sockets.on('connection', function (socket) {</span><br /><span style="color: #99ccff;">   socket.broadcast.emit('ca', { id: String(socket.id) });</span><p /> <span style="color: #99ccff;">     // TouchDown</span><br /><span style="color: #99ccff;">   socket.on('d', function (data) {</span><br /><span style="color: #99ccff;">     data.id = socket.id;</span><br /><span style="color: #99ccff;">     socket.broadcast.emit('cd', data);</span><br /><span style="color: #99ccff;">   });</span><p /> <span style="color: #99ccff;">     // TouchStill (touch is still down, but not dragging yet)</span><br /><span style="color: #99ccff;">   socket.on('s', function () {</span><br /><span style="color: #99ccff;">     socket.broadcast.emit('cs', { id: socket.id });</span><br /><span style="color: #99ccff;">   });</span><p /> <span style="color: #99ccff;">     // TouchMove</span><br /><span style="color: #99ccff;">   socket.on('m', function (data) {</span><br /><span style="color: #99ccff;">     data.id = socket.id;</span><br /><span style="color: #99ccff;">     socket.broadcast.emit('cm', data);</span><br /><span style="color: #99ccff;">   });</span><p /> <span style="color: #99ccff;">   socket.on('disconnect', function () {</span><br /><span style="color: #99ccff;">     socket.broadcast.emit('cr', { id: String(socket.id) });</span><br /><span style="color: #99ccff;">   });</span><br /><span style="color: #99ccff;"> });</span></p> <p class="p2"> </p> <p class="p1">Using node.js and socket.io, we were able to get our canvas and clients talking in real time in just a couple hours, with no backend development effort. The application was working <em>Real Fast</em>, <em>Real Fast</em>.</p> <p class="p1">An early prototype looked like this:</p> <div><div class='p_embed p_image_embed'> <a href="http://getfile2.posterous.com/getfile/files.posterous.com/temp-2012-03-20/JwGqiGvAtzohotwcawnGwploonohInwBFGDimyxBJkkekttkmpgcgcltCskc/rfd_proto-1.png.scaled1000.png"><img alt="Rfd_proto-1" height="155" src="http://getfile8.posterous.com/getfile/files.posterous.com/temp-2012-03-20/JwGqiGvAtzohotwcawnGwploonohInwBFGDimyxBJkkekttkmpgcgcltCskc/rfd_proto-1.png.scaled500.png" width="500" /></a> </div> </div> <p /> <div> <p class="p1"><span style="font-size: medium;"><em>The Canvas, or not</em></span></p> <p class="p2">At this point we were ready to move on to the presentation screen itself. We landed on a layout with the "canvas" occupying the top half of the screen, and our presentation slides at the bottom. Everything would be done within a browser, using Javascript. The slides would be unique pages loaded into an iFrame, while the canvas would be, of course, an HTML5 canvas.</p> <p class="p2">In order for users to be able to tell themselves apart, each was assigned a unique shape and color upon connecting to the canvas. This shape would serve as a cursor on their device, and correspond to the shape being drawn on the canvas. These shapes and colors were taken wholesale from Infinite Creativity.</p> <p class="p2">This worked great in early iterations: we had recreated the basics of the Infinite Creativity experience within a web browser, in real time.</p> <p class="p2">As we began to test with multiple users, however, it soon became clear that the canvas would not be able to draw the hundreds (or even thousands) of shapes that users would be making every second. One swipe of a finger could create upwards of a hundred unique points. Multiply that by thirty or forty audience members and our presentation would be brought to its knees.</p> <p class="p2">Real fast, we decided to switch to WebGL.</p> </div> <p> </p> <p class="p1"><span style="font-size: medium;"><em>WebGL Sprites</em></span></p> <p class="p2">Reimagining the canvas in WebGL was much less arduous of a process than it could have been, thanks in no small part to the <a href="http://threejs.org">three.js</a> Javascript library. In fact, WebGL provided a perfect excuse to leave the two-dimensional canvas of Infinite Creativity and pursue a more 3D approach to drawing. In developing a <a href="http://secondstory.com/project/browse/client/coca-cola/wocc-wall"><span class="s1">reactive media wall</span></a> for Coca-Cola last year, we became captivated with the way that a seemingly two-dimensional surface could suddenly be rotated to reveal the parallax happening between layers. What would Infinite Creativity look like with similar parallax between each of the users' shape trails?</p> <p class="p2">The first step was to create a camera that would stay focused on the center of the drawing area while constantly changing its field of view.</p> <p class="p2">Next, we took what had been simple shapes drawn into a canvas and made them GL sprites. The boost in performance was immediately palpable. We were now moving and rotating thousands of sprites at once while maintaining a reasonable frame rate. The look and feel of the application was much more exciting than it had been in 2D, as well:</p> <p class="p2"><div class='p_embed p_image_embed'> <a href="http://getfile2.posterous.com/getfile/files.posterous.com/temp-2012-03-20/DziICtblqmrDAbcqpmJxJvDHcmHfvgGonuvkrvgBzHHafwvozJxrFzDEbFBF/rfd_final1-1.png.scaled1000.png"><img alt="Rfd_final1-1" height="169" src="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2012-03-20/DziICtblqmrDAbcqpmJxJvDHcmHfvgGonuvkrvgBzHHafwvozJxrFzDEbFBF/rfd_final1-1.png.scaled500.png" width="500" /></a> </div> </p> <p class="p2"> </p> <p class="p2"><span style="font-size: medium;"><em>WebGL Particles</em></span></p> <p class="p2">At this point we were very close to what we wanted, although five or more users would begin to bring the frame rate down considerably. We needed to make one last (real fast) change.</p> <p class="p2">We have been using OpenGL particles a lot lately, in experiences like <a href="http://secondstory.com/project/browse/client/coca-cola/bubble-izer"><span class="s1">The Bubble-izer</span></a> and <a href="http://secondstory.com/project/browse/client/coca-cola/protecting-the-secret"><span class="s1">Protecting the Secret</span></a>. While sprites allowed us to animate thousands of objects, particles pushed that number into the hundreds of thousands.</p> <p class="p2">The trick with particles, as opposed to Sprites, is that you can't be constantly creating and destroying them. Your particle system must be a VBO of a fixed length, which gets pushed to the graphics card en masse. To deal with this, we simply create a VBO of 3000 particles for every new user, and make them all invisible. Whenever the user draws on their screen, we simply take invisible particles, move them into position, and make them visible.</p> <p class="p2">Using particles, we were able to add as many users that we want without slowing down that canvas whatsoever. At last, we were drawing <em>Real Fast</em>:</p> <p><div class='p_embed p_image_embed'> <a href="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2012-03-20/vatCpFkmmrAAyAuhDozIxkEuvmBDlBfBzisuDyCxzqreAydaIjxgxdjdBDlg/real_fast_draw_still.png.scaled1000.png"><img alt="Real_fast_draw_still" height="282" src="http://getfile5.posterous.com/getfile/files.posterous.com/temp-2012-03-20/vatCpFkmmrAAyAuhDozIxkEuvmBDlBfBzisuDyCxzqreAydaIjxgxdjdBDlg/real_fast_draw_still.png.scaled500.png" width="500" /></a> </div> </p> <p> </p> </p> <p><a href="http://blog.secondstory.com/real-fast-draw">Permalink</a> </p><img src="http://feeds.feedburner.com/~r/secondstory/~4/Llh68uf4Tx8" height="1" width="1"/> http://files.posterous.com/user_profile_pics/762745/2storypdx.png http://posterous.com/users/5Al0rmDXf2UN Second Story Second Story Second Story http://blog.secondstory.com/real-fast-draw Mon, 27 Feb 2012 15:11:00 -0800 Scenes from the Volumetric Society Meet-up http://feedproxy.google.com/~r/secondstory/~3/J7kkeAeQ_pI/scenes-from-the-volumetric-society-meet-up http://blog.secondstory.com/scenes-from-the-volumetric-society-meet-up <p> <p><iframe src="http://player.vimeo.com/video/37272113?portrait=0" frameborder="0" height="283" width="500"></iframe></p> <p>Earlier this month, the Volumetric Society met at Second Story Interactive Studios for the very first regional meet-up. These are exciting times for anyone interested in depth-sensing and gesture-based technology and this was a great forum for discussion. We shared some of our recent work on Kinect-based interactives and this is a little montage of scenes from the evening. Stay tuned for future happenings!</p> </p> <p><a href="http://blog.secondstory.com/scenes-from-the-volumetric-society-meet-up">Permalink</a> </p><img src="http://feeds.feedburner.com/~r/secondstory/~4/J7kkeAeQ_pI" height="1" width="1"/> http://files.posterous.com/user_profile_pics/762745/2storypdx.png http://posterous.com/users/5Al0rmDXf2UN Second Story Second Story Second Story http://blog.secondstory.com/scenes-from-the-volumetric-society-meet-up Mon, 20 Feb 2012 09:28:00 -0800 Career Day at Second Story: A Visit from Portland Public School students http://feedproxy.google.com/~r/secondstory/~3/wEkxfjOCQhE/career-day-at-second-story-a-visit-from-portl http://blog.secondstory.com/career-day-at-second-story-a-visit-from-portl <p> <p>Last Thursday, Second Story hosted 20 <a href="http://www.pps.k12.or.us/">Portland Public Schools</a> high school juniors and seniors for a morning of career exploration. In concert with representatives from PPS and the <a href="http://www.portlandworkforcealliance.org/">Portland Workforce Alliance</a>, we gave small groups of students an opportunity to see what we do every day, ask questions about our work, and talk to us individually about our own career paths. We love what we do, we're proud of how we got here, and we love sharing it all with young people as they think about their own futures. The students were incredibly enthusiastic, and asked great questions. We ended the day feeling better than ever about the future of technology, art and design.</p> <p><div class='p_embed p_image_embed'> <a href="http://getfile4.posterous.com/getfile/files.posterous.com/temp-2012-02-20/hakBcHkeEgwdhBucEFjtlqtJrHpkodqfeAwenlqHwrBdelrGwDEIusolxFzH/_MG_6013.JPG.scaled1000.jpg"><img alt="_mg_6013" height="333" src="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2012-02-20/hakBcHkeEgwdhBucEFjtlqtJrHpkodqfeAwenlqHwrBdelrGwDEIusolxFzH/_MG_6013.JPG.scaled500.jpg" width="500" /></a> </div> </p> <p><div class='p_embed p_image_embed'> <a href="http://getfile0.posterous.com/getfile/files.posterous.com/temp-2012-02-20/DmugJFcrwjGwEoDgzEtGrBqwDbjAlwrrJxCyhnjdfjjyHcBbrBEEfGxeJAjt/_MG_6009.JPG.scaled1000.jpg"><img alt="_mg_6009" height="333" src="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2012-02-20/DmugJFcrwjGwEoDgzEtGrBqwDbjAlwrrJxCyhnjdfjjyHcBbrBEEfGxeJAjt/_MG_6009.JPG.scaled500.jpg" width="500" /></a> </div> <div class='p_embed p_image_embed'> <a href="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2012-02-20/sfjBeelmHwqgIxdIbDumrefBxedDzFGGrwogDwuIqdqhjrGgaqlsCcHjdeEg/_MG_6024.JPG.scaled1000.jpg"><img alt="_mg_6024" height="333" src="http://getfile6.posterous.com/getfile/files.posterous.com/temp-2012-02-20/sfjBeelmHwqgIxdIbDumrefBxedDzFGGrwogDwuIqdqhjrGgaqlsCcHjdeEg/_MG_6024.JPG.scaled500.jpg" width="500" /></a> </div> <div class='p_embed p_image_embed'> <a href="http://getfile2.posterous.com/getfile/files.posterous.com/temp-2012-02-20/BgECghDwEbCGrwgECctpcGcmHmHDpvFsIbBulFEkhhrDimaohxqAarhdgcqb/_MG_6040.JPG.scaled1000.jpg"><img alt="_mg_6040" height="333" src="http://getfile4.posterous.com/getfile/files.posterous.com/temp-2012-02-20/BgECghDwEbCGrwgECctpcGcmHmHDpvFsIbBulFEkhhrDimaohxqAarhdgcqb/_MG_6040.JPG.scaled500.jpg" width="500" /></a> </div> </p> <p><div class='p_embed p_image_embed'> <a href="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2012-02-20/uCdimamJvbokdmIGGtnjyjoIutyehIDsGiFeGqAlDvHHppGrjqpipvivlAHc/_MG_6029.JPG.scaled1000.jpg"><img alt="_mg_6029" height="333" src="http://getfile3.posterous.com/getfile/files.posterous.com/temp-2012-02-20/uCdimamJvbokdmIGGtnjyjoIutyehIDsGiFeGqAlDvHHppGrjqpipvivlAHc/_MG_6029.JPG.scaled500.jpg" width="500" /></a> </div> </p> </p> <p><a href="http://blog.secondstory.com/career-day-at-second-story-a-visit-from-portl">Permalink</a> </p><img src="http://feeds.feedburner.com/~r/secondstory/~4/wEkxfjOCQhE" height="1" width="1"/> http://files.posterous.com/user_profile_pics/762745/2storypdx.png http://posterous.com/users/5Al0rmDXf2UN Second Story Second Story Second Story http://blog.secondstory.com/career-day-at-second-story-a-visit-from-portl Fri, 17 Feb 2012 11:09:00 -0800 Meet the LED Cube http://feedproxy.google.com/~r/secondstory/~3/sXWJ4iVQNwc/meet-our-led-cube http://blog.secondstory.com/meet-our-led-cube <p> <p>The most common response to people seeing this display is, What the heck is that? Well, back in our media lab, we’ve been experimenting with an R&D project involving Kinect technology and an interactive volumetric display. As visitors pass into the range of the Kinect, their image is translated and displayed in the LED cube. Here's a visual explanation of how it all works: </p> <p><iframe src="http://player.vimeo.com/video/36978829?portrait=0" frameborder="0" height="283" width="500"></iframe></p> <p>And here are some technical notes on what's happening behind-the-scenes... </p> <p>The volumetric display is a combination of a 10x10x16 LED matrix and Microsoft Kinect technology. Here, we have focused on creating volumetric imagery by using the depth camera to visualize information as a 3-dimensional display. To communicate with the LED cube and send information over the network, we used Microsoft .Net Micro Framework.</p> <p>Skeleton tracking is another technology that we took advantage of in this research. By using the newest Kinect for Windows SDK inside the Unity 3D environment we were able to create simple games for our LED cube. In one of the games, the player can control the size of particles inside the cube by using their hands and in another game, they can interact with a bouncing ball.</p> <p>As for the hardware, our friends at <a href="http://www.julietzulu.us/">Juliet Zulu</a> provided and built the physical display, which includes the frame, the LEDs, and the LED drivers. </p> </p> <p><a href="http://blog.secondstory.com/meet-our-led-cube">Permalink</a> </p><img src="http://feeds.feedburner.com/~r/secondstory/~4/sXWJ4iVQNwc" height="1" width="1"/> http://files.posterous.com/user_profile_pics/762745/2storypdx.png http://posterous.com/users/5Al0rmDXf2UN Second Story Second Story Second Story http://blog.secondstory.com/meet-our-led-cube Thu, 16 Feb 2012 10:38:00 -0800 Looking through the Keyhole: Reinventing the Optical Peepshow http://feedproxy.google.com/~r/secondstory/~3/4uGdfBQJ8N8/looking-through-the-keyhole-reinventing-the-o http://blog.secondstory.com/looking-through-the-keyhole-reinventing-the-o <p> <p><div class='p_embed p_image_embed'> <a href="http://getfile3.posterous.com/getfile/files.posterous.com/temp-2012-02-16/egDGlhapvygldodCFusoeuxriIuyxIFBavkacGdarqtpJeccpfbyzmitsnte/13-IMG_7516.jpg.scaled1000.jpg"><img alt="13-img_7516" height="319" src="http://getfile6.posterous.com/getfile/files.posterous.com/temp-2012-02-16/egDGlhapvygldodCFusoeuxriIuyxIFBavkacGdarqtpJeccpfbyzmitsnte/13-IMG_7516.jpg.scaled500.jpg" width="500" /></a> </div> </p> <p>The technology of popular entertainment is ever-changing and constantly evolving, but if you distill the experience down to its essence, you’ll witness some very similar patterns. Consider pre-cinema optical devices like magic lanterns and nickelodeons, peep shows and raree shows. To some, they might appear to be obsolete museum relics, but if you take a step back, their allure is relevant to some of our most modern technologies.</p> <p><div class='p_embed p_image_embed'> <a href="http://getfile1.posterous.com/getfile/files.posterous.com/temp-2012-02-16/FIdfzdvlHsCEhtbxzwmdpebIyxIqwGBybbauIByviqGsDjlGobovjFFidCJp/peep_shows.jpg.scaled1000.jpg"><img alt="Peep_shows" height="378" src="http://getfile4.posterous.com/getfile/files.posterous.com/temp-2012-02-16/FIdfzdvlHsCEhtbxzwmdpebIyxIqwGBybbauIByviqGsDjlGobovjFFidCJp/peep_shows.jpg.scaled500.jpg" width="500" /></a> </div> </p> <p><em style="font-size: x-small;">La Lanterna Magica, 1815. B. Pinelli</em></p> <p>Each of these devices involves the act of peering through an aperture to experience a story. The very act of gazing through a narrative keyhole transports you to another space. It blacks out the rest of the world and allows the imagination to light up. The act of framing changes the environment and generates a stage for storytelling—think of the thrill that comes from simply looking through a camera viewfinder. Nabokov picks up on the transformative effects of an aperture in chapter eight of <em>Speak, Memory</em> where he recalls the fugue-like state of experiencing a magic lantern shows and likens it to the enchantment of looking through a microscope lens at butterfly wings.</p> <p>Here at the studio, we’ve borrowed from these early devices and experimented with new platforms for unveiling stories. In a physical space, a peep show can dislocate you from reality, further suspending disbelief. They might not act as a great overture to a gallery exhibit—by nature, they are small-group or personal experiences—but they can serve as wonderful grace notes to the greater story.</p> <p><div class='p_embed p_image_embed'> <a href="http://getfile1.posterous.com/getfile/files.posterous.com/temp-2012-02-16/IIDDgfAnHAIlsyGsrzDhpEbkrxfDtefJpcywBHHgmtbAJqEhxExrHztbmnxI/armory_site_10.png.scaled1000.png"><img alt="Armory_site_10" height="400" src="http://getfile5.posterous.com/getfile/files.posterous.com/temp-2012-02-16/IIDDgfAnHAIlsyGsrzDhpEbkrxfDtefJpcywBHHgmtbAJqEhxExrHztbmnxI/armory_site_10.png.scaled500.png" width="500" /></a> <a href="http://getfile3.posterous.com/getfile/files.posterous.com/temp-2012-02-16/DswdJIsstsJhwaHCceoBvHvoHbtCfpiyoEaaDphedqcJfgkGCAIaahmFumpu/armory_hist_screen_85.png.scaled1000.png"><img alt="Armory_hist_screen_85" height="400" src="http://getfile6.posterous.com/getfile/files.posterous.com/temp-2012-02-16/DswdJIsstsJhwaHCceoBvHvoHbtCfpiyoEaaDphedqcJfgkGCAIaahmFumpu/armory_hist_screen_85.png.scaled500.png" width="500" /></a> <div class='p_see_full_gallery'><a href="http://blog.secondstory.com/looking-through-the-keyhole-reinventing-the-o">See the full gallery on Posterous</a></div> </div> </p> <p>The behavior of putting your eye up to a keyhole is an intimate one, and a perfect method for telling stories that trigger the imagination, drawing the visitor deeper into the fold. Especially young visitors. Kids love pressing their noses up to the glass of anything, and if they’re treated with a colorful display of visuals, they will turn away delighted, wanting to share with someone else.</p> <p><div class='p_embed p_image_embed'> <a href="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2012-02-16/IshyzcyAvjtFppyrotnFduwDqEofnEHrnrHkfiduuqAlncBveAHeoooxcIqy/mathematica.jpg.scaled1000.jpg"><img alt="Mathematica" height="489" src="http://getfile3.posterous.com/getfile/files.posterous.com/temp-2012-02-16/IshyzcyAvjtFppyrotnFduwDqEofnEHrnrHkfiduuqAlncBveAHeoooxcIqy/mathematica.jpg.scaled500.jpg" width="500" /></a> </div> </p> <p><span style="font-size: x-small;"><em>Mathematica Peep show, 1961, from Eames Design. <span style="">Courtesy and © Eames Office LLC (</span><a href="http://eamesoffice.com/" target="_blank" style="">eamesoffice.com</a><span style="">)</span></em></span></p> <p>One of the key features of peepshows is the element of surprise. As you approach a box or a wall or whatever form its taking, you have no idea what’s contained inside. Essentially, it’s like a musical jack-in-the-box with a story inside instead of a creepy clown. The hidden, as one could say, is always more curious than the exposed.</p> <p><div class='p_embed p_image_embed'> <img alt="Sf_moma_library" height="650" src="http://getfile1.posterous.com/getfile/files.posterous.com/temp-2012-02-16/csfvlIcHdwthpstAznqvExnCDrBIzHxpHrefuxhhGieIhrAmftJexbkqJtdy/sf_moma_library.jpg.scaled500.jpg" width="500" /> </div> </p> <p><span style="font-size: x-small;"><em>SF Moma Institutional Bulletin, Via <a href="http://museumnerd.tumblr.com/post/17381264457/perhaps-someone-at-sfmomas-fantastic-library-and">Museum Nerd</a></em></span></p> <p>There’s also the element of infectious visitor engagement. Unlike a shared experience, such as a movie theater, where the story is experienced collectively, a peep show has more of a domino effect. You might witness another visitor’s response to the show, whether it be excitement, delight, or surprise, and then be curious about what caused the look on their face.</p> <p>It should be noted that when we refer to peep shows, we’re talking about the historical variety, not the kind commonly associated with red light districts. Peep shows were popular during the 18th and 19th century and were often experienced as sideshow attractions at carnivals and streetfairs. China, Japan, Italy, France, England and the United States all have rich histories of peep show attractions, it wasn’t until this past century when the word became conventionally associated with the lewd rather than the fantastic.</p> <p>Historical peep shows would employ a variety of devices to engage audiences: mirrors to give a sense of depth, lighting to increase the drama, and strings and pulleys to effect motion. We’ve borrowed, interpreted, and learned from from these techniques and evolved them in such a way that—even hundreds of years after their invention—they still feel fresh and fun.</p> <p>See how we’ve employed these forms on three very different projects:</p> <p>Triangle Room Peep Shows</p> <p><iframe src="http://player.vimeo.com/video/34378434?portrait=0" frameborder="0" height="283" width="500"></iframe></p> <p>Historiscope</p> <p><iframe src="http://player.vimeo.com/video/9691164?portrait=0" frameborder="0" height="283" width="500"></iframe></p> <p>Raree Show: Walt’s Early Years</p> <p><iframe src="http://player.vimeo.com/video/32215325?portrait=0" frameborder="0" height="283" width="500"></iframe></p> <p>—Michael Neault, <em>Content Producer</em></p> <p><span style="font-size: small;">For more historical information, check out <a href="http://www.amazon.com/Peepshows-Visual-History-Richard-Balzer/dp/0810963493"><em>Peepshows: A Visual History, </em>by Richard Balzer</a>. </span></p> </p> <p><a href="http://blog.secondstory.com/looking-through-the-keyhole-reinventing-the-o">Permalink</a> </p><img src="http://feeds.feedburner.com/~r/secondstory/~4/4uGdfBQJ8N8" height="1" width="1"/> http://files.posterous.com/user_profile_pics/762745/2storypdx.png http://posterous.com/users/5Al0rmDXf2UN Second Story Second Story Second Story http://blog.secondstory.com/looking-through-the-keyhole-reinventing-the-o Fri, 10 Feb 2012 17:39:00 -0800 Playtime with the Microsoft Surface http://feedproxy.google.com/~r/secondstory/~3/phxwchKk_xw/playtime-with-the-microsoft-surface http://blog.secondstory.com/playtime-with-the-microsoft-surface <p> <p>The studio was delighted to receive the new Microsoft Surface 2 yesterday<span style="font-family: Verdana, sans-serif; font-size: 9pt; line-height: 115%;">—</span>now, it's time to experiment. All hands on deck.</p> <p>A few photos from our first date with the technology... </p> <p><div class='p_embed p_image_embed'> <a href="http://getfile0.posterous.com/getfile/files.posterous.com/temp-2012-02-10/xCvhviBbCFHwbJapyyDEtnjCDgosxnqheHIzJJrcxChICFAtEtgJjhwjwDfF/_MG_5964.JPG.scaled1000.jpg"><img alt="_mg_5964" height="333" src="http://getfile8.posterous.com/getfile/files.posterous.com/temp-2012-02-10/xCvhviBbCFHwbJapyyDEtnjCDgosxnqheHIzJJrcxChICFAtEtgJjhwjwDfF/_MG_5964.JPG.scaled500.jpg" width="500" /></a> </div> </p> <p><div class='p_embed p_image_embed'> <a href="http://getfile6.posterous.com/getfile/files.posterous.com/temp-2012-02-10/fvBJakardbvGIxnrcdtyztshDGwkkCpljGbJctBreyJrrAJEiygpIyJbFHlv/_MG_5952.JPG.scaled1000.jpg"><img alt="_mg_5952" height="333" src="http://getfile0.posterous.com/getfile/files.posterous.com/temp-2012-02-10/fvBJakardbvGIxnrcdtyztshDGwkkCpljGbJctBreyJrrAJEiygpIyJbFHlv/_MG_5952.JPG.scaled500.jpg" width="500" /></a> </div> </p> <p><div class='p_embed p_image_embed'> <a href="http://getfile3.posterous.com/getfile/files.posterous.com/temp-2012-02-10/aktvdzihzzjFCFvdxiIoGmCfJGohEDpkHybqckxinlczjgogJhqleICqnphi/_MG_5966.JPG.scaled1000.jpg"><img alt="_mg_5966" height="333" src="http://getfile3.posterous.com/getfile/files.posterous.com/temp-2012-02-10/aktvdzihzzjFCFvdxiIoGmCfJGohEDpkHybqckxinlczjgogJhqleICqnphi/_MG_5966.JPG.scaled500.jpg" width="500" /></a> </div> </p> <p><div class='p_embed p_image_embed'> <a href="http://getfile7.posterous.com/getfile/files.posterous.com/temp-2012-02-10/krzqweehGGhkIFhuAGEvrHzuvBcBbebzAlaGluxDycqJbDpapgGpsDCHilqj/_MG_5951.JPG.scaled1000.jpg"><img alt="_mg_5951" height="333" src="http://getfile2.posterous.com/getfile/files.posterous.com/temp-2012-02-10/krzqweehGGhkIFhuAGEvrHzuvBcBbebzAlaGluxDycqJbDpapgGpsDCHilqj/_MG_5951.JPG.scaled500.jpg" width="500" /></a> </div> </p> <p><div class='p_embed p_image_embed'> <a href="http://getfile5.posterous.com/getfile/files.posterous.com/temp-2012-02-10/CrAaddFdAofqhtJEwAfzIqawcyaCmCryBdoatkpefcByhIDrHvBmdzemrHnk/_MG_5967.JPG.scaled1000.jpg"><img alt="_mg_5967" height="333" src="http://getfile5.posterous.com/getfile/files.posterous.com/temp-2012-02-10/CrAaddFdAofqhtJEwAfzIqawcyaCmCryBdoatkpefcByhIDrHvBmdzemrHnk/_MG_5967.JPG.scaled500.jpg" width="500" /></a> </div> </p> <p><div class='p_embed p_image_embed'> <a href="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2012-02-10/wHdgfsgHfahmgBDlozaDJHobfAeGGmDwkrjoeeJigbtrBuAHiEzjlqlAFbzI/_MG_5956.JPG.scaled1000.jpg"><img alt="_mg_5956" height="333" src="http://getfile8.posterous.com/getfile/files.posterous.com/temp-2012-02-10/wHdgfsgHfahmgBDlozaDJHobfAeGGmDwkrjoeeJigbtrBuAHiEzjlqlAFbzI/_MG_5956.JPG.scaled500.jpg" width="500" /></a> </div> </p> <p><div class='p_embed p_image_embed'> <a href="http://getfile6.posterous.com/getfile/files.posterous.com/temp-2012-02-10/IIvptmfBsGvqhCnwyArErFHguzwtGJHHwBxpJxAaGukrepJfbsBBwknuBzew/_MG_5955.JPG.scaled1000.jpg"><img alt="_mg_5955" height="333" src="http://getfile2.posterous.com/getfile/files.posterous.com/temp-2012-02-10/IIvptmfBsGvqhCnwyArErFHguzwtGJHHwBxpJxAaGukrepJfbsBBwknuBzew/_MG_5955.JPG.scaled500.jpg" width="500" /></a> </div> <div class='p_embed p_image_embed'> <a href="http://getfile0.posterous.com/getfile/files.posterous.com/temp-2012-02-10/fIjEvveHqIfkeapbhkAafgEAJJiwGedfFfCevnDqIEgdvAzipdydBqesHHFw/_MG_5972.JPG.scaled1000.jpg"><img alt="_mg_5972" height="333" src="http://getfile4.posterous.com/getfile/files.posterous.com/temp-2012-02-10/fIjEvveHqIfkeapbhkAafgEAJJiwGedfFfCevnDqIEgdvAzipdydBqesHHFw/_MG_5972.JPG.scaled500.jpg" width="500" /></a> </div> <div class='p_embed p_image_embed'> <a href="http://getfile5.posterous.com/getfile/files.posterous.com/temp-2012-02-10/hjfpFnshBaDBHlIegazEagIjfbADAgItAhBlJqkvnuDEayxhgaioFuACyvAq/_MG_5969.JPG.scaled1000.jpg"><img alt="_mg_5969" height="333" src="http://getfile6.posterous.com/getfile/files.posterous.com/temp-2012-02-10/hjfpFnshBaDBHlIegazEagIjfbADAgItAhBlJqkvnuDEayxhgaioFuACyvAq/_MG_5969.JPG.scaled500.jpg" width="500" /></a> </div> <div class='p_embed p_image_embed'> <a href="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2012-02-10/kCmHjbJcHlsfzGbcCyzuAgItryqElqusczosrCkIECGIqzomrzduybneByyA/_MG_5973.JPG.scaled1000.jpg"><img alt="_mg_5973" height="333" src="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2012-02-10/kCmHjbJcHlsfzGbcCyzuAgItryqElqusczosrCkIECGIqzomrzduybneByyA/_MG_5973.JPG.scaled500.jpg" width="500" /></a> </div> </p> </p> <p><a href="http://blog.secondstory.com/playtime-with-the-microsoft-surface">Permalink</a> </p><img src="http://feeds.feedburner.com/~r/secondstory/~4/phxwchKk_xw" height="1" width="1"/> http://files.posterous.com/user_profile_pics/762745/2storypdx.png http://posterous.com/users/5Al0rmDXf2UN Second Story Second Story Second Story http://blog.secondstory.com/playtime-with-the-microsoft-surface Wed, 08 Feb 2012 17:30:00 -0800 Taking it to the Streets: Rapid Prototyping and Usability with a Group Interactive http://feedproxy.google.com/~r/secondstory/~3/PKwovGl4Zio/taking-it-to-the-streets-rapid-prototyping-an http://blog.secondstory.com/taking-it-to-the-streets-rapid-prototyping-an <p> <div>You hear these phrases so often in design and development circles they have become clichés—"get real fast" and <a href="http://www.fastcodesign.com/1663968/wanna-create-a-great-product-fail-early-fail-fast-fail-often">"fail early, fail fast, fail often."</a> As ubiquitous as these sayings have become, there is a reason for this: They’re true.</div> <p /> <div>Here, we've found that the sooner we can get our hands on real data and get that data working in a prototype for our clients (and our client's intended audience), the more quickly we can iterate and improve our final products.</div> <p /> <div>This is definitely ringing true on a project we are working on right now with the Institute for Emerging Issues (IEI), a public policy think tank in North Carolina. We are working with IEI to create a state-of-the-art permanent interactive exhibit on the NC State University campus. The exhibit space, called the IEI Commons, will be full of interactive collaboration, data visualization, and storytelling tools that will help IEI engage students, politicians, business leaders, and citizens on important issues such as the economy, healthcare, and education.</div> <p /> <div>The exhibit doesn't open until January 2013, but rather than sitting back and assuming that our concepts are going to work wonderfully, we have been hard at work making prototypes and doing user testing to see what can be improved.</div> <p /> <div>In our lab, one of the first things we did was construct a table made of foam core, projecting visuals on the surface to approximate a real interactive group table experience. The prototype helped us refine the size of the table and visual design before investing excess time into programming and hardware.</div> <div><div class='p_embed p_image_embed'> <a href="http://getfile2.posterous.com/getfile/files.posterous.com/temp-2012-02-08/xIwFlcaeIfoxJGGAgtezJgFEDjjkFlvFuanHuiexoHFdIclyvsmqGmrABwgG/_MG_5911_treated.jpg.scaled1000.jpg"><img alt="_mg_5911_treated" height="333" src="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2012-02-08/xIwFlcaeIfoxJGGAgtezJgFEDjjkFlvFuanHuiexoHFdIclyvsmqGmrABwgG/_MG_5911_treated.jpg.scaled500.jpg" width="500" /></a> </div> </div> <div>This flexible prototype informed a version of the interactive group table that we brought to a <a href="http://www.ncsu.edu/iei/index.php/news-events/2011-emerging-issues-forum">conference hosted by the Institute for Emerging Issues in North Carolina.</a> There, we were able to observe attendees using the table first-hand along with a Web app that we also produced for the forum. We wanted to see how the intended audience would use these tools, and what else they would want them to do. The feedback we received from seeing people use the interactives was invaluable and will inform our decisions on the final experience. </div> <div> <p /> <div>Here’s an iPhone video glimpse of the scene at the forum. </div> <p /> <div><iframe allowfullscreen="true" src="http://player.vimeo.com/video/36446544?title=0&byline=0&portrait=0&color=d6a34b" frameborder="0" height="248" width="440"></iframe></div> <p /> <div>—Michael Pittman, <em>Producer</em></div> </div> </p> <p><a href="http://blog.secondstory.com/taking-it-to-the-streets-rapid-prototyping-an">Permalink</a> </p><img src="http://feeds.feedburner.com/~r/secondstory/~4/PKwovGl4Zio" height="1" width="1"/> http://files.posterous.com/user_profile_pics/762745/2storypdx.png http://posterous.com/users/5Al0rmDXf2UN Second Story Second Story Second Story http://blog.secondstory.com/taking-it-to-the-streets-rapid-prototyping-an Thu, 02 Feb 2012 11:36:00 -0800 Books and Interactivity Redux (Samovar Edition) http://feedproxy.google.com/~r/secondstory/~3/-X_7jDSvyUo/97594276 http://blog.secondstory.com/97594276 <p> <p>Last year, when <a href="http://blog.secondstory.com/41609232">I wrote about the future of the interactive book</a>, I had read books on smartphones. But now I have an iPad, and it's been an entirely different reading experience.</p> <p>Man, do I love it. The Kindle may be light, use e-ink, and have insane battery life, but the iPad feels like something that Captain Picard might carry around:</p> <p><iframe src="http://www.youtube.com/embed/yVqHoGKQXLI?wmode=transparent" allowfullscreen frameborder="0" height="417" width="500"></iframe></p> <p>or something that could accompany me to Jupiter to investigate strange phenomena: </p> <p><iframe src="http://www.youtube.com/embed/-3949GAIokg?wmode=transparent" allowfullscreen frameborder="0" height="417" width="500"></iframe></p> <p>But it's not just the futuristic form factor that keeps me coming back. I love the user experience of the iBooks app. One feature I've especially appreciated as I read are the contextual tools, especially in the iBooks app. The ability to highlight, comment, and the ability to look things up in the dictionary feels intuitive. </p> <p>Recently I read <em>Hadji Murad</em>, Tolstoy's final novella, in iBooks. The story, about a Chechnyan rebel, is filled with unfamiliar words. I was able to quickly get definitions without getting pulled too far from the story. I don't have to put the book down and pick up a dictionary, yet I am assimilating the information. And there's nothing in the way of my enjoyment of the text: no tags, no footnotes. This isn't about convenience — it's about keeping what's so great about the user experience of reading books in the first place, and that's the feeling of immersion.</p> <p>One downside to this opaqueness is that there's nothing to tell me when there's no available information available. Often, I'll check for a definition to find that there's nothing in the dictionary. That’s because right now, the available data is severely limited. I want more.</p> <p>For example, I could imagine, in a translated work, being able to quickly see the original text. </p> <p>Or, I'd love to see quick images of specific references. Or: at the beginning of Hadji Murad is a long passage about different kinds of flowers. Probably Tolstoy's contemporary readers were familiar with them, but I wasn't. He may tell me that the scabious is red and yellow, but what does it look like? (Here's a pink one...)</p> <p><div class='p_embed p_image_embed'> <a href="http://getfile0.posterous.com/getfile/files.posterous.com/temp-2012-02-02/mCumFErntdlyfrBmzfiEzrnIlGAelAEwnHouhoGtBskrgqskzcaJAEzHvDmz/Scabiosa_columbaria_Pink_Mist.jpeg.scaled1000.jpg"><img alt="Scabiosa_columbaria_pink_mist" height="485" src="http://getfile0.posterous.com/getfile/files.posterous.com/temp-2012-02-02/mCumFErntdlyfrBmzfiEzrnIlGAelAEwnHouhoGtBskrgqskzcaJAEzHvDmz/Scabiosa_columbaria_Pink_Mist.jpeg.scaled500.jpg" width="500" /></a> </div> </p> <p><span style="font-size: x-small;"><em>photo by Stan Shebs</em></span></p> <p>Consider the samovar. Throw a rock at a Russian novel from the nineteenth century and you'll hit a samovar. But none of my friends have a samovar. My dinner parties are sans samovar. A reader of Tolstoy might imagine a stone bowl or a statue sitting on the table in the place of a huge teapot. With a quick video, photo or diagram, with scale, the reader gets a much richer experience.</p> <p>The idea of all of this extracurricular information raises a lot of questions for literature. You could argue that the writer worked hard to make the language right, and should be able to control what information you get. It's a fair point, but on the other hand, if this was in 1985 and I was 13, I might have stopped reading, gone to my World Book Encyclopedia, and looked up the samovar anyway. So why not make the interruption quicker and maintain that immersion? When it comes to history, science, or really any kind of nonfiction, I see no possible valid objection. Anything to help visualize the world, the better. </p> <p>Again, we're going to use tools to get more information, so often the best thing is to make those tools unobtrusiveness of the tools. There's a lesson to be learned in developing any user experience that we should always ask ourselves what the user should be focusing on at any moment, and avoid excessive visual flare or unnecessary tech-complexity. Good user experience design should strive to provide depth and breadth when needed, but not at the expense of the story.</p> <p><em>—Scott Smith, Content Strategist</em></p> <p> </p> <p> </p> </p> <p><a href="http://blog.secondstory.com/97594276">Permalink</a> </p><img src="http://feeds.feedburner.com/~r/secondstory/~4/-X_7jDSvyUo" height="1" width="1"/> http://files.posterous.com/user_profile_pics/765707/scott_smith-2.jpg http://posterous.com/users/5BhyKAxz0Ii5 Scott Smith sholdensmith Scott Smith http://blog.secondstory.com/97594276 Tue, 31 Jan 2012 11:51:00 -0800 The Volumetric Society is meeting at Second Story http://feedproxy.google.com/~r/secondstory/~3/_1Zs8j8g9SA/the-volumetric-society-is-meeting-at-second-s http://blog.secondstory.com/the-volumetric-society-is-meeting-at-second-s <p> <p><a href="http://secondstory.com/">Second Story Interactive Studios</a> is hosting the first Volumetric Society meet-up in Portland. These are interesting times for the fields of depth-sensing and gesture-based technology and this is a great forum for anyone interested in discussing creative applications for such emerging technologies.</p> <p>The majority of the evening is open for attendees to share their stories building Kinect-based experiences. Second Story will share the approach to many of the Kinect and Xtion powered interactives we have done for recent projects, with a focus on multiple (depth camera) sensor fusion, camera calibration techniques, and real time point cloud meshing.</p> <p>The event will be staged in our media lab, where we’ll be running multiple Kinect based experiences and will also have a 3D volumetric display courtesy of our friends at <a href="http://www.julietzulu.us/">Juliet Zulu</a>.</p> <p><strong>Wednesday, February 15, 6 p.m.</strong></p> <p><strong>Second Story Interactive Studios</strong></p> <p><strong>714 N Fremont St # 200 / Portland, OR 97227</strong></p> <p><em>Updates + News tweeted from <a href="https://twitter.com/#!/2storypdx">@2storypdx</a>. Hashtag = #volumetric. </em></p> <p><iframe src="http://player.vimeo.com/video/29697782?portrait=0" frameborder="0" height="283" width="500"></iframe></p> <p><iframe src="http://player.vimeo.com/video/28746800?portrait=0" frameborder="0" height="283" width="500"></iframe></p> <p><iframe src="http://player.vimeo.com/video/34383179?portrait=0" frameborder="0" height="283" width="500"></iframe></p> <p><iframe src="http://player.vimeo.com/video/34379427?portrait=0" frameborder="0" height="283" width="500"></iframe></p> <p><iframe src="http://player.vimeo.com/video/18882843?portrait=0" frameborder="0" height="283" width="500"></iframe></p> <p> </p> </p> <p><a href="http://blog.secondstory.com/the-volumetric-society-is-meeting-at-second-s">Permalink</a> </p><img src="http://feeds.feedburner.com/~r/secondstory/~4/_1Zs8j8g9SA" height="1" width="1"/> http://files.posterous.com/user_profile_pics/762745/2storypdx.png http://posterous.com/users/5Al0rmDXf2UN Second Story Second Story Second Story http://blog.secondstory.com/the-volumetric-society-is-meeting-at-second-s Tue, 31 Jan 2012 11:31:31 -0800 Designing Dramaturgy http://feedproxy.google.com/~r/secondstory/~3/LSbemQMMaaA/designing-dramaturgy http://blog.secondstory.com/designing-dramaturgy <p> <div style="margin: 8px;"> <p><div class='p_embed p_image_embed'> <a href="http://getfile2.posterous.com/getfile/files.posterous.com/temp-2012-01-31/DsGdxpGGxEApEtGADtkIiJeordzDEcnhBkAxshwIHirtzccIdbcuccqDimlF/19-IMG_7635_treated.jpg.scaled1000.jpg"><img alt="19-img_7635_treated" height="333" src="http://getfile0.posterous.com/getfile/files.posterous.com/temp-2012-01-31/DsGdxpGGxEApEtGADtkIiJeordzDEcnhBkAxshwIHirtzccIdbcuccqDimlF/19-IMG_7635_treated.jpg.scaled500.jpg" width="500" /></a> </div> </p> <p>It's been just over a month since I traveled to Atlanta to help install 12 interactives for the new Vault of the Secret Formula at the World of Coca-Cola. I was deeply involved in this project for about eight months, and watched it grow from feverish conceptual conversations, to rudimentary proof of concept sketches and videos, to finished motion graphics pieces, interactive drawers, and even a 14-foot wide projection where I see myself as a full-body point cloud interacting with objects in virtual environments.</p> <p><div class='p_embed p_image_embed'> <a href="http://getfile6.posterous.com/getfile/files.posterous.com/temp-2012-01-31/kGgkIgmvyftklialnnGGlnzgjgjlBIdldzgtqwjHnGyDGjikugBtpsBAaDFi/16-IMG_7446.jpg.scaled1000.jpg"><img alt="16-img_7446" height="333" src="http://getfile4.posterous.com/getfile/files.posterous.com/temp-2012-01-31/kGgkIgmvyftklialnnGGlnzgjgjlBIdldzgtqwjHnGyDGjikugBtpsBAaDFi/16-IMG_7446.jpg.scaled500.jpg" width="500" /></a> </div> </p> <p>Along this journey, I worked with exhibit designers, interactive game developers, graphic novelists turned actors, filmmakers, sound designers, engineers, writers, brand marketing strategists, motion graphics gurus, and historians, all under a complete secrecy lock-down.</p> <p>Months of effort went into creating experiences that simply had no technical precedent in a public facility. Developers and engineers pushed the boundaries of off-the-shelf depth-sensing camera technology to bring visitors and original characters to life throughout the exhibit. In one unit, generative graphics and sound combine with physical design in a strange synesthesia where visitors turn dials to mix the perfect taste. Hidden cameras use face detection software to secretly snap visitors' images and display them instantly in a giant security grid. These cutting-edge experiences were combined with subtler sleights of hand, such as life-size character silhouettes, peep holes, and a digital update of the classic Pepper's Ghost illusion.</p> <p><div class='p_embed p_image_embed'> <a href="http://getfile0.posterous.com/getfile/files.posterous.com/temp-2012-01-31/oiDBzrbasvuljtfqcInJkcDiDfExdpavxgekqzIGxGDGCryzbhulFHxDFcfc/13-IMG_7516.jpg.scaled1000.jpg"><img alt="13-img_7516" height="319" src="http://getfile7.posterous.com/getfile/files.posterous.com/temp-2012-01-31/oiDBzrbasvuljtfqcInJkcDiDfExdpavxgekqzIGxGDGCryzbhulFHxDFcfc/13-IMG_7516.jpg.scaled500.jpg" width="500" /></a> </div> With so much going on, we had to think big-picture about the entire exhibit, weaving the double-helixes of history and reverence, intrigue and secrecy, fact and fiction throughout. Striking these balances meant keeping guests on their toes, unsure what would happen next, and creating a sense that their very presence was the key to unlocking the secret. Like the <a href="http://vimeo.com/35591174" target="_blank">interactive alumni center</a> we created for the University of Oregon, The Vault of the Secret Formula at the World of Coca-Cola was an exercise in dramaturgy. In this context, I mean the conceptualization and creation of a visitor experience across multiple interactives using different technologies, each building upon the next, and working as a whole to deliver the core messages.</p> <p><span style="font-family: Verdana;"><span style="font-size: 12px; line-height: 13px;"><div class='p_embed p_image_embed'> <a href="http://getfile0.posterous.com/getfile/files.posterous.com/temp-2012-01-31/bFjwdreelhAbAbxeansaDxoipxFtrpnroHJChloDraqbceBCoohadgAuerpw/11-IMG_7558.jpg.scaled1000.jpg"><img alt="11-img_7558" height="333" src="http://getfile3.posterous.com/getfile/files.posterous.com/temp-2012-01-31/bFjwdreelhAbAbxeansaDxoipxFtrpnroHJChloDraqbceBCoohadgAuerpw/11-IMG_7558.jpg.scaled500.jpg" width="500" /></a> </div> </span></span></p> <p>Rather than designing discrete experiences which simply give visitors a quick fix of excitement, or "wow moments" with no context or story arc, Second Story carefully considered how each interactive experience served the core objective - increasing the magic and intrigue of Coca-Cola's secret formula. We thought spatially about visitor traffic flow, how different vantage points would reveal new media in the exhibit space, and even created experiences that reward visitors with surprise content if they dwell a bit longer. As folks move through the new exhibit, the sense of intrigue builds, the design vernacular continues to unfold, and visitors become increasingly immersed and integral to the experiences themselves.</p> <p><span style="font-family: Verdana;"><span style="font-size: 12px; line-height: 13px;"><div class='p_embed p_image_embed'> <a href="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2012-01-31/ewsxAwhBovldskffuutFzgcFoFEfhhkkxvsIxsGCgbhlxhmkCpJqahCjyoGp/15-IMG_7640.jpg.scaled1000.jpg"><img alt="15-img_7640" height="399" src="http://getfile2.posterous.com/getfile/files.posterous.com/temp-2012-01-31/ewsxAwhBovldskffuutFzgcFoFEfhhkkxvsIxsGCgbhlxhmkCpJqahCjyoGp/15-IMG_7640.jpg.scaled500.jpg" width="500" /></a> </div> </span></span></p> <p style=""><span style="font-family: Verdana;"><span style="font-size: 12px;"> </span></span></p> <p>To me, dramaturgy means you don't just design pretty trains, you also design the tracks they run on. You build new technological experiences and great design on top of strong underlying narrative structures that give them meaning and depth beyond one cursory glance or touch. Projects like The Vault of the Secret Formula continue to challenge Second Story to bring our greatest strength to the table - envisioning interactive experiences and environmental spaces as new paradigms for great storytelling where each interactive, media-rich experience is orchestrated into a thoughtful, greater whole.</p> <p>—David Waingarten, <em>Content Ninja</em></p> <p><em>If you’d like to witness this project in full, you can see details about <a href="http://secondstory.com/project/vault-of-the-secret-formula" target="_blank">Vault of the Secret Formula</a> on our portfolio page. Also, here’s a demo video that shows the interactives in action…</em></p> <p><iframe allowfullscreen="true" src="http://player.vimeo.com/video/34592058?title=0&byline=0&portrait=0&color=d6a34b" frameborder="0" height="248" width="440"></iframe></p> </div> </p> <p><a href="http://blog.secondstory.com/designing-dramaturgy">Permalink</a> </p><img src="http://feeds.feedburner.com/~r/secondstory/~4/LSbemQMMaaA" height="1" width="1"/> http://posterous.com/images/profile/missing-user-75.png http://posterous.com/users/heOV4X2pcmPdE davidwaingarten davidwaingarten davidwaingarten http://blog.secondstory.com/designing-dramaturgy Wed, 18 Jan 2012 18:02:29 -0800 Best Interactive Technologies from CES 2012 http://feedproxy.google.com/~r/secondstory/~3/zDDZ_D2gM5I/best-interactive-technologies-from-ces-2012 http://blog.secondstory.com/best-interactive-technologies-from-ces-2012 <p> <p><em>Engineer Matt Arnold attended CES 2012 and returned with a briefcase full of interesting impressions, which he shared with the studio this week. Here’s a list of the most promising interactive technologies he experienced at the conference.</em></p> <p><div class='p_embed p_image_embed'> <a href="http://getfile8.posterous.com/getfile/files.posterous.com/temp-2012-01-18/shfpDfkzcadbxujAqidpBtpokuhBcxgeahekawhocBrnEercCwJopagqbAoc/CES_sign.png.scaled1000.png"><img alt="Ces_sign" height="291" src="http://getfile6.posterous.com/getfile/files.posterous.com/temp-2012-01-18/shfpDfkzcadbxujAqidpBtpokuhBcxgeahekawhocBrnEercCwJopagqbAoc/CES_sign.png.scaled500.png" width="500" /></a> </div> </p> <p><strong>3M Multitouch Displays.</strong> Excited about the product demonstrations that <a href="http://solutions.3m.com/wps/portal/3M/en_US/TouchSystems/TouchScreen/">3M</a> brought to the show—especially the 27 inch multitouch screen. In addition to the usual 3M projected capacitive touch technology (one of our favorites), this new display features bonded glass for an improved picture, higher resolution screen (2560x1440) and the promise of a powerful touch API from <a href="http://www.mosaiqq.com/">Mosaiqq</a>. </p> <p><div class='p_embed p_image_embed'> <img alt="3m_27in_touch_proto" height="293" src="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2012-01-18/AhFhjmunxvHtcFgcFFgmFFDyxhIDmloykHuoFaFiqhxAfzkgljCpfrDBusAh/3m_27in_touch_proto.png.scaled500.png" width="400" /> </div> </p> <p><strong>Samsung SUR40 (Microsoft Surface 2).</strong> Samsung’s <a href="http://www.samsunglfd.com/product/spec.do?modelCd=SUR40">SUR40</a> holds great promise with a completely new way of sensing touch and featuring some of the best multitouch sensitivity we’ve seen to date. Now those on-screen keyboards are starting to make sense. But will it perform as promised?</p> <p><div class='p_embed p_image_embed'> <a href="http://getfile1.posterous.com/getfile/files.posterous.com/temp-2012-01-18/obbonmGuwGeqmrjvuymdyEhufJIueEhAqiryqrcpJlnDBbIlcavIzcrJEIci/surface_img.png.scaled1000.png"><img alt="Surface_img" height="343" src="http://getfile4.posterous.com/getfile/files.posterous.com/temp-2012-01-18/obbonmGuwGeqmrjvuymdyEhufJIueEhAqiryqrcpJlnDBbIlcavIzcrJEIci/surface_img.png.scaled500.png" width="500" /></a> </div> </p> <p><strong>MultiTaction Cell 55”.</strong> MultiTouch brought their new <a href="http://multitouch.fi/products/">55” MultiTaction Cells</a> for everyone to play with. We love that size—now we can fit four people comfortably around a table without bezels! Let’s not forget to take note of the fact that their multitouch display worked well under the house lights in the exhibit area unlike some of the other technologies we saw!</p> <p><div class='p_embed p_image_embed'> <a href="http://getfile7.posterous.com/getfile/files.posterous.com/temp-2012-01-18/uFBCBfrpGGJdvtbccbBlHDGcidvlkrDJotbibwBHhgpntvavtwgHgGzvbcpt/multitouch_cel55.png.scaled1000.png"><img alt="Multitouch_cel55" height="375" src="http://getfile8.posterous.com/getfile/files.posterous.com/temp-2012-01-18/uFBCBfrpGGJdvtbccbBlHDGcidvlkrDJotbibwBHhgpntvavtwgHgGzvbcpt/multitouch_cel55.png.scaled500.png" width="500" /></a> </div> </p> <p><strong>OLED Displays.</strong> It was hard to miss the 55” OLED display technology displayed at both the LG and Samsung booth’s which stole the show with jaw dropping colors, brightness and viewing angles. Can’t wait to make a tiled wall out of these!</p> <p><div class='p_embed p_image_embed'> <a href="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2012-01-18/wbojuEgiFvqpjCxDasCvphbvkxjkmkCHpswuszsrnEcBkHwxvlczIxbyJFAt/OLED_sm.jpg.scaled1000.jpg"><img alt="Oled_sm" height="414" src="http://getfile2.posterous.com/getfile/files.posterous.com/temp-2012-01-18/wbojuEgiFvqpjCxDasCvphbvkxjkmkCHpswuszsrnEcBkHwxvlczIxbyJFAt/OLED_sm.jpg.scaled500.jpg" width="500" /></a> </div> </p> <p><strong>Connect to Life.</strong> Really enjoyed playing with <a href="http://stimulant.io/">Stimulant’s</a> <a href="http://stimulant.io/wp/index.php/blog/2012/01/intels-connect-to-life-experience-at-ces-2012/">“Connect to Life Experience”</a> incorporated into Intel’s booth. What’s not to like about creating your own microbes?</p> <p><div class='p_embed p_image_embed'> <img alt="Amoebas1" height="250" src="http://getfile1.posterous.com/getfile/files.posterous.com/temp-2012-01-18/xCwHgDzBeszpDsIiaaoGHCpCfkpxoBlChHznHiuAeuhDuhxttyIsIFJirrFF/amoebas1.png.scaled500.png" width="400" /> </div> <div class='p_embed p_image_embed'> <img alt="Amoebas2" height="259" src="http://getfile0.posterous.com/getfile/files.posterous.com/temp-2012-01-18/ihBkmFvFwumFHBeuACuiEeAJurxfaolspqEcuaFteIsvEssHazubBwIftixb/amoebas2.png.scaled500.png" width="400" /> </div> </p> </p> <p><a href="http://blog.secondstory.com/best-interactive-technologies-from-ces-2012">Permalink</a> </p><img src="http://feeds.feedburner.com/~r/secondstory/~4/zDDZ_D2gM5I" height="1" width="1"/> http://files.posterous.com/user_profile_pics/762745/2storypdx.png http://posterous.com/users/5Al0rmDXf2UN Second Story Second Story Second Story http://blog.secondstory.com/best-interactive-technologies-from-ces-2012 Thu, 08 Dec 2011 14:47:23 -0800 The Vault of the Secret Formula http://feedproxy.google.com/~r/secondstory/~3/TljO9thR1TU/the-vault-of-the-secret-formula http://blog.secondstory.com/the-vault-of-the-secret-formula <p> <p><span style="font-family: Verdana, sans-serif;"><span style="font-size: 12px;">Earlier today, December 8th, 2011, the Chairman of the Board of Coca-Cola unveiled the opening of The Vault of the Secret Formula at the World of Coca-Cola in Atlanta, GA. Mythology and intrigue fill the experience as visitors take a journey through the history of one of the world's most famous trade secrets—the secret formula of Coca-Cola. Our team has been on the ground this past week, polishing the chrome on a suite of thirteen media experiences. Here is a peek inside the opening of The Vault of the Secret Formula exhibit—we’ll have more details on the project soon. A big thank you to our clients at World of Coca-Cola, to the amazing team here at Second Story that made this happen, and to all the project partners: Donna Lawrence Productions, Gallagher & Associates, Electrosonic, Romeantics, Available Light, Lexington, and New South.</span></span></p> <p><span style="font-family: Verdana, sans-serif;"><span style="font-size: 12px;"><div class='p_embed p_image_embed'> <a href="http://getfile0.posterous.com/getfile/files.posterous.com/temp-2011-12-08/ofoyJefqaBhoGcuGzExvdJneCguIoopbiqCjsfgsJfBxCmwlzFHGobfoFsqx/vault-10.jpg.scaled1000.jpg"><img alt="Vault-10" height="333" src="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2011-12-08/ofoyJefqaBhoGcuGzExvdJneCguIoopbiqCjsfgsJfBxCmwlzFHGobfoFsqx/vault-10.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile2.posterous.com/getfile/files.posterous.com/temp-2011-12-08/fgqEjguhmDrgeqrpsJjdsCqbctmjBcuFnzaGnJGBsnflcJhlyHyzICepjkac/vault-11.jpg.scaled1000.jpg"><img alt="Vault-11" height="333" src="http://getfile7.posterous.com/getfile/files.posterous.com/temp-2011-12-08/fgqEjguhmDrgeqrpsJjdsCqbctmjBcuFnzaGnJGBsnflcJhlyHyzICepjkac/vault-11.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile5.posterous.com/getfile/files.posterous.com/temp-2011-12-08/jkgiHkwdCdbcjBCeJqbBIvkEFxsaynqogzjybfImnauxzgBgssiywlmEIiAG/vault-12.jpg.scaled1000.jpg"><img alt="Vault-12" height="333" src="http://getfile3.posterous.com/getfile/files.posterous.com/temp-2011-12-08/jkgiHkwdCdbcjBCeJqbBIvkEFxsaynqogzjybfImnauxzgBgssiywlmEIiAG/vault-12.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile1.posterous.com/getfile/files.posterous.com/temp-2011-12-08/bwxHkjrlkoeaoeBrcxaJJjyhxhrJCcAzFyFBaplDHDqJDcezpHxaCmhknaxb/vault-13.jpg.scaled1000.jpg"><img alt="Vault-13" height="333" src="http://getfile8.posterous.com/getfile/files.posterous.com/temp-2011-12-08/bwxHkjrlkoeaoeBrcxaJJjyhxhrJCcAzFyFBaplDHDqJDcezpHxaCmhknaxb/vault-13.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile2.posterous.com/getfile/files.posterous.com/temp-2011-12-08/bumiFCctpACCtvGlhmGrBntakJCxmbktuECycdrwufcbbecttvzIyCIkaiGs/vault-14.jpg.scaled1000.jpg"><img alt="Vault-14" height="333" src="http://getfile0.posterous.com/getfile/files.posterous.com/temp-2011-12-08/bumiFCctpACCtvGlhmGrBntakJCxmbktuECycdrwufcbbecttvzIyCIkaiGs/vault-14.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile7.posterous.com/getfile/files.posterous.com/temp-2011-12-08/JHjFgsAjdnGruwulAFpeeibaJJCdxyiIsjAcrwzeunDzBAzolAzveIgBAAda/vault-15.jpg.scaled1000.jpg"><img alt="Vault-15" height="333" src="http://getfile5.posterous.com/getfile/files.posterous.com/temp-2011-12-08/JHjFgsAjdnGruwulAFpeeibaJJCdxyiIsjAcrwzeunDzBAzolAzveIgBAAda/vault-15.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile5.posterous.com/getfile/files.posterous.com/temp-2011-12-08/ofzsfvvAoGFljkwdttgfBafDxxuqhpCwCdaorHzhsowmFEEDeupoHqlpEatw/vault-16.jpg.scaled1000.jpg"><img alt="Vault-16" height="333" src="http://getfile4.posterous.com/getfile/files.posterous.com/temp-2011-12-08/ofzsfvvAoGFljkwdttgfBafDxxuqhpCwCdaorHzhsowmFEEDeupoHqlpEatw/vault-16.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2011-12-08/xujpHnjDoiJiCIIGeqnktEHJrecvkCfjwtxsxmrrjdIifHGabuaxxovixBHB/vault-17.jpg.scaled1000.jpg"><img alt="Vault-17" height="333" src="http://getfile3.posterous.com/getfile/files.posterous.com/temp-2011-12-08/xujpHnjDoiJiCIIGeqnktEHJrecvkCfjwtxsxmrrjdIifHGabuaxxovixBHB/vault-17.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile5.posterous.com/getfile/files.posterous.com/temp-2011-12-08/fyfmoxnwbfHHFAIstbkeJHnatiqzwjEtezznIsfiGbeFeyqeHlJnHIgbJBJC/vault-18.jpg.scaled1000.jpg"><img alt="Vault-18" height="750" src="http://getfile5.posterous.com/getfile/files.posterous.com/temp-2011-12-08/fyfmoxnwbfHHFAIstbkeJHnatiqzwjEtezznIsfiGbeFeyqeHlJnHIgbJBJC/vault-18.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile8.posterous.com/getfile/files.posterous.com/temp-2011-12-08/DBekhmDdgfnmjcIHkCGwbBpnoJItDfClsBoFyGIzooAcpAxBGeEpBbpnCjFB/vault-19.jpg.scaled1000.jpg"><img alt="Vault-19" height="333" src="http://getfile4.posterous.com/getfile/files.posterous.com/temp-2011-12-08/DBekhmDdgfnmjcIHkCGwbBpnoJItDfClsBoFyGIzooAcpAxBGeEpBbpnCjFB/vault-19.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile1.posterous.com/getfile/files.posterous.com/temp-2011-12-08/zeqGpvAddByxfEHetnqdqstmDCseBbvnJiDeIbkjDxCDCwjzGIsCqwvhoDgF/vault-20.jpg.scaled1000.jpg"><img alt="Vault-20" height="333" src="http://getfile7.posterous.com/getfile/files.posterous.com/temp-2011-12-08/zeqGpvAddByxfEHetnqdqstmDCseBbvnJiDeIbkjDxCDCwjzGIsCqwvhoDgF/vault-20.jpg.scaled500.jpg" width="500" /></a> <div class='p_see_full_gallery'><a href="http://blog.secondstory.com/the-vault-of-the-secret-formula">See the full gallery on Posterous</a></div> </div> <div class='p_embed p_image_embed'> <a href="http://getfile5.posterous.com/getfile/files.posterous.com/temp-2011-12-08/HzlscoceoAEbxCbBipdHnezuCCGhCblympjfrrAkprEkIkkvuihhEqBvJCvH/vault-21.jpg.scaled1000.jpg"><img alt="Vault-21" height="333" src="http://getfile8.posterous.com/getfile/files.posterous.com/temp-2011-12-08/HzlscoceoAEbxCbBipdHnezuCCGhCblympjfrrAkprEkIkkvuihhEqBvJCvH/vault-21.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile0.posterous.com/getfile/files.posterous.com/temp-2011-12-08/BhuccvqmyJjnbrphhDofJwbAkCJrJptbqeAyBpaimdGeyvEdshuBrHacgqDD/vault-22.jpg.scaled1000.jpg"><img alt="Vault-22" height="333" src="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2011-12-08/BhuccvqmyJjnbrphhDofJwbAkCJrJptbqeAyBpaimdGeyvEdshuBrHacgqDD/vault-22.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile3.posterous.com/getfile/files.posterous.com/temp-2011-12-08/vnIEAddIcgjJnDhCdIsrpCalflwzdlonJvGncbfeqiltpnukHiJIyDwlkekl/vault-23.jpg.scaled1000.jpg"><img alt="Vault-23" height="333" src="http://getfile8.posterous.com/getfile/files.posterous.com/temp-2011-12-08/vnIEAddIcgjJnDhCdIsrpCalflwzdlonJvGncbfeqiltpnukHiJIyDwlkekl/vault-23.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2011-12-08/DiCAEmxqnBtFiCJDpacEBHfgmqzhpdBfdIymsmscbffpGbyacCaqdAfIplzd/vault-24.jpg.scaled1000.jpg"><img alt="Vault-24" height="333" src="http://getfile3.posterous.com/getfile/files.posterous.com/temp-2011-12-08/DiCAEmxqnBtFiCJDpacEBHfgmqzhpdBfdIymsmscbffpGbyacCaqdAfIplzd/vault-24.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile1.posterous.com/getfile/files.posterous.com/temp-2011-12-08/iDCHtlIjGzmGuGeszxEyxlqnAGEznsbyopgesplIHvAlDHEmAitIlrymaBkq/vault-25.jpg.scaled1000.jpg"><img alt="Vault-25" height="333" src="http://getfile8.posterous.com/getfile/files.posterous.com/temp-2011-12-08/iDCHtlIjGzmGuGeszxEyxlqnAGEznsbyopgesplIHvAlDHEmAitIlrymaBkq/vault-25.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2011-12-08/hDBkGGjejsnHilJnyizuzuirHzuvEgDagksfeppxtuCJoghbaDnnifiwtofF/vault-26.jpg.scaled1000.jpg"><img alt="Vault-26" height="333" src="http://getfile7.posterous.com/getfile/files.posterous.com/temp-2011-12-08/hDBkGGjejsnHilJnyizuzuirHzuvEgDagksfeppxtuCJoghbaDnnifiwtofF/vault-26.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile5.posterous.com/getfile/files.posterous.com/temp-2011-12-08/aGDHehHkqFDaqoswvaIuywIrfxtphBgCnfdHknqudGgxcfsygwpbjtuzAlwz/vault-27.jpg.scaled1000.jpg"><img alt="Vault-27" height="333" src="http://getfile1.posterous.com/getfile/files.posterous.com/temp-2011-12-08/aGDHehHkqFDaqoswvaIuywIrfxtphBgCnfdHknqudGgxcfsygwpbjtuzAlwz/vault-27.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile7.posterous.com/getfile/files.posterous.com/temp-2011-12-08/qriBujhmnaunlxblHBGCykDflbkqzeedJEhdvJceexGiqnEGItuDnjhholIk/vault-28.jpg.scaled1000.jpg"><img alt="Vault-28" height="333" src="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2011-12-08/qriBujhmnaunlxblHBGCykDflbkqzeedJEhdvJceexGiqnEGItuDnjhholIk/vault-28.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile0.posterous.com/getfile/files.posterous.com/temp-2011-12-08/EqjwoHFpmGgCtqkAqIrkjajhjsbredzkcawGDJxztaeBGgilzzciJazIIrhd/vault-29.jpg.scaled1000.jpg"><img alt="Vault-29" height="333" src="http://getfile2.posterous.com/getfile/files.posterous.com/temp-2011-12-08/EqjwoHFpmGgCtqkAqIrkjajhjsbredzkcawGDJxztaeBGgilzzciJazIIrhd/vault-29.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile8.posterous.com/getfile/files.posterous.com/temp-2011-12-08/lkwIxjqsBDoBCwjFvHklfsGhrtvzmobotogFAuJpeDpFhzmiAmJEFGwnjpaF/vault-30.jpg.scaled1000.jpg"><img alt="Vault-30" height="333" src="http://getfile6.posterous.com/getfile/files.posterous.com/temp-2011-12-08/lkwIxjqsBDoBCwjFvHklfsGhrtvzmobotogFAuJpeDpFhzmiAmJEFGwnjpaF/vault-30.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile9.posterous.com/getfile/files.posterous.com/temp-2011-12-08/vJccFBhkzjHdlEcwfgFJwaaAprxfIpfltzAHtgmpHndDvupukktHBBcgEbzC/vault-31.jpg.scaled1000.jpg"><img alt="Vault-31" height="333" src="http://getfile3.posterous.com/getfile/files.posterous.com/temp-2011-12-08/vJccFBhkzjHdlEcwfgFJwaaAprxfIpfltzAHtgmpHndDvupukktHBBcgEbzC/vault-31.jpg.scaled500.jpg" width="500" /></a> <div class='p_see_full_gallery'><a href="http://blog.secondstory.com/the-vault-of-the-secret-formula">See the full gallery on Posterous</a></div> </div> <br /></span></span></p> </p> <p><a href="http://blog.secondstory.com/the-vault-of-the-secret-formula">Permalink</a> </p><img src="http://feeds.feedburner.com/~r/secondstory/~4/TljO9thR1TU" height="1" width="1"/> http://files.posterous.com/user_profile_pics/762745/2storypdx.png http://posterous.com/users/5Al0rmDXf2UN Second Story Second Story Second Story http://blog.secondstory.com/the-vault-of-the-secret-formula Fri, 02 Dec 2011 15:29:40 -0800 Design for Humanity: A Visit from Studio H http://feedproxy.google.com/~r/secondstory/~3/tM9e2g1lecU/design-for-humanity-a-visit-from-studio-h http://blog.secondstory.com/design-for-humanity-a-visit-from-studio-h <p> <p>Emily Pilloton, of North Carolina based <a href="http://www.studio-h.org/">Studio H</a> visited the studio today to share some of her socially-engaged design work. Studio H is a design/build program that Emily created for a rural high school in Bertie County, NC, the poorest and most sparsely populated county in the state. Using design thinking, as well as hands-on construction skills, Emily and her partner Matthew Miller collaborate with their high school students on architecture and design projects. She shared an inspiring story of how her class evolved from creating a simple design for a cornhole game to building a fully functioning, 2,000 square foot farmer's market for their community. They also built a series of inventive chicken coops with names like Chicktopia, Chicken Circus and Coopus Maximus (inspired by Buckminster Fuller). The story of Studio H is filled with boundless imagination and endless challenges; their work is currently on exhibit at the <a href="http://museumofcontemporarycraft.org/">Museum of Contemporary Craft</a> in downtown Portland. Here are a few images from the presentation and a promo video they put together. </p> <p><div class='p_embed p_image_embed'> <a href="http://getfile5.posterous.com/getfile/files.posterous.com/temp-2011-12-02/EDuyjwxBpEzAgntwBuAwstnIjkFgtshDkjyiBFHwcbqzunrEcvAqIHCgscCi/IMG_0778.jpg.scaled1000.jpg"><img alt="Img_0778" height="333" src="http://getfile1.posterous.com/getfile/files.posterous.com/temp-2011-12-02/EDuyjwxBpEzAgntwBuAwstnIjkFgtshDkjyiBFHwcbqzunrEcvAqIHCgscCi/IMG_0778.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile5.posterous.com/getfile/files.posterous.com/temp-2011-12-02/muJuBntBegnJEzDDyewgFJIjFiGbrfidhfzvHGIIGBIJJtGbnAnyDdqwBazJ/IMG_0811.jpg.scaled1000.jpg"><img alt="Img_0811" height="398" src="http://getfile6.posterous.com/getfile/files.posterous.com/temp-2011-12-02/muJuBntBegnJEzDDyewgFJIjFiGbrfidhfzvHGIIGBIJJtGbnAnyDdqwBazJ/IMG_0811.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile5.posterous.com/getfile/files.posterous.com/temp-2011-12-02/irBthJpoFjbqAgdDDEordzfwofuctwpkscGfqdeCIuvkedkuHbkeowcACmqj/IMG_0827.jpg.scaled1000.jpg"><img alt="Img_0827" height="333" src="http://getfile8.posterous.com/getfile/files.posterous.com/temp-2011-12-02/irBthJpoFjbqAgdDDEordzfwofuctwpkscGfqdeCIuvkedkuHbkeowcACmqj/IMG_0827.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile3.posterous.com/getfile/files.posterous.com/temp-2011-12-02/rvhymnrrjvnlGwwtCHtkgmiEhykkuwmfnjgBmcJhyADbtotpvJBsnkxfevjy/IMG_0806.jpg.scaled1000.jpg"><img alt="Img_0806" height="285" src="http://getfile4.posterous.com/getfile/files.posterous.com/temp-2011-12-02/rvhymnrrjvnlGwwtCHtkgmiEhykkuwmfnjgBmcJhyADbtotpvJBsnkxfevjy/IMG_0806.jpg.scaled500.jpg" width="500" /></a> <a href="http://getfile0.posterous.com/getfile/files.posterous.com/temp-2011-12-02/EHommshypaictweuEuajgpnbzIleBwIulmwuFudBIAFzaIkwEDfuqAizdFFq/IMG_0875.jpg.scaled1000.jpg"><img alt="Img_0875" height="750" src="http://getfile7.posterous.com/getfile/files.posterous.com/temp-2011-12-02/EHommshypaictweuEuajgpnbzIleBwIulmwuFudBIAFzaIkwEDfuqAizdFFq/IMG_0875.jpg.scaled500.jpg" width="500" /></a> <div class='p_see_full_gallery'><a href="http://blog.secondstory.com/design-for-humanity-a-visit-from-studio-h">See the full gallery on Posterous</a></div> </div> </p> <p><iframe allowfullscreen="true" src="http://player.vimeo.com/video/17342591?title=0&byline=0&portrait=0" frameborder="0" height="225" width="400"></iframe></p> <p><span style="font-size: 8.0pt; line-height: 115%; font-family: Verdana,sans-serif;">—</span>Michael Neault, <em>Content Producer</em></p> </p> <p><a href="http://blog.secondstory.com/design-for-humanity-a-visit-from-studio-h">Permalink</a> </p><img src="http://feeds.feedburner.com/~r/secondstory/~4/tM9e2g1lecU" height="1" width="1"/> http://files.posterous.com/user_profile_pics/762745/2storypdx.png http://posterous.com/users/5Al0rmDXf2UN Second Story Second Story Second Story http://blog.secondstory.com/design-for-humanity-a-visit-from-studio-h