only human

only human

A cream and crimson color palette with tasteful typography sum up the design of Only Human. The concept of the site is much deeper, and the about page is quite concise:

Only Human is a community where people share stories about mistakes they’ve made in life and their advice to others. The premise is that its just as important to know what NOT to do, as what to do. Mistakes make the most compelling stories and provide the easiest advice to accept because of their ability to evoke empathy.

cream with your coffee?

Detail shot of the Only Human menu
While beige and tan have always been popular, cream is a color that hasn’t received a lot of love, but is used to good effect here. Especially in contrast to the coffee-esque headlines. The interaction between the serif and sans typefaces is smooth and harmonic. In fact, the most interesting thing about the typography on Only Human is the lack of anything that stands out alone. Rather, the type is well thought out and contributes to the unity of other design elements.

borders and backgrounds

Detail shot of the elegant use of borders and color

their shape implies the functionality of a button in many instances, and their behavior follows suit.

I really dig the interaction between the solid borders and strong background colors used throughout the site, not only the masthead. Not only are they visually interesting, but their shape implies the functionality of a button in many instances, and their behavior follows suit.


Please sir, can I have some capitals?
While the site as a whole is visually appealing, there are some details that could use a bit of polish. The issue that stands out the most to me is capitalization in the headlines. Given that stories are user submitted, it’s hard to control what grammar will show up around the site. However, a simple CSS rule (text-transform: capitalize;) would help mask the errors, although the capitalization would still be imperfect. Such is a risk taken with user generated content.

Another issue that perhaps is more of a pet peeve than a mistake, is the hover effect on items in the left column navigation. The amount of indentation that occurs is somewhat jarring, where I, personally, would’ve preferred a change in background color or some other effect in combination with an underline for those who are color blind.


Overall, the site is well put together and welcoming. I thoroughly enjoyed reading through some of the user posts, and am quite fond of the concept, and the design supports its goals. I’m curious what others think of the site though, so over to you!

  1. Silviu

    I always loved the looks of this website. The problem is that I never really got the impulse to use it. What is the benefit of the submitter? Another social network?!

    I would also mention the beautiful and clear hierarchy the site has(love, the way they use uppercase). A good example is the user profile page. So I’d like to congratulate for their wonderful work(this website is not singular)!

  2. Robby

    I actually like rollover indents on the menu. It has a nice feel to it. Perhaps a little less of an indent wouldn’t be jarring but still achieve the same effect. I agree with you on the capitalization thing, though. Inconsistency really bothers me, and those titles are pretty prominent.

  3. Kari Pätilä

    Only Human was years ahead of it’s time when it launched, and one could argue, still is.

  4. Luke

    @Kyle: I’ve got to say, I actually like that sidebar hover indentation. I’m all for the creative use of css styles for interesting hover effects, especially such daring ones as these. It has a similar feel to the Mac OSX dock magnification.

    @Silvia: That’s not the idea. Submitters will receive the same benefits that they’d get from simply telling a story to a friend. People like to tell stories; people like to give advice. Mostly, submitted stories benefit the reader and the community as a whole, the very same community the submitter is a part of. Communities only work if everyone contributes.

  5. Dennis

    Thanks for the coverage guys. Glad to see people dig the site. We’ll be launching some new features in the next couple of days so definitely check back.

    I would like to say that we did initially have type-transform: capitalize but it would cause some issues whenever someone had a “noun’s” type of title. The possessive “s” would also be uppercase and would look horrid. Trust me, it bothered me too. If anyone knows a work-around to that issue I’d love you forever.

    There’s some other little small tweaks we’ll be adding to the site in the next couple of days so hopefully it’ll fix a lot of those aforementioned rough spots. Thanks again for the love and hope we can keep up to everyone’s expectations.

  6. Kyle Meyer

    @Dennis: A bit of PHP and regular expression work could handle the title capitalization issue. The point you bring up with the possessives is new to me, and quite interesting. I wonder if it’s an intended behavior or a bug.

  7. Dennis


    Is there a ruby way that might be able to handle that? Its a RoR site.

  8. Dennis

    10 seconds on google says yes. Never-mind that.

  9. Rett

    I love the typography and the whole site is really nice. The only thing I’d like to see is some different photos rotated into the header. Not flash, just a different one every time the page loads. Not that I have anything against the older white guy, but it’s not me, and it makes me wonder if the site is for someone like me. Seeing faces of different age, sex, and ethnicity would increase the chance that I identify with the site. Just a thought.

  10. Kevin Zak

    This design makes quite a first impression. Whereas previous articles required one to delve deeper into the design in order to see the thought and aesthetics put into the design, Only Human really jumps out at me as a nice design. It appears to be polished and well-rounded. I don’t see a particular aspect that looks as though it was added later on. Everything seems to flow well with the rest of the design.

    I agree with you concerning the indentation on the navigation. I have never been a fan of using it to separate a hovered element from a normal one. I think that it could be pulled off if it was a little less extreme, but I believe that a background color change would better suit the design. I wouldn’t use anything too bold, but a nice light color would be appealing, in my opinion.

    I wish that the submit button for the search engine would have some kind of hover styling. When attempting a search I was not initially positive on whether to click the magnifying glass icon or the words. I later, of course, realized that they are in fact the same link, but I could not tell by just examining the page. A simple underline on the text or even a background color change on the whole button would help define that aspect.

    I’m not fond of the footer’s background color. The color is not used enough elsewhere in the design (only in links and a few other less-seen areas) to warrant such a giant infusion of it out of nowhere.

    I adore the typography and I find that my eye is drawn to everything in the correct order of importance. I thought the change in border color while hovering over an avatar was a very nice touch. I love the concept of the site as much as I do the design. It is a great idea. Kudos!

    I think implementing the text-transform (in a bug-free manner, of course) is a great idea and will make the site look a lot more professional. Professionalism is such a hard thing to maintain with a user-submitted site such as this, but other than that one aspect, Only Human does a nice job of it. Nice review.

  11. Dennis


    Here’s a question. Is it grammatically correct to capitalize those mistakes? They aren’t technically titles so I don’t know if I’m just fixing a visual thing instead of a punctuation mistake.

  12. Kevin Zak


    I’m no design buff, but in my opinion, you’re displaying those AS titles and they look like titles to me. So in my opinion, yes, you should capitalize them. If they’re not meant to be the title of something they shouldn’t be so pronounced as opposed to body text. The way I see it, they’re the titles of the person’s question.