Monday April 24, 2006

Hot Chocolate.

v13: Hot Chocolate

If you’re here on the ol’ www domain and not off somewhere remotely viewing from RSS-Land or Content-Aggregationville, welcome. Take off your shoes, grab a pillow and have a seat by the coy pond. That’s right. Feels, good, doesn’t it?

So this is it. The skin of my identity for the next indeterminable length of time. It’s quite a departure from what was here before, but such is my way. I didn’t sign up for the CSS Reboot this year, but I suppose it’s logical to lump this redesign into that event. Then again, I may sign up _ex post facto_-style.

Let’s Talk About Type.

I find that my design inspiration often revolves around typography and color. I’m typographically challenged, but I know what I like and I know what mood I want the type to set (pun totally intended). For this more earthy and Zen-like idea I had in my head, the search was on for a new primary typeface (I still love you, CHANL. We can still be friends.). My logo had long been buried in a stomp box, and, upon moving it out into a position of more prominence, I needed a font that would compliment its angular shapes while still posessing some character. I dabbled quite a bit, mixing and matching fonts with hues. Color schemes came and went — until I settled on the double-barreled salvo of Serifa BT and Clarendon. Serifa BT’s chunky serifs provided a perfect compliment to my logo while its rounded shapes maintained a friendly, woodcut attitude. And Clarendon is just sexy.

On Color and Going Wide.

The color palette evolved from simply taking the time to play. Too often “playing” is perceived as a waste of time, but it’s in those moments of freeform expression and doodling that some of the best ideas can come. Pink was a color I wanted to stick with, as it has become a color associated with this site. I also like it quite a bit and didn’t want to lose it. Brown just kind of fell into place as an interestingly neutral, serene counterpoint to pink. It also reinforces the earthy, woodcut look and feel of the logo and logotype. In retrospect, it’s pretty much the colors of Neapolitan ice cream which is fitting considering my bottomless love of ice cream (and basically anything containing sugar).

This new design also takes a little leap in layout width, from 750 to 900 pixels. To be honest, it feels a bit weird but I’ll come around. And I know you all have monitors the size of Buicks, so I’m not worried. The extra width gave me the space to rock the 3-column layout the right way. My Back In Black design from a couple years back did the 3-column thing, but it always felt a little tight around the waist.

Designing From The Deepest Page.

I don’t recall exactly where I ran across this advice, but it’s sound all the same. With only about 25% of my site traffic entering through the traditional “home” page, it has become apparent that sub pages — individual articles and portfolio pages, to be exact — are my new “landing pages.” That being the case, I designed the deepest page on the site first and worked my way back to the traditional Home page. I’m not sure if doing so affected the design in any measurable way, but I did find myself considering simple things such as “What else would someone reading this page be interested in? How can I make it easy for them to get there?”

Conversational Navigation.

I don’t know if that’s the correct term, but I’m going to use it anyway. I’m a fan of Garrett Dimon’s navigation (which I shall call conversational, again) for the way it wraps navigation in a natural sentence. I like this idea and thought I could apply it, at least in part, to my Home page. While there is no “traditional” navigation on this page, all the navigational links found on the site’s sub pages are present there — just fitted into headlines and conversational elements. It’s a bit unusual, and I’m curious to see how it does.

Goals Accomplished!

  • Have fun.
  • Try something new, and perhaps less “safe”
  • Maintain my identity (and hopefully my brand, but that’s really up to you now isn’t it?) while exploring new visual styles.
  • Use design as a means to revitalize my passion around the things this site expresses.
  • Use redesign as a ceremonial platform for introducing a podcast.
  • Refamiliarize myself with CSS and Textpattern.
  • Implement a consistent, global search.
  • Feature Portfolio works on the Home page.
  • Retire the old “Audiofile” section (links to music, later absorbed by Loving…
  • Add Flickr badge, since I have become more active on Flickr
  • Reduce footprint of Plugged In links on Home page, as that list has been less updated over time (but it’s still relevant)

There will no doubt be endless amounts of tweaking and refinement over the next few weeks, as is my wont. Your comments are always appreciated!


Bradley Scott » 5627 days ago #

I have never been a fan of pink. I have never been a fan of brown. Somehow though…. I really like this new look. Just goes to show that design can find a way to blend things that people would normally shy away from, together.

Congrats on the new design, I like it a lot.

Joshua Lane » 5627 days ago #

It looks really nice Jared. And 200% more beta? Impressive!

Olav » 5627 days ago #

Great job, looks sharp! But using both brown and pink. You’re quite mad you know.

Andreas Climent » 5627 days ago #

The new design is awesome Jared, I really like it!

russ » 5627 days ago #

Love the header
Having some trouble reading the pink on brown in the homepage footer
Miss the tightness of the pink disco skin, but embracing the open flow
Tab order in the comment section is off I think.
nice stuff as always

Michael Bester » 5627 days ago #

Chocolate, Fish and Gum together at last! Yum!

Seriously though, this is a sweet redesign. Great work!

Kelly » 5627 days ago #

Lurker here. I loved your last redesign, even being a so-called pink hater. This new design is just fantastic, with the brown complimenting the pink really nicely!

Well done!

Omar » 5627 days ago #

Awesome. It just works.

Nathan » 5627 days ago #

Really like it…great job.

Garrett » 5627 days ago #

I know I already told you, but this design is so hot. Love the fish and attention to detail. And of course, I fully support the decision to go navigation-less. Buicks. Haha.

Alan » 5627 days ago #

Love the new design. The beta tags are a nice touch too. lol

Justin McGonigle » 5627 days ago #

Yeah, the color choices are really nice. I especially love the header. Your last design was awesome too. Great work.
Don’t ask my why though, must be my aging brain, but for some reason the brown and pink remind me of necco wafers…

Nathan Smith » 5627 days ago #

Dude, that My Little Pony icon is the bomb. Great re-design. By the way, at appears to be pink, but maybe that’s just my monitor. Anyway, good job.

Jared Christensen » 5627 days ago #

* Shakes fist at Nathan * I’ll make you see pink!!! ;)

What pony?

Pierce » 5627 days ago #

I really love this. It’s great. Very warm.

But by gum I loved the previous design. Maybe you can give it to an orphanage somewhere or something. It seems a shame to have it go…

Keith » 5627 days ago #

Looks mighty sweet! Very nice work Jared.

Jonathan Barket » 5627 days ago #

I always considered the old site a source of inspiration, and this is in a whole new league in terms of usability and polish. I especially like the a:hover background on the navigation links, and the very complete collection of icons for headings.

I also have to agree with your choice of using “conversational” links. Several designs ago on my personal site, I combined an about blurb with my navigation links.

Martin » 5627 days ago #

Yeah it’s weird; it looks so wrong yet looks so right.. I’m at a quandary..!

Eric Lim » 5626 days ago #

Loving the colors you got going here, Jared. The pink and brown scheme works even better than your previous design.

Abel Rios » 5625 days ago #

Haven’t told you this yet, but it looks great man. The home page is effective in what it is trying to communicate, and the layout brings it all together nicely. Cup of tea, sir?

Jared Christensen » 5625 days ago #

Thanks for the comments and feedback, everyone! I think most of the major bugs have been squashed (except for one pervasive, possibly unfixable one). But don’t think this moves us out of “beta.” Oh, no. ;)

Abel Rios » 5625 days ago #

(except for one pervasive, possibly unfixable one)

And would that be that big bug across the top, that sorta resembles a coy fish? ;D

Jared Christensen » 5625 days ago #

If you weren’t dead, I’d kill you! :o

Abel Rios » 5625 days ago #

Ouch. Hangs head and gets back to work

Shawn Grimes » 5625 days ago #

Fantastic work Jared. I love the color scheme and the new look all around. I too am fond of the rockin’ pony. Now if only we could that darn pesky tab index bug taken care of…

Mat » 5625 days ago #

Oh no, you didn’t. I’ve been waiting to use the Royal Octopus for just the right project. Way to go and screw it for the rest of us Jared.

Jared Christensen » 5625 days ago #

It’s actually the Royal Tetrapus. No—to be honest, I have no idea what you’re talking about. But screwing it up for everyone else is a surprise bonus!

Jennifer » 5622 days ago #

This is lovely. I am a big fan of pink. It takes a brave soul to use it so confidently. The three columns on the home page are so inviting to read. I feel excited (as opposed to overwhelmed) to explore the content. I’m inspired to do more with my site.

A couple little things I see: On the home page, under Recently Added, the View entire portfolio… link goes to the archive. On the hover on the Bright Corner link is white.

Very nice!

Colly » 5621 days ago #

Man, you’re good. Loved the pink, and when I read that you’d redesigned I feared a step backwards – but oh no.


Cliftonite » 5613 days ago #

Nice work, Jared. This design will likely get you some chicks.

« Older writing is available in the Archives.