Derek Punsalan – Meet Derek, at least online

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head profile="http://gmpg.org/xfn/11"><script type="text/javascript" src="/_static/js/bundle-playback.js?v=HxkREWBo" charset="utf-8"></script> <script type="text/javascript" src="/_static/js/wombat.js?v=txqj7nKC" charset="utf-8"></script> <script>window.RufflePlayer=window.RufflePlayer||{};window.RufflePlayer.config={"autoplay":"on","unmuteOverlay":"hidden"};</script> <script type="text/javascript" src="/_static/js/ruffle/ruffle.js"></script> <script type="text/javascript"> __wm.init("http://web.archive.org/web"); __wm.wombat("http://is.derekpunsalan.com:80/","20100101040430","http://web.archive.org/","web","/_static/", "1262318670"); </script> <link rel="stylesheet" type="text/css" href="/_static/css/banner-styles.css?v=S1zqJCYt" /> <link rel="stylesheet" type="text/css" href="/_static/css/iconochive.css?v=3PDvdIFv" />  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> <title>Derek Punsalan – Meet Derek, at least online</title> <link rel="shortcut icon" type="image/x-icon" href="/web/20100101040430im_/http://is.derekpunsalan.com/favicon.ico"/> <link rel="alternate" type="application/rss+xml" title="Derek Punsalan – Meet Derek, at least online RSS Feed" href="http://web.archive.org/web/20100101040430/http://is.derekpunsalan.com/feed/"/> <link rel="stylesheet" href="http://web.archive.org/web/20100101040430cs_/http://is.derekpunsalan.com/wp-content/themes/simpltn/reset.css" type="text/css" media="screen"/> <link rel="stylesheet" href="http://web.archive.org/web/20100101040430cs_/http://is.derekpunsalan.com/wp-content/themes/simpltn/style.css" type="text/css" media="screen"/>  <script src="/web/20100101040430js_/http://is.derekpunsalan.com/mint/?js" type="text/javascript"></script> <link rel="stylesheet" id="contact-form-7-css" href="http://web.archive.org/web/20100101040430cs_/http://is.derekpunsalan.com/wp-content/plugins/contact-form-7/stylesheet.css?ver=2.0.7" type="text/css" media="all"/> <script type="text/javascript" src="http://web.archive.org/web/20100101040430js_/http://is.derekpunsalan.com/wp-includes/js/jquery/jquery.js?ver=1.3.2"></script> <link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://is.derekpunsalan.com/xmlrpc.php?rsd"/> <link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://is.derekpunsalan.com/wp-includes/wlwmanifest.xml"/> <link rel="index" title="Derek Punsalan - Meet Derek, at least online" href="http://is.derekpunsalan.com"/> <meta name="generator" content="WordPress 2.8.6"/> </head> <body> <div id="wrapper"> <div id="masthead"> <h3 id="logo"><a href="http://web.archive.org/web/20100101040430/http://is.derekpunsalan.com/" title="Derek Punsalan - Start">Derek<span>Punsalan</span></a></h3> <ul id="nav"> <li><a class="active" href="http://web.archive.org/web/20100101040430/http://is.derekpunsalan.com/" title="Derek Punsalan - Start">Start</a></li> <li id="hook-projects"> <a id="projects-trigger" href="#" title="Derek Punsalan - Selected Projects">Select Projects</a> <div id="panel-projects" style="display:none;"> <a class="faux-overlay active" href="#" title="Derek Punsalan - Selected Projects">Select Projects</a> <div id="spread-projects"> <div class="spread-inner"> <div class="panel"> <a class="quicklink" href="http://web.archive.org/web/20100101040430/http://is.derekpunsalan.com/withwaves/" title="WithWaves"><strong>WithWaves</strong> Google Wave Development</a> </div> <div class="panel"> <a class="quicklink" href="http://web.archive.org/web/20100101040430/http://is.derekpunsalan.com/cirqe/" title="Cirqe"><strong>Cirqe</strong> Social Application Platform</a> </div> <div class="panel"> <a class="quicklink" href="http://web.archive.org/web/20100101040430/http://is.derekpunsalan.com/cheddr-media/" title="Cheddr Media"><strong>Cheddr Media</strong> Social Media & Promotions</a> </div> <div class="panel"> <a class="quicklink" href="http://web.archive.org/web/20100101040430/http://is.derekpunsalan.com/friendfeed/" title="FriendFeed"><strong>FriendFeed</strong> CSS theme experiment</a> </div> <div class="panel"> <a class="quicklink" href="http://web.archive.org/web/20100101040430/http://is.derekpunsalan.com/5thirtyone/" title="5THIRTYONE"><strong>5THIRTYONE</strong> A personal design exercise</a> </div> <div class="panel"> <a class="quicklink" href="http://web.archive.org/web/20100101040430/http://is.derekpunsalan.com/ashland-skateboards/" title="Ashland Skateboards"><strong>Ashland Skateboards</strong> Company blog & ecommerce site</a> </div> <div class="panel"> <a class="quicklink" href="http://web.archive.org/web/20100101040430/http://is.derekpunsalan.com/motherland-inc/" title="Motherland, Inc"><strong>Motherland, Inc</strong> Showcase for project reels</a> </div> <div class="panel"> <a class="quicklink" href="http://web.archive.org/web/20100101040430/http://is.derekpunsalan.com/sylvia/" title="Sylvia"><strong>Sylvia</strong> Personalized WordPress site</a> </div> </div> </div> </div> </li> <li><a href="#contact-me" title="Derek Punsalan - Contact">Contact</a></li> </ul> </div><div id="main-inner"> <div class="intro-section"> <div class="banner"> <h2>About</h2> <p class="mini">Meet Derek</p> </div> <div class="duet"> <img src="http://web.archive.org/web/20100101040430im_/http://is.derekpunsalan.com/wp-content/themes/simpltn/images/avatar.jpg" alt="Avatar"/> <p>Too often products or content are obscured by extraneous fluff. I'm here to change that - one page at a time. I am a designer & developer of clean, semantic, lightweight websites. Browse through select projects and get in touch with your project idea(s).</p> </div> <ul class="duet addy"> <li><span>loc:</span> <strong>Seattle, WA</strong></li> <li><span>blog:</span> <a href="http://web.archive.org/web/20100101040430/http://5thirtyone.com/" title="My Blog">5thirtyone.com</a></li> <li><span>phone:</span> <a href="http://web.archive.org/web/20100101040430/callto:+12064206455" title="Google Voice">+1.206.420.6455</a></li> </ul> </div> <div class="intro-section screenshots"> <div class="banner"> <h2>Explore</h2> <p class="mini">Select project samples</p> </div> <div id="duet-row"> <div id="post-23" class="duet"> <a class="sample" href="http://web.archive.org/web/20100101040430/http://is.derekpunsalan.com/withwaves/" title="WithWaves"> <img class="stripes" src="http://web.archive.org/web/20100101040430im_/http://is.derekpunsalan.com/wp-content/uploads/2009/11/withwaves-thumbnail.png" alt="Screenshot"/> <span class="info"><strong>WithWaves</strong> Google Wave Development</span> </a> </div> <div id="post-21" class="duet"> <a class="sample" href="http://web.archive.org/web/20100101040430/http://is.derekpunsalan.com/cirqe/" title="Cirqe"> <img class="stripes" src="http://web.archive.org/web/20100101040430im_/http://is.derekpunsalan.com/wp-content/uploads/2009/11/cirqe-thumbnail.png" alt="Screenshot"/> <span class="info"><strong>Cirqe</strong> Social Application Platform</span> </a> </div> <div id="post-18" class="duet"> <a class="sample" href="http://web.archive.org/web/20100101040430/http://is.derekpunsalan.com/cheddr-media/" title="Cheddr Media"> <img class="stripes" src="http://web.archive.org/web/20100101040430im_/http://is.derekpunsalan.com/wp-content/uploads/2009/11/cheddr-thumbnail.png" alt="Screenshot"/> <span class="info"><strong>Cheddr Media</strong> Social Media & Promotions</span> </a> </div> <div id="post-15" class="duet"> <a class="sample" href="http://web.archive.org/web/20100101040430/http://is.derekpunsalan.com/friendfeed/" title="FriendFeed"> <img class="stripes" src="http://web.archive.org/web/20100101040430im_/http://is.derekpunsalan.com/wp-content/uploads/2009/11/friendfeed-thumbnail.png" alt="Screenshot"/> <span class="info"><strong>FriendFeed</strong> CSS theme experiment</span> </a> </div> </div> </div> <div id="contact-me" class="intro-section"> <div class="banner"> <h2>Contact</h2> <p class="mini">Get in touch</p> </div> <div class="duet contact-desc"> <p>Questions, comments, inquiries? Feel free to get in touch using the contact form. Email works best. Alternatively, connect on <a href="http://web.archive.org/web/20100101040430/http://twitter.com/derekpunsalan">Twitter</a> or <a href="http://web.archive.org/web/20100101040430/http://www.linkedin.com/in/derekpunsalan">LinkedIn</a>.</p> <p>This simpleton portfolio was thrown together in Photoshop, hand coded in <a href="http://web.archive.org/web/20100101040430/http://macromates.com/" title="TextMate">TextMate</a>, and proudly hosted on <a href="http://web.archive.org/web/20100101040430/http://www.mediatemple.net/go/order/?refdom=derekpunsalan.com" title="Media Temple">Media Temple (mt)</a>.</p> </div> <div class="duet contact-form"> <div id="text-3" class="widgetContainer widget_text"><h3>Contact Form</h3> <div class="textwidget"><div class="wpcf7" id="wpcf7-f1-w1-o1"><form action="/web/20100101040430/http://is.derekpunsalan.com/#wpcf7-f1-w1-o1" method="post" class="wpcf7-form"> <div style="display: none;"> <input type="hidden" name="_wpcf7" value="1"/> <input type="hidden" name="_wpcf7_version" value="2.0.7"/> <input type="hidden" name="_wpcf7_unit_tag" value="wpcf7-f1-w1-o1"/> </div> <p class="txt-input"><label>Name (required)</label><br/> <span class="wpcf7-form-control-wrap your-name"><input type="text" name="your-name" value="" class="wpcf7-validates-as-required" size="40"/></span> </p> <p class="txt-input"><label>Email (required)</label><br/> <span class="wpcf7-form-control-wrap your-email"><input type="text" name="your-email" value="" class="wpcf7-validates-as-email wpcf7-validates-as-required" size="40"/></span> </p> <p class="txt-input"><label>Subject</label><br/> <span class="wpcf7-form-control-wrap your-subject"><input type="text" name="your-subject" value="" size="40"/></span> </p> <p class="txt-input"><label>Message</label><br/> <span class="wpcf7-form-control-wrap your-message"><textarea name="your-message" cols="40" rows="10"></textarea></span> </p> <p class="closing"><input type="submit" value="Send"/> <img class="ajax-loader" style="visibility: hidden;" alt="ajax loader" src="http://web.archive.org/web/20100101040430im_/http://is.derekpunsalan.com/wp-content/plugins/contact-form-7/images/ajax-loader.gif"/></p> <div class="wpcf7-response-output wpcf7-display-none"></div></form></div></div> </div> </div> </div></div> <div class="intro-section footer"> <p>Derek Punsalan is... Creating, Writing, and tinkering - Copyright © 2006-2009</p> </div> </div> <script src="http://web.archive.org/web/20100101040430js_/http://is.derekpunsalan.com/wp-content/themes/simpltn/js/functions.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript"> var gaJsHost = (("https:" == document.location.protocol) ? "http://web.archive.org/web/20100101040430/https://ssl." : "http://web.archive.org/web/20100101040430/http://www."); document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E")); </script> <script type="text/javascript"> try { var pageTracker = _gat._getTracker("UA-137085-18"); pageTracker._trackPageview(); } catch(err) {}</script> </body> </html>

CINXE.COM

Derek Punsalan – Meet Derek, at least online