homepage direction

Overarching Lessons1. Immerse the user in the product from the get-go.2. Communicate benefits and function through clear information hierarchy.3. Be fresh and original.4. Show a 'how-to' explanation which begins above the fold, but doesn't dominate the entire page.5. Have a focused and strong call to action.6. The page should be 'on-brand' -- consistent with the product message, packaging and copy.

Homepages to Learn From

Homepages to Learn From Page 1

GojeeGood: Instant immersion in product emotionBad: Not clear what the product is exactly (a recipe site with gorgeous photos)

Homepages to Learn From

Homepages to Learn From Page 2

AirbnbGood: Gorgeous and immersiveBad: Call to action gets lost (it's in the upper left)

Homepages to Learn From

Homepages to Learn From Page 3

OverGood: Gorgeous and immersiveBad: Product benefits not immediately clear

Homepages to Learn From

Homepages to Learn From Page 4

GrazeGood:

1. Product is front and center -- the only photographed image on the page2. Great information hierarchy - elements other than box photo and call to action take a backseat.3. 'How it works' section header is above the fold.

Bad:

1. A bit boring2. Cluttered

Homepages to Learn From

Homepages to Learn From Page 5

EvernoteGood:

1. Clear explanation of benefits2. Good information hierarchy: Pithy benefit > illustrations > benefit supheaders > detailedexplanations

Bad:

While benefits are clearly explained, how the product works remains a bit mysterious.

Homepages to Learn From

Homepages to Learn From Page 6

DoxoGood:

1. Design reflects the product - homepage for a product meant to reduce clutter is clean and clear ofcutter.2. Video to explain unique product is embedded in the page in an organic way.

Bad:

The above-the-fold how-to section isn't labeled, and doesn't seem to go beyond what's already onthe page.

Homepages to Learn From

Homepages to Learn From Page 7

KashooGood: Information hierarchy; above the fold how-toBad: Looks like a template, unoriginal

Homepages to Learn From

Homepages to Learn From Page 8

BarkBoxGood: Pithy explanation of product; great information hierarchyBad: Product shot is a bit small; page feels a little empty

Homepages to Learn From

Homepages to Learn From Page 9

BirchboxGood:

1. Clear product illustration2. Page has cohesive feel that evokes the product3. Clear call to action

Bad: Feels somewhat generic

Homepages to Learn From

Homepages to Learn From Page 10

SeamlessGood:

1. Product immersion2. Quick, functional call to action

Bad: Cluttered

Homepages to Learn From

Homepages to Learn From Page 11

XeroGood: Makes a potentially 'scary' product seem humanBad: Gives no information about product unless the video is played

Homepages to Learn From

Homepages to Learn From Page 12

BilleoBad:

1. Boring2. Generic graphical elements3. No clear call to action - the 'ZipThru' button is not clickable.

Homepages to Learn From

Homepages to Learn From Page 13

RescueTimeBad: Complicated product not clearly explained.

Homepages to Learn From

Homepages to Learn From Page 14