overstock.com
September 2008 - presentaerial perspective
August 2007 - present
what i did
In 2007 in between jobs I killed my previous company and came up with Aerial Perspective: graphic and web design. I have operated under this entity handling freelance projects aside from my full time job ever since.
what is it
An aerial perspective is akin to, a view from above. In the case of web design I look at different angles to create the ideal user experience from an outside vantage point.
keys to success
- clean easy to navigate design
- HTML 4.01 strict validated
- well formed semantic HTML
- 1 sprite to rule them all
- compacted and clean jQuery
logo
I have used the dragonfly from my very first design, because this insect sees everything with huge eyes, and from above.
Technology Used:
Adobe CS5
portfolio
Built using jQuery with a carousel, tabs, and colorbox to create a sleek interface laid out on a 960gs 12 column grid.
Technology Used:
Adobe CS5, PHP, HTML, CSS, & JS
footer
I love big footers and this one includes a twitter and photo feed, as well as a great quote that pertains to design.
Technology Used:
Adobe CS5, PHP, HTML, CSS, & JS
timaverybirding.com
March 2004 - present
what it is
This was my first website outside of school projects. I have had 8 or 9 versions since the get go--being my personal
website it has grown with me as a web designer over the years
I built the first version to host photos, and have since expanded to include videos, a blog, and other random
pieces of information.
This is the site I usually test new technology on before using on other websites.
keys to success
- clean 960gs layout
- rustic/organic design
- organized PHP photo gallery
- HTML 4.01 strict code
- the site fits the users
logo
This site has had an ever-changing logo. The eagle has stuck through the past 4 years and has become so it may last.
Technology Used:
Adobe CS4
navigation
A jQuery based nav that slides sub-navigation into view on hover. A space saver and useful to hide low traffic pages.
Technology Used:
Adobe CS4, PHP, HTML, CSS, & JS
footer
Another big footer, this one combines a photo feed from my gallery, along with a "simplified sitemap" for SEO goodness.
Technology Used:
Adobe CS4, PHP, HTML, CSS, & JS
utah birders blog
December 2010 - present
what i did
I designed and coded this site in an afternoon to start up a pet project myself and a couple of friends had been talking about for some time. Hosted on Blogger, this simple and clean design make for an easy read with the focus on the content.
what it is
It is a multi-user blog to talk about birds and birding in Utah.
From expert to beginner this blog offers something for all birders.
keys to success
- oh so very clean design
- simple user interface
- jQuery for some interaction
- connected to the social network
- meaningful content to fill the space
logo
One of my favorite logos I have designed. Clean and simple--but powerful. The font and icon interact to make it memorable.
Technology Used:
Adobe CS5
contact
Built with jQuery, powered by Google. The image behind the form is a flock of birds, as if the bloggers are the flock being contacted.
Technology Used:
Adobe CS5, HTML, CSS, and JS
about
Simply laid out and pulled in via jQuery, these mini biographies match the site in their cleanliness, style, and readability.
Technology Used:
Adobe CS5, HTML, CSS, and JS
every mutt matters
completed: December 2009
what i did
I designed and built this site, including a blog, photo gallery and a CMC to update information without the need for a web designer.
The color palette of pinks was used to be easy on the eyes and present a need for help.
what it is
This start up not for profit was created to help save dogs by supporting no-kill animal shelters--primarily in Utah.
keys to success
- modified 960gs layout
- clean and welcoming design
- powerful imagery where needed
- PHP powered gallery
- a noble cause outweighs the design
logo
The silhouette of a puppy set against the pink background presented a strong image to go along with the cause.
Technology Used:
Adobe CS3
layout
Very clean and simple--I modified the 960gs 6-column grid to allow for more space in the gutters and around content.
Technology Used:
Adobe CS3, PHP, HTML, CSS, & JS
business card
Mimicking the layout of the site, the business cards matched the site in every aspect--helping with promoting the brand.
Technology Used:
Adobe CS3
sam-and-tim.com
September 2010 - present
what i did
This personal site was designed to be clean, elegant, and easy to navigate. The layout is based on a 12 column 960gs layout
and a swiss style, relying on the whitespace to focus on the content.
The logo is both representative of me and my fiance.
what it is
A website to use for our wedding and life after. The focus of the site being on us--the content--not the design.
keys to success
- whitespace, whitespace, whitespace
- very elegant and clean layout
- Tubmlr blog for easy updates
- the content is the focus-not the design
- love defeats all evil
logo
Two love birds represent my fiance and I. Pink her color, orange mine, atop fonts that show our style and strength.
Technology Used:
Adobe CS5
blog
This simple Tumblr blog is easy to use, and allows us to keep those around us updated on what is going on in our lives.
Technology Used:
Adobe CS5, HTML, CSS, JS, & Tumblr
Keeping the theme going these save the date cards are the first piece of print for our wedding--and they tie into our site.
Technology Used:
Adobe CS5
timberlywhitfield.com
completed: December 2010
what i did
I designed this site with the actress it features in mind. The purple is a powerful color that represents her as a person.
The homepage features a glamour shot--the focus of the site.
This new and improved site helps drive the users attention where it needs to go.
what it is
A personal website meant to work as a resume, press kit, and information piece on an actress.
keys to success
- powerful color and layout
- high res photography up front
- HTML 4.01 strict code
- focus on the content--no the design
- a brand for a name
logo
Although not the logo I would have picked to use, this updated design played off the previous logo of a television set.
Technology Used:
Adobe CS5
branding
What is a name without a brand? The design, colors, and content all help create a presence, and a feeling to go with the name.
Technology Used:
Adobe CS3
press
The press page highlights Timberly's work and is laid out in a clean and orderly fashion. This repository put all her work in one place.
Technology Used:
Adobe CS5, HTML, CSS, and JS
western field ornithologists
completed: October 2007
what i did
I haven't worked on this site in over 3 years. At the time I provided an updated look and feel to an outdated and content-less website.
The design is still in use, but updates are handled by others.
what it is
A website to publicize and share information about the western field ornithologists and their endeavors.
keys to success
- new updated logo
- organized interface
- PHP photo gallery
- secure to accept donations
- information packed site
logo
The Sabine's Gull has long been the logo of the WFO. I gave it a face lift--bringing the illustrated version into the 21st century.
Technology Used:
Adobe CS3
layout
The simple and organized layout makes for an easy to read site, that focuses on organization within the organization.
Technology Used:
Adobe CS3, PHP, HTML, CSS, & JS
modules
I designed and coded easy to reproduce heading modules that could be changed or updated at any time and fairly easily.
Technology Used:
Adobe CS3, HTML, and CSS
mountain west birding company
completed: June 2008
what i did
I created this site the week before a major birding convention being held in Utah to offer bird guiding services to those
in attendance. The site was designed to be bold and memorable.
The code was simple and one of very few sites I designed that included flash.
what it is
A personal website created to promote guiding service that myself and others provided for birders visiting Utah.
keys to success
- bright and bold colors
- unique layout and design
- clean and concise information
- high res imagery
- PHP photo gallery
logo
I like the initial design, but later changed my branding goals on print literature, focusing on a more recognizable icon.
Technology Used:
Adobe CS3
layout
The layout was bright and inviting. The goal was to make birding seem exciting and get people interested with the sleek look.
Technology Used:
Adobe CS3, PHP, HTML, CSS, & JS
business card
This version shows an updated logo with a hawk as a the icon to be more in line with birds of the "mountain west".
Technology Used:
Adobe CS3
citizen blues
completed: December 2008
what i did
Working with a developer I designed the user interface and front end code to be attached to a one deal at a time (ODAT)
back end that he had built.
This was my first project working with an outside developer 1 on 1.
what it is
This ODAT sold jeans at hugely discounted prices while providing fashion information through an attached blog.
keys to success
- clean and sleek design
- easy to use photo switcher
- Blogger hosted blog
- the ODAT functionality
- user friendly interface
logo
Taking sketches provided by the owners, I created this version of the logo which represented the company very well.
Technology Used:
Adobe CS3
layout
The layout combined the best features of a number of online retailers and ODATs into a simple easy to use format.
Technology Used:
Adobe CS3, PHP, HTML, CSS, & JS
image viewer
The easy roll-over image switcher made showing multiple views with close up pictures easy and user friendly.
Technology Used:
Adobe CS3, HTML, CSS, and JS
wasatch ski valet
completed: November 2009
what i did
I was hired at first for a few simple updates to the site; later being asked to come back and make more changes and update
more content the following years.
I created a CMC for the owner to update his partner information, and gave the homepage a face lift in 2009.
what it is
This company provides a "to your door" service for ordering skis out of Salt Lake City or Park City in Utah.
keys to success
- updated homepage for ease of use
- jQuery for added interaction
- easy CMC for updates on the fly
- organized information
- as easy as 1.2.3...
marketing
Updating the homepage messaging to explain how easy it is panned out great and has been used for more than 2 years.
Technology Used:
Adobe CS3, HTML, and CSS
homepage
The original homepage had a lot of text information, but wasn't graphically interesting. The new version makes it simple.
Technology Used:
Adobe CS3, HTML, CSS, and JS
jquery cmc
To help save the owner money, I used a jQuery CMC to update content as often as they needed without my help.
Technology Used:
Adobe CS5, HTML, CSS, and JS
linking communities
completed: November 2009
what i did
An unfinished project that I need to get to finishing. I designed and coded this simple site using 960gs--the first site
I used this framework to build.
The work included adding a blog, a photo gallery, and interactive maps with Google Maps.
what it is
This site is supposed to be the online link between 3 shorebird migration points between Canada and Mexico.
keys to success
- clean and organized design
- very peaceful color palette
- PHP photo gallery
- will feature easy CMC
- easy to use interface
logo
Although not the logo I recommended, I took their past logo and flattened it out, along with a cleaner font for legibility.
Technology Used:
Adobe CS3
homepage
Very simple homepage design to keep the user focused on the content and not the design--while ensuring easy navigation.
Technology Used:
Adobe CS3, PHP, HTML, CSS, & JS
content
The simple blog style layout of the pages on the site keeps the focus on the information being presented, and not the design.
Technology Used:
Adobe CS3, PHP, HTML, CSS, & JS