The last time I did a redesign was in 2006 before I moved out to Seattle. Somehow I managed to keep artifacts over the years and not loose them through another cross country move!
With so many platforms and templates to choose from I wasn't sure which direction to take. I decided to start from scratch and learn how to build a responsive site. Below is a list of what it took for me to put all this together. Many hours writing, editing, training, sketching, hacking. If you see something wonky/buggy then drop me a note.
Molly Gardner — Writer and all around awesomeness
Molly helped me structure my project stories and revisions - Thanks!
HTML5 BOILERPLACE — The foundation
Great foundation for starting a new site / prototype.
This Is Responsive — Grid Block
Used the responsive grid block for my main portfolio pages.
Flexible Math — Responsive Design
A quick way to get pixel widths in percentages.
Modular Scale — by Tim Brown
Font Awesome — Font Icons
Icons used throughout.
CSS-Tricks — Drop Caps
Drop cap used on my landing page.
WUFOO — Form Builder
For the contact form - applied custom CSS.
HSL Color Picker — Editing colors
Experiment with color.
HEX Color Tool — Lighten or Darken
Used to simply lighten or darken a color.
Responsive Nav Patterns — Responsive Design
Referenced to help me decide on the type of responsive nav.
Content Slider — Responsive Design
Fully responsive slider I used to display my work.
ImageOptim — Image optimizer
After exporting all my images from FW - I ran them through ImageOptim to reduce.
Typekit — Typography
All fonts are served up via Typekit.
Responsive-Nav.js — Navigation
Used for responsive primary navigation.
Full page background — CSS-Tricks
Get the full page image
Adobe Fireworks — Image Editing/Export
Quick hi-fidelity mock ups and image editing.
Paper and Pencil — Sketching
Everything starts with a simple sketch.
Codeschool.com — Mobile design course
I knew this site needed to be responsive - responsive course got me up and running quick.
Combining Typefaces — Typography
Referenced for find a good type combination.
Hardboiled Web Design — HTML5 CSS3
Always on my shelf for reference.
What makes a good UX Designer — UX Evaluation
Influenced me to write a story about each UX project.
December 2004 — Web Designer
Quick page that outlined by resume with links to some work I've done.
May 2006 — Flash Designer
Oh boy - full flash site - at least I didn't have a skip intro on this one.