Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
branch: master
Fetching contributors…

Cannot retrieve contributors at this time

305 lines (273 sloc) 8.184 kb
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Conforming HTML 4.01 Strict Template</title>
<link rel="stylesheet" media="screen" href="reset.css"/>
<link rel="stylesheet" media="screen" href="grid.css"/>
<style type="text/css">
body {
margin: 0;
padding: 0;
font-family: "Times New Roman", sans-serif;
background: url(background.png) 0px -65px repeat-y;
background-color: #111;
}
#top-background {
position:absolute;
z-index: -1;
top: 0;
left: 0;
height: 643px;
width: 100%;
background: url(top-background.png) top left no-repeat;
}
#header {
width: 100%;
height: 70px;
padding: 30px 0 0 0;
}
#header h1 a {
display: block;
border 0;
margin: 0;
width: 510px;
height: 89px;
text-indent: -10000px;
background: url(banner.png) top left no-repeat;
}
p {
margin: 0;
padding: 0;
}
#content {
margin: 120px 30px 60px 60px;
}
#intro {
font-size: 2em;
line-height: 1.4em;
background-color: #332A22;
color: #e7e7e7;
opacity: 0.9;
padding: 10px;
width: 970px;
margin-bottom: 30px;
}
#intro a {
background-color: #000;
color: #FFF;
padding: 0 2px;
}
ul.recent_projects {
list-type: none;
}
ul.recent_projects li {
display: block;
margin: 10px 10px 15px 10px;
}
ul.recent_projects li img {
display: block;
}
ul.recent_projects li p {
width: 180px;
padding: 5px;
margin-top: 5px;
line-height: 1.1em;
}
ul, li{ margin: 0; padding: 0;}
.project {
width: 425px;
background-color: #E2DDCD;
margin: 50px 20px 20px 25px;
font-family: "Lucida Grande", Helvetica, sans-serif;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
behavior:url(border-radius.htc);
border: 0;
border-radius: 10px;
position:relative;
}
.project .icon {
width: 164px;
height: 164px;
background: url(icon-bg2.png) top left no-repeat;
position: absolute;
top: -40px;
left: -40px;
}
.project .icon .icon_wrapper {
overflow: hidden;
width: 132px;
height: 132px;
margin: 14px 0 0 15px;
position: absolute;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
background: url(thumbs/limecast.png) top left no-repeat;
}
.project .title {
float: left;
margin: 115px 10px 10px;
width: 100px;
font-weight: bold;
text-transform: uppercase;
}
.project p {
margin-left: 120px;
padding: 10px 15px;
font-size: 0.8em;
}
</style>
</head>
<body>
<div id="top-background"> </div>
<div id="header">
<h1><a href="http://nuttnet.net">from the desk of michael nutt,</a></h1>
</div>
<div id="content" class="span-20">
<div id="intro" class="text">
<p>Hi! My name is <a href="/about">Michael Nutt</a> and I <a href="/projects">build things</a>.
I'm also working on a few <a href="/software">software projects</a>. Occasionally I even
<a href="/">write about what I do</a>. This is my portfolio.</p>
</div>
<div class="column span-10">
<div class="project">
<div class="icon">
<div class="icon_wrapper"> </div>
</div>
<div class="title">
LimeCast
</div>
<p>
LimeCast aims to be the web's default podcasting directory. We built it in Rails, and it does lots of fancy things behind the scenes to pull in and format just about any podcast feed you throw at it.
</p>
<div style="clear: both;"> </div>
</div>
</div>
<!--
<div class="column span-5">
<ul class="recent_projects">
<li>
<img src="thumbnails/adrienne_gifford_1.jpg" />
<p>I built this mini-site for a friend who needed a portfolio. It provided a simple interface and an elegant display her resume and personal statements.</p>
</li>
<li>
<img src="thumbnails/band_site_dark_1.png" />
<p>The aim of this application was to create an easy-to-use
administration interface for a band's website.</p>
</li>
<li>
<img src="thumbnails/band_site_dark_2.png" />
<p>The interface was meant to be straightforward for band members
to easily add blog posts and show photos, but powerful enough for
designers to tweak the design of the site.</p>
</li>
<li>
<img src="thumbnails/batfc_1.png" />
<p><i>Breakup At The Food Court</i> was the name of a fake Ben Folds
song: when he was asked by his label what songs he was working on,
he made up some names since he wasn't working on any songs. The
site tracks all of his shows, allowing fans to add setlists and
upload photos.</p>
</li>
<li>
<img src="thumbnails/batfc_2.jpg" />
<p>BATFC was an interesting project to work on because it took a
large amount of show data and presented it in a form that was
quickly scannable.</p>
</li>
<li>
<img src="thumbnails/benfolds_fanclub_1.jpg" />
<p>An entry into a design contest; (I was <i>really</i> into Ben Folds music at the time) one of my other submissions won and was used for the site.</p>
</li>
</ul>
</div>
<div class="column span-5">
<ul class="recent_projects">
<li>
<img src="thumbnails/card_sequence_1.jpg" />
<p>At SXSW 2006 I needed business cards but was not yet affiliated with a company. This shows the process I went through in designing them. The right-most card was the final result.</p>
</li>
<li>
<img src="thumbnails/ihall_1.png" />
<p>I consulted with my school's student government organization to create a new website to replace their old outdated one.</p>
</li>
<li>
<img src="thumbnails/jazz_1.jpg" />
</li>
<li>
<img src="thumbnails/jumping_1.jpg" />
</li>
<li>
<img src="thumbnails/metarails_1.png" />
<p>MetaRails is a project similar to <a href="http://heroku.com">Heroku</a> to bring dynamic website development to the masses.</p>
</li>
<li>
<img src="thumbnails/metarails_2.png" />
<p>MetaRails was intented to also be useful to the advanced developer by giving a more spatial view of each project and showing how the project files related to one another.</p>
</li>
<li>
<img src="thumbnails/mojito_1.png" />
<p>Branding for a distributed hash table.</p>
</li>
</ul>
</div>
<div class="column span-5">
<ul class="recent_projects">
<li>
<img src="thumbnails/nativity_1.png" />
<p>A new website conceptual mockup for the Church of the Nativity in Huntsville, AL.</p>
</li>
<li>
<img src="thumbnails/owlmittens_1.png" />
<p>Mockup of a personal site for a friend who wanted a place to display and sell her artwork.</p>
</li>
<li>
<img src="thumbnails/owlmittens_2.png" />
</li>
<li>
<img src="thumbnails/rites_1.jpg" />
<p>A fake concert poster for the Rites of Spring concert festival. Designed in Photoshop and silkscreened in four layers.</p>
</li>
<li>
<img src="thumbnails/rites_2.jpg" />
<p>The posters were distributed around campus in anticipation of the actual lineup announcement, which coincidentally included Ben Folds.</p>
</li>
<li>
<img src="thumbnails/ski_boat_1.jpg" />
<p>A study in digital photography manipulation.</p>
</li>
<li>
<img src="thumbnails/slant_1.jpg" />
<p>A promotional poster for Vanderbilt University's humor publication</p>
</li>
</ul>
</div>
<div class="column span-5 last">
<ul class="recent_projects">
<li>
<img src="thumbnails/studentvoting_1.png" />
<p>Project page for the <a href="http://vandycs.org">Vanderbilt Computer Society</a>'s open source voting system, still in use.</p>
</li>
<li>
<img src="thumbnails/surveillance_1.jpg" />
</li>
<li>
<img src="thumbnails/treefingers_1.jpg" />
</li>
<li>
<img src="thumbnails/treefingers_2.jpg" />
</li>
<li>
<img src="thumbnails/vandycs_1.jpg" />
</li>
<li>
<img src="thumbnails/whattowear_1.jpg" />
<p>"What to wear?", a study in daily clothing selection</p>
</li>
</ul>
</div> -->
</div>
</body>
</html>
Jump to Line
Something went wrong with that request. Please try again.