$wp_cache_home_path = '/'; $wp_cache_slash_check = 1; $cache_page_secret = 'b0f3d271d1bb32c81a8fd217b4871e52'; $wp_cache_home_path = '/'; $wp_cache_slash_check = 1; $cache_page_secret = 'b0f3d271d1bb32c81a8fd217b4871e52'; nthmost » DocPop dot org

DocPop dot org

Cartoonist Meets Coder; They Spawn Nifty Widgets

Doctor Popular was looking for a coder to help him turn his wild creative skills-of-a-cartoonist into a real working website, and he found me. While his previous Blogger-based blog was functionally fine, he needed it transformed into something physically fabulous — without losing all of the hard-won backlinks from other sites over the years, which pointed to the blogger-style URLs of his blog posts.

We met at a cafe for popular kids, hashed out the basics all in a quick early afternoon over some snobbish espressos, and about a day later Doc Pop sent me a complete photoshop template born of his idiosyncratic style, just waiting to be cut up and wired to the right widgets.

We agreed that a move to WordPress would give us the most flexibility with all of the elements we wanted to weave in. So a bit of creative Redirection easily allowed the old blogger URLs to map to the new WordPress-style URLs of his imported blog posts. No problem.

Everything in this website was to be custom-styled. We took many cues from Veronica Belmont’s website for typography, along with the idea to embed a Lijit Search that looked like a tiny unassuming regular old search bar.

The top banners were a bit of fun. Doc Pop had about a dozen little strips he wanted overlaid on a scanned-in MUNI transfer as his title banner, with menu items below it set out to look like white-out with marker on top. The solution involved a lot of careful CSS-based nudging, and then a custom bit of code to rotate a “random” image in on every page load.

We were then able to use a similar image-rotation function to rotate in a different corner graphic depending on time of day. Later, when Doc Pop had his next cool idea, we recoded the corner to pull in his latest Instagram photo instead.  (You can read my write-up of the Instagram hack here.)

Other features:

  • Embedded Doc Pop’s very own font, Hellavetica, for titles and menus.
  • Custom-styled the Google reader sidebar to look like it’s part of the receipt it’s printed on.
  • Unusual, bottom-sticking “footer bar” to hold Recent Comments widget.

You can read Doc Pop’s thought process about his design in this blog post inaugurating the brand new site design as soon as it went live.

This site stands as an exemplar of the kind of speed and simple greatness that can occur when a designer with a vision (Doc Pop) and a coder who just wants to Make Things Go (that’d be me) get together.
Doc Pop's Google Reader feed, styled to look like printing on a receipt
Fun project, fun guy to work with. Also: you cannot mess with a man who rocks a gold-plated yo-yo.

Is docpop.org down? Check out my test site instead.

Share and Enjoy

  • Facebook
  • Twitter
  • Delicious
  • LinkedIn
  • StumbleUpon
  • Add to favorites
  • Email
  • RSS
Print Friendly, PDF & Email