Steal What Works

Post on 04-Jul-2015

166 views 0 download

transcript

Steal What Works

Design Roundtable

SuperfluousBanterwww.SuperfluousBanter.org/

Shared by Brandy Reppy

SuperfluousBanter

SuperfluousBanterColor accents on the outside perimeter of both the main content area as well as along the left hand side of the design give it depth

SuperfluousBanterImportant areas are pretty obvious:

•bold link colors•background colors change depending on level of importance (white for main content, a brown background in the black right rail)

SuperfluousBanterThe consistent language tone, especially in carrying the "superfluous" theme is great - subtle but keeps it all together.

SuperfluousBanterEssentially just three graphics that persist:

•SB logo•Gray pattern on the lefthand side of the main content•Star pattern behind the "superfluousbanter" logo

The pattern of narrow first word - bold second word becomes a graphic treatment

Blipwww.fuzz.com/blip/welcome

Shared by Tim Thompson

BlipI like how when you click the Sign-up button at this site, it pops a LightBoxy overlay. No extra page load. Plus, it only asks 3 questions and you're signed up, which lowers the entry barrier.

Geniwww.Geni.com

GeniGeni avoids marketing messages, choosing to focus on the experience.

They tell you what they do front and center.

They reassure you that the site and your information is secure.

GeniGeni has embraced simplicity.

This is the first thing you see.

Entering the basic info needed to start using the service (who you are), also creates your account.

Skitchwww.Skitch.com

Shared by Tim Thompson

SkitchPeople who haven't been blogging for a while can get confused by the concept of permalinks.

Most of us know it's a direct link to get back to where we were, but it could become even more user-friendly.

SkitchThe way Skit handles permalinks is overkill for most sites, and more confusing than just one would be. But I like the "copy" button.

SkitchHere's a simpler way to do it: When clicking the help button, you see this mouseover.

Picnikwww.picnik.com

PicnikSigning up is simple and friendly.

The initial impression is of simplicity - you see three fields, but once you enter text into the Password or Email Address fields, their confirmations fields appear next to them.

The confirmation fields are grayed out until the main field has valid data.

FriendFeedwww.FriendFeed.com

FriendFeedA small touch - the second check box let's you sign up to receive notices about comments only when you haven't logged in recently.

Tumblrwww.tumblr.com

Shared by Tim Thompson

TumblrIt seems like every design decision was made to reduce actions to their simplest essence (as opposed to something like WordPress, which shows a lot of the gears in its interface).

The Tumblr blogging engine still has a lot of power and is quite sleek--a more streamlined version of what Blogger used to be.

TumblrThe large buttons on the top that filter the type of post by content type.

When you click a button to post something, the advanced options are hidden unless you click the link.

There are only 2 fields and 3 buttons per post page ("Create post" "Preview" "Cancel")