bearskinrug

bearskinrug

A bit of hand drawn type, a bit of illustration, and a hell-of-a-lot of Georgia make up Keven Cornell’s Bearskinrug. While the illustrations may steal the show, the unsung hero is the supplemental type treatments that surround them. But even better yet, the typography within the illustrations themselves are wonderful things unto themselves.

penmanship

Example of Hand Drawn Typography in The Bull Tour

I wish my handwriting was as legible as most illustrators’. But in Kevin’s case, there is some real typographical magic happening in a few of his illustrations. One of the best things about hand written type is that most of the time it isn’t modeled after a particular typeface, so in reality, you’re witnessing the birth and death of a typeface in a single piece of work. A great way to find inspiration.

gray, beige, and georgia

The hierarchy of Bearskinrug

Bearskinrug has an exemplary level of attention to hierarchy, beyond the basics of headline size and color, there is a definite association within the background color of elements, and it works so well you likely wouldn’t have noticed it. The home page begins with the darkest shade of gray behind the most recent article’s headline, with a progressively lighter shade of gray as you move to the lesser items on the right hand side of the page. A subtle technique, but a great one that isn’t seen too often.

There isn’t a variant of Georgia left untouched around the site, and it’s a great example of using a singletypeface to create a sense of unity. It also shows just how far a single well-designed typeface can go when called upon. As far as color goes, things are pretty tame: grays and a bit of beige, which is great for allowing the user to focus on an illustration when it is the focal point of the page.

my, what a beautiful form you have

Oddly, a stand out area of the design is the comment form, are your forms this cool?

Bearskinrug comments

criticism

To be honest, this is one of those sites that I have a hard time finding something to complain about, but there are a few small things that irk me a bit. The main one of these is the use of graphic text when a plain text version would’ve been the better choice. One example being the nifty comment form above, which could have been accomplished with only CSS. This primarily occurs on the previous/next based navigation between articles, where I presume this decision was made in order to have the glow effect on hover — CSS can render small-caps, and the glow as a feedback mechanism is a bit weak.

On the about page, you’ll notice that the second column of content is of the same size as the main column. There are a few parts of this page where things seem out of place, including some of the headlines further down the page being poorly sized. For the rest of the site, this proportion seems correct but it seems to have been missed here.

conclusion

All that aside, Bearskinrug is an excellent site, with an excellent design. If you’re looking for inspiration, there’s plenty to be had from not only the site itself, but the illustrative work within. Kevin is also one of the main illustrators for The Superest, which is also a great place to view some hand drawn typography goodness.

  1. grid

    Sweet article! I may be just late to the game, but I’d never seen Cornell’s personal site before (though of course I’ve seen his illustrations over at a list apart). And The Superest is super-awesome. I’m definitely going to be wasting some time on these sites in the near future.

  2. tzReadz

    Thanks for the review kyle, thought I would point out that Kevin is also a contributor to ALA:

    http://www.alistapart.com/authors/c/kevincornell/

    This site is one that haunts my psyche, and I find myself wanting to emulate the graphic typography especially.

    Checking through the head section, to see if maybe Kevin incorporates sIFR, and he does not at least on the homepage, but there is something called pillowfight.js?

    Kevin’s site description text is kind of a hoot also:

    “The harmonious unification of Design, Art, & Lackluster Humor.”

    What’s not to like about harmonious unification, unless it were disingenuous ;)

  3. kevadamson

    I’m a massive fan of Kevin’s work and his site. The site has been around for a while in it’s current incarnation, and that’s no bad thing as it’s a testament to a very strong and web aware design - future-proof and rather a timeless classic …

  4. Kyle Meyer

    “The harmonious unification of Design, Art, & Lackluster Humor.”

    There are bits and pieces of this time of witty copy all over the site, it’s even fun to read section titles and the like for the chuckles that follow.

  5. Fubiz

    Very nice the concept of typesites!

  6. Kevin Zak

    Very thorough review. I must confess, when I comment on a review I tend to look for at least one point I agree with you on and one point that I disagree with you on. In this scenario, however, I’m surprised to find myself struggling immensely to find something I dislike about the site.

    Even when ignoring the design and looking at the content I find myself at a loss. The author is not only witty, but he eloquently and tactfully conveys thoughts without sounding wordy or discursive. In the same respect, his illustrations are amusing without coming off as childish or nonsensical.

    When concentrating solely on the design, as I said, it is difficult to find an aspect that is in need of much criticism. I have never been a fan of Georgia when it is used in excess, but his design seems to utilize the font’s dexterity to the point where it does not even appear as repetitive. Perhaps the only thing I found that I did not find appealing was his use of a background color when hovering over his primary links. One could probably chalk this up to personal taste, but it is very rare when I find a hover background color without any padding that strikes me as appealing. It just doesn’t look natural. I can understand when this effect is used in lists or even normal links when padding is applied correctly, but when the color ends so abruptly against the text, the result looks so unprofessional, in my opinion. Even a one pixel (or whichever unit of measurement you prefer in your CSS syntax) padding applied to the normal link (so the link’s position doesn’t shift when one hovers over it) and the hover of that link makes it look so much more appealing when hovering.

    The reviewed site is obviously the result of enormous dedication and talent by an immensely intellectual person. A tough site to review because of its highly refined design, but a great one all the same. Nice job on the review, Kyle. I would’ve been completely befuddled when trying to critique the design.

  7. Elyse

    Absolutely beautiful. I love the header, and am of course intensely jealous of his illustrative skills. As someone who uses a bright color palette more often than not, it’s awesome to see a very calm color palette working so well here!

  8. Benek

    I’ve always adored this site! Great review.