<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Tools for Sketching &#187; Web</title>
	<atom:link href="http://www.poxod.cc/blog/category/web/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.poxod.cc/blog</link>
	<description>A catalog of tools, research and products that empower creative visual communication.</description>
	<lastBuildDate>Fri, 25 Jun 2010 00:01:25 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.8.6</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Code-free iPhone interaction prototype</title>
		<link>http://www.poxod.cc/blog/2010/06/17/touchosc/</link>
		<comments>http://www.poxod.cc/blog/2010/06/17/touchosc/#comments</comments>
		<pubDate>Fri, 18 Jun 2010 02:32:07 +0000</pubDate>
		<dc:creator>cc</dc:creator>
				<category><![CDATA[Data]]></category>
		<category><![CDATA[Motion]]></category>
		<category><![CDATA[Web]]></category>
		<category><![CDATA[product]]></category>

		<guid isPermaLink="false">http://www.poxod.cc/blog/?p=157</guid>
		<description><![CDATA[Have you ever found yourself wanting to prototype a simple, realtime interaction between an iPhone and another piece of hardware, [...]


<div id="related">
<h3>Related Posts</h3>
<ul>
		<a href="http://www.poxod.cc/blog/2010/01/13/twist-your-presentation-like-a-prezi/" rel="bookmark">
	<li>
	
Twist your presentation like a Prezi!<!-- (3)-->
	
<small>
Prezi is a Hungarian startup that has developed a tool to empower people to make stunning visual presentations using text [...]
</small>
	</li></a>
		<a href="http://www.poxod.cc/blog/2009/11/16/73/" rel="bookmark">
	<li>
	
Why Wiggly Wireframes?<!-- (2)-->
	
<small>
Aaron Travis explores the motivation and payoff for developing low-fidelity wireframes for user interfaces during the design process. While I [...]
</small>
	</li></a>
		<a href="http://www.poxod.cc/blog/2006/06/15/ceos-design-meeting-wet-dream/" rel="bookmark">
	<li>
	
Dynamic Physical Rendering<!-- (2)-->
	
<small>
Check out this video. It&#8217;s a concept video that ETC students produced to demonstrate applications for Dynamic Physical Rendering, an [...]
</small>
	</li></a>
	</ul>
</div>]]></description>
			<content:encoded><![CDATA[<p><img src="http://www.poxod.cc/blog/wp-content/uploads/2010/06/touchosc-screen.jpg" alt="TouchOSC screenshot" title="TouchOSC screenshot" width="249" height="450" class="alignleft size-full wp-image-260" />Have you ever found yourself wanting to prototype a simple, realtime interaction between an iPhone and another piece of hardware, but don&#8217;t have time to learn iPhone programming? <a href="http://hexler.net/software/touchosc">TouchOSC</a> provides a simple solution to this challenge. An iPhone app that communicates over wifi using <a href="http://opensoundcontrol.org/introduction-osc" target="_blank">Open Sound Control</a>, TouchOSC allows you to control any kind of application that accepts OSC messages.</p>
<p>TouchOSC also includes a companion layout editor. This free desktop application allows you to define custom screen layouts of UI elements and then upload them to your iPhone. Unfortunately there are only a limited number of UI widgets, and because the software was designed to control realtime sound apps, they naturally tend toward realtime control- knobs, faders and toggles as opposed to forms, dropdowns and checkboxes of more rich interfaces. Still, if all you need is a few buttons and a slider to control an interactive system and you aren&#8217;t able to develop a native iPhone app, TouchOSC offers some enticing potential. See below the jump for some examples of unexpected uses.<br />
<span id="more-157"></span><br />
This guy uses TouchOSC to control a robot!<br />
<object width="480" height="385"><param name="movie" value="http://www.youtube.com/v/TTQRz5NVNoc&#038;hl=en_US&#038;fs=1&#038;"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/TTQRz5NVNoc&#038;hl=en_US&#038;fs=1&#038;" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="385"></embed></object></p>
<p>You can even access the iPhone&#8217;s accelerometer and send that data over OSC (<strong>warning</strong>:video has loud sound).<br />
<object width="480" height="335"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=3506416&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=&amp;fullscreen=1" /><embed src="http://vimeo.com/moogaloop.swf?clip_id=3506416&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=&amp;fullscreen=1" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="480" height="335"></embed></object>
<p><a href="http://vimeo.com/3506416">osc, processing and an iphone accelerometer</a> from <a href="http://vimeo.com/user1314606">codingnature</a> on <a href="http://vimeo.com">Vimeo</a>.</p>
<p>If you&#8217;re using Flash, I recommend <a href="http://www.benchun.net/flosc/">flosc</a> for parsing and sending/receiving messages. There are many resources out the for using OSC with Python, Processing and a variety of software packages. So build you UI, teach your software prototype to speak OSC and you&#8217;re set!</p>
<p><a href="http://hexler.net/software/touchosc">TouchOSC homepage</a><br />
<a href="http://itunes.apple.com/us/app/touchosc/id288120394?mt=8">TouchOSC @ iTunes Store</a></p>



<div id="related">
<h3>Related Posts</h3>
<ul>
		<a href="http://www.poxod.cc/blog/2010/01/13/twist-your-presentation-like-a-prezi/" rel="bookmark">
	<li>
	<p>Twist your presentation like a Prezi!<!-- (3)--></p>
	<p><small><p>Prezi is a Hungarian startup that has developed a tool to empower people to make stunning visual presentations using text [...]</p>
</small></p>
	</li></a>
		<a href="http://www.poxod.cc/blog/2009/11/16/73/" rel="bookmark">
	<li>
	<p>Why Wiggly Wireframes?<!-- (2)--></p>
	<p><small><p>Aaron Travis explores the motivation and payoff for developing low-fidelity wireframes for user interfaces during the design process. While I [...]</p>
</small></p>
	</li></a>
		<a href="http://www.poxod.cc/blog/2006/06/15/ceos-design-meeting-wet-dream/" rel="bookmark">
	<li>
	<p>Dynamic Physical Rendering<!-- (2)--></p>
	<p><small><p>Check out this video. It&#8217;s a concept video that ETC students produced to demonstrate applications for Dynamic Physical Rendering, an [...]</p>
</small></p>
	</li></a>
	</ul>
</div>]]></content:encoded>
			<wfw:commentRss>http://www.poxod.cc/blog/2010/06/17/touchosc/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Why Wiggly Wireframes?</title>
		<link>http://www.poxod.cc/blog/2009/11/16/73/</link>
		<comments>http://www.poxod.cc/blog/2009/11/16/73/#comments</comments>
		<pubDate>Tue, 17 Nov 2009 01:02:27 +0000</pubDate>
		<dc:creator>cc</dc:creator>
				<category><![CDATA[Data]]></category>
		<category><![CDATA[Featured]]></category>
		<category><![CDATA[Web]]></category>
		<category><![CDATA[process]]></category>

		<guid isPermaLink="false">http://www.poxod.cc/blog/?p=73</guid>
		<description><![CDATA[Aaron Travis explores the motivation and payoff for developing low-fidelity wireframes for user interfaces during the design process. While I [...]


<div id="related">
<h3>Related Posts</h3>
<ul>
		<a href="http://www.poxod.cc/blog/2010/06/17/touchosc/" rel="bookmark">
	<li>
	
Code-free iPhone interaction prototype<!-- (2)-->
	
<small>
Have you ever found yourself wanting to prototype a simple, realtime interaction between an iPhone and another piece of hardware, [...]
</small>
	</li></a>
		<a href="http://www.poxod.cc/blog/2007/05/24/using-comics-to-describe-user-experience/" rel="bookmark">
	<li>
	
Using Comics to Describe User Experience<!-- (2)-->
	
<small>
An excellent article appears today on Boxes and Arrows. It gives an overview of the benefits of using a narrative [...]
</small>
	</li></a>
		<a href="http://www.poxod.cc/blog/2006/08/02/dtools-plug-and-play-hardware-prototyping/" rel="bookmark">
	<li>
	
Plug and Play Hardware Prototyping<!-- (2)-->
	
<small>
d.tools is a combination hardware and software system that makes prototyping hardware interfaces fast and easy. With it, inexperienced test [...]
</small>
	</li></a>
	</ul>
</div>]]></description>
			<content:encoded><![CDATA[<p><img src="http://www.poxod.cc/blog/wp-content/uploads/2009/11/1_Travis_Sketchy_Visio-cropped.gif" alt="Sketchy Wireframe" title="Sketchy Wireframe" width="336" height="208" class="alignleft size-full wp-image-78" /><a target="_blank" href="http://www.boxesandarrows.com/view/sketchy-wireframes?utm_source=feedburner&#038;utm_medium=feed&#038;utm_campaign=Feed%3A+BoxesAndArrows_Stories+%28Boxes+and+Arrows%29">Aaron Travis explores</a> the motivation and payoff for developing low-fidelity wireframes for user interfaces during the design process. While I have my own reasons for loving all things lo-fi, this (web-specific) article really nails it. Their rationales are clearly thought out and expressed in a way that make them relevant to a wide variety of disciplines.</p>
<p>Read More for excerpts<br />
<span id="more-73"></span></p>
<div style="clear:both;display:none">.</div>
<p></p>
<p>See Also :<br />
<a href="http://www.microsoft.com/expression/products/SketchFlow_Overview.aspx">Microsoft SketchFlow</a><br />
<a href="http://www.guuui.com/issues/02_07.php">Visio Sketchy Wireframe Tempates</a><br />
<a href="http://iphonemockup.lkmc.ch/">Web-based iPhone collaborative mockup maker</a></p>
<p>(Via <a href="http://www.boxesandarrows.com/view/sketchy-wireframes?utm_source=feedburner&#038;utm_medium=feed&#038;utm_campaign=Feed%3A+BoxesAndArrows_Stories+%28Boxes+and+Arrows%29">Boxes and Arrows</a>)</p>
<blockquote><p>
Having used computer-based sketchy wireframes on a number of projects, I’ve found many ways that they can decrease confusion with teams and stakeholders:</p>
<p>    * Clients and Executives &#8211; People in this group typically want to push projects forward as quickly as possible. Consequently, the more “finished” the wireframes look, the faster they will expect to see the finished product. You can do yourself a disservice by making your wireframes look more complete than they are. To quote Kathy Sierra, “How ‘done’ something looks should match how ‘done’ something is.”</p>
<p>    * Programmers &#8211; Programmers who see traditional wireframes too early in the process may misinterpret their functionality as “signed-off.” Don’t be shocked if you hear frantic questions like “Did we agree to this?” Programming requires meticulous attention to detail, so programmers read wireframes with an eagle eye. Consequently, they may expect a level of specification from wireframes that isn’t appropriate in the early stages.</p>
<p>    * Designers &#8211; Designers make their living with their visual creativity, and they resist anything that could constrain it. Consequently, in situations where designers must work with wireframes created by someone else, designers can perceive them as a creative straightjacket, or worse, as a threat. A sketchy representation can help reduce friction by removing unnecessary details and adding a certain amount of “fuzziness” to the wireframes, thereby giving designers more leeway in interpreting the look and feel of the interface.</p>
<p>    * Users &#8211; In my research, I’ve found that users who are asked to comment on traditional wireframes can be intimidated by an overly finished look and feel. This is mirrored by a general consensus in the usability industry that the “less done” a demo looks, the more comfortable users feel with giving feedback. Where traditional wireframes can elicit comments like “I don’t like the font on those words,” sketchy wireframes are more likely to elicit comments like “I don’t know what those words mean.”</p></blockquote>



<div id="related">
<h3>Related Posts</h3>
<ul>
		<a href="http://www.poxod.cc/blog/2010/06/17/touchosc/" rel="bookmark">
	<li>
	<p>Code-free iPhone interaction prototype<!-- (2)--></p>
	<p><small><p>Have you ever found yourself wanting to prototype a simple, realtime interaction between an iPhone and another piece of hardware, [...]</p>
</small></p>
	</li></a>
		<a href="http://www.poxod.cc/blog/2007/05/24/using-comics-to-describe-user-experience/" rel="bookmark">
	<li>
	<p>Using Comics to Describe User Experience<!-- (2)--></p>
	<p><small><p>An excellent article appears today on Boxes and Arrows. It gives an overview of the benefits of using a narrative [...]</p>
</small></p>
	</li></a>
		<a href="http://www.poxod.cc/blog/2006/08/02/dtools-plug-and-play-hardware-prototyping/" rel="bookmark">
	<li>
	<p>Plug and Play Hardware Prototyping<!-- (2)--></p>
	<p><small><p>d.tools is a combination hardware and software system that makes prototyping hardware interfaces fast and easy. With it, inexperienced test [...]</p>
</small></p>
	</li></a>
	</ul>
</div>]]></content:encoded>
			<wfw:commentRss>http://www.poxod.cc/blog/2009/11/16/73/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Using Comics to Describe User Experience</title>
		<link>http://www.poxod.cc/blog/2007/05/24/using-comics-to-describe-user-experience/</link>
		<comments>http://www.poxod.cc/blog/2007/05/24/using-comics-to-describe-user-experience/#comments</comments>
		<pubDate>Thu, 24 May 2007 15:46:19 +0000</pubDate>
		<dc:creator>cc</dc:creator>
				<category><![CDATA[Web]]></category>
		<category><![CDATA[process]]></category>

		<guid isPermaLink="false">http://www.poxod.cc/blog/2007/05/24/using-comics-to-describe-user-experience/</guid>
		<description><![CDATA[An excellent article appears today on Boxes and Arrows. It gives an overview of the benefits of using a narrative [...]


<div id="related">
<h3>Related Posts</h3>
<ul>
		<a href="http://www.poxod.cc/blog/2009/11/16/73/" rel="bookmark">
	<li>
	
Why Wiggly Wireframes?<!-- (2)-->
	
<small>
Aaron Travis explores the motivation and payoff for developing low-fidelity wireframes for user interfaces during the design process. While I [...]
</small>
	</li></a>
		<a href="http://www.poxod.cc/blog/2010/06/01/radioball/" rel="bookmark">
	<li>
	
Rolling through the dial with Radioball<!-- (1)-->
	
<small>
I usually prefer to write about tools, processes and methods here, but when I see a project that so completely [...]
</small>
	</li></a>
		<a href="http://www.poxod.cc/blog/2006/03/14/google-buys-last-sotftware/" rel="bookmark">
	<li>
	
Google Buys @Last Sotftware<!-- (1)-->
	
<small>
Google has announced the purchase of @Last Software, makers of SketchUp, a 3D modelling and rendering application. SketchUp, whose tagline [...]
</small>
	</li></a>
	</ul>
</div>]]></description>
			<content:encoded><![CDATA[<p>An excellent <a href="http://www.boxesandarrows.com/view/comics-not-just-for">article</a> appears today on <a href="http://www.boxesandarrows.com/">Boxes and Arrows</a>. It gives an overview of the benefits of using a narrative technique to communicate complex interactions. In this case study, User Experience Designers developed comic strips to communicate broad goals to a larger and diverse audience.</p>
<blockquote><p>Comics are effective not only because they are essentially narrative, but also because they are unpretentious, easy to follow, and accessible. Whereas a functional specification document uses words and often “tech speak” to communicate functionality, comics use pictures and interactions to get ideas across.</p></blockquote>
<p>Can&#8217;t draw? Don&#8217;t have time to draw? Check out the comments at the bottom of the article for a link to <a href="http://designcomics.org">designcomics.org</a>, where the folks at Sun Microsystems&#8217; web team have built a repository of free stock scenes and characters that you can use to build storyboards with little effort. The &#8216;examples&#8217; section, which has tips for how to use narrative techniques to describe design choices, reads like an introduction to Aristotle&#8217;s Poetics:</p>
<blockquote><p>Another common format is a three-act play: (1) A hero&#8230; (2) has a problem&#8230; (3) and solves it (or not)</p></blockquote>
<p>The act of designing a user experience can be compared to developing choreography for a user to enact. Writing like this in sometimes-dry forums like Boxes and Arrows validates my belief that telling a story is a valuable way to describe interaction to a broad audience.</p>
<p>SEE ALSO &#8211; <a href="http://www.poxod.cc/blog/2006/03/20/comiclife/">ComicLife : A Story Machine</a> </p>



<div id="related">
<h3>Related Posts</h3>
<ul>
		<a href="http://www.poxod.cc/blog/2009/11/16/73/" rel="bookmark">
	<li>
	<p>Why Wiggly Wireframes?<!-- (2)--></p>
	<p><small><p>Aaron Travis explores the motivation and payoff for developing low-fidelity wireframes for user interfaces during the design process. While I [...]</p>
</small></p>
	</li></a>
		<a href="http://www.poxod.cc/blog/2010/06/01/radioball/" rel="bookmark">
	<li>
	<p>Rolling through the dial with Radioball<!-- (1)--></p>
	<p><small><p>I usually prefer to write about tools, processes and methods here, but when I see a project that so completely [...]</p>
</small></p>
	</li></a>
		<a href="http://www.poxod.cc/blog/2006/03/14/google-buys-last-sotftware/" rel="bookmark">
	<li>
	<p>Google Buys @Last Sotftware<!-- (1)--></p>
	<p><small><p>Google has announced the purchase of @Last Software, makers of SketchUp, a 3D modelling and rendering application. SketchUp, whose tagline [...]</p>
</small></p>
	</li></a>
	</ul>
</div>]]></content:encoded>
			<wfw:commentRss>http://www.poxod.cc/blog/2007/05/24/using-comics-to-describe-user-experience/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Google Buys @Last Sotftware</title>
		<link>http://www.poxod.cc/blog/2006/03/14/google-buys-last-sotftware/</link>
		<comments>http://www.poxod.cc/blog/2006/03/14/google-buys-last-sotftware/#comments</comments>
		<pubDate>Tue, 14 Mar 2006 20:33:38 +0000</pubDate>
		<dc:creator>cc</dc:creator>
				<category><![CDATA[3D]]></category>
		<category><![CDATA[Web]]></category>
		<category><![CDATA[news]]></category>

		<guid isPermaLink="false">http://www.poxod.cc/blog/?p=27</guid>
		<description><![CDATA[Google has announced the purchase of @Last Software, makers of SketchUp, a 3D modelling and rendering application. SketchUp, whose tagline [...]


<div id="related">
<h3>Related Posts</h3>
<ul>
		<a href="http://www.poxod.cc/blog/2010/06/01/radioball/" rel="bookmark">
	<li>
	
Rolling through the dial with Radioball<!-- (1)-->
	
<small>
I usually prefer to write about tools, processes and methods here, but when I see a project that so completely [...]
</small>
	</li></a>
		<a href="http://www.poxod.cc/blog/2007/02/13/sketchup-6-is-out/" rel="bookmark">
	<li>
	
Sketchup 6 is out!<!-- (1)-->
	
<small>
Since being purchased by Google, Sketchup has been split into two products: Sketchup Pro and &#8216;Google Sketchup&#8217;, the free version, [...]
</small>
	</li></a>
		<a href="http://www.poxod.cc/blog/2006/11/25/takeo-igarashi-3d-sketching-pioneer/" rel="bookmark">
	<li>
	
Takeo Igarashi : 3D Sketching Pioneer<!-- (1)-->
	
<small>
I was first introduced to the work of Takeo Igarashi at CMU in 1998, where he came to demonstrate his [...]
</small>
	</li></a>
	</ul>
</div>]]></description>
			<content:encoded><![CDATA[<p>Google has announced the purchase of @Last Software, makers of SketchUp, a 3D modelling and rendering application. SketchUp, whose tagline is &#8216;3D for everyone,&#8217; is designed to be an intuitive tool for creating 3D mockups and sketches.</p>
<p><a title="The shape of things to come" rel="lightbox" href="http://www.poxod.cc/blog/wp-content/uploads/2006/03/ZNO%20v%20R4.jpg"><img alt="The shape of things to come" id="image30" src="http://www.poxod.cc/blog/wp-content/uploads/2006/03/ZNO%20v%20R4.jpg" /></a><br />
@Last Software had created a <a href="http://www.sketchup.com/index.php?id=408">plugin</a> for <a href="http://earth.google.com/">Google Earth</a> that allows SketchUp users to add their own models to a Google Earth application. Like the models shown above, this means that anyone could place their 3D design into the Google Earth application and users who subscribed to that &#8216;layer&#8217; of data could see your building on their desktop.</p>
<p>This could be for architects and designers what Google&#8217;s purchase of Blogger was to writers. Google continues to expand the average person&#8217;s ability to create and share content. Of course, it could also mean endless 3D blogging of peoples&#8217; doghouses, office buildings and summer homes, but some good may come of it regardless.<br />
<a href="http://www.sketchup.com/" /></p>
<p><a href="http://www.sketchup.com/"> </a><a href="http://www.sketchup.com/"> </a><a href="http://www.sketchup.com/">@Last Software</a></p>
<p><a href="http://googleblog.blogspot.com/2006/03/new-home-for-last-software.html">Link to Post</a></p>
<p>Update: <a href="http://znonz.blogspot.com/">This guy</a> has a catalogue of notable real, imagined or proposed buildings that have been modelled and placed in Google Earth. A good indication of things to come.</p>



<div id="related">
<h3>Related Posts</h3>
<ul>
		<a href="http://www.poxod.cc/blog/2010/06/01/radioball/" rel="bookmark">
	<li>
	<p>Rolling through the dial with Radioball<!-- (1)--></p>
	<p><small><p>I usually prefer to write about tools, processes and methods here, but when I see a project that so completely [...]</p>
</small></p>
	</li></a>
		<a href="http://www.poxod.cc/blog/2007/02/13/sketchup-6-is-out/" rel="bookmark">
	<li>
	<p>Sketchup 6 is out!<!-- (1)--></p>
	<p><small><p>Since being purchased by Google, Sketchup has been split into two products: Sketchup Pro and &#8216;Google Sketchup&#8217;, the free version, [...]</p>
</small></p>
	</li></a>
		<a href="http://www.poxod.cc/blog/2006/11/25/takeo-igarashi-3d-sketching-pioneer/" rel="bookmark">
	<li>
	<p>Takeo Igarashi : 3D Sketching Pioneer<!-- (1)--></p>
	<p><small><p>I was first introduced to the work of Takeo Igarashi at CMU in 1998, where he came to demonstrate his [...]</p>
</small></p>
	</li></a>
	</ul>
</div>]]></content:encoded>
			<wfw:commentRss>http://www.poxod.cc/blog/2006/03/14/google-buys-last-sotftware/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>