I once again had the honor and pleasure of working with my favorite contemporary artists, Teresa Hubbard and Alexander Birchler, this time to redesign and refresh the duo’s web presence. I created the first version of their site back in 2004 and it was time for an overhaul. This design is much cleaner and brighter, highlights their excellent body of work, and creates a framework that can be built upon as new pieces and publications are added. Some portions of the site are still a work in progress, so check back soon for further additions.

Always an honor to get to improve upon a personal favorite!

Some of my earliest childhood memories are of reading the newspaper comics: youthful confusion about the differences between Garfield and Heathcliff, Marmaduke and Howard Huge, the Lockhorns and the Family Circus, wondering who was reading those giant-yet-boring Prince Valiant strips on Sunday, pondering the bizarre evolution of Robotman. I’ve read the comics religiously ever since, missing only a handful of days over the past 20+ years. But there were so many strips I simply ignored, convinced they were stodgy hangers-on from decades long past, or else that they were unfunny legacy soap operas not worth the time to investigate.

Thankfully in 2004 Joshua Fruhlinger started reading the comics so we wouldn’t have to. His curmudgeonly commentary had an opposite effect, though: hundreds of thousands of people suddenly began to appreciate Mary Worth for all of her meddlesome glory, found themselves able to recite the sordid back stories of the girls of Apartment 3G, and learned new ways to determine whether or not you might in fact be a Plugger.

The Comics Curmudgeon is one of the few sites that I visit multiple times a day right in the browser (despite its handy RSS feeds), so it was a great honor to be given the chance to do a facelift of the site. Since I look at it so often, I figured I’d better do a good job. Not to mention that if I broke what was already a cherished site, I’d surely be mauled by his sizable community of rabid comics fans!

Some of the highlights of the redesign:

• An awesome new logo up there in the header depicting Josh as drawn by Ces Marciuliano, writer of Sally Forth and creator of Medium Large
• Brand new, handcrafted WordPress theme, designed to retain some of the lo-fi, Verdana-heavy charm of the old site while cleaning up the layout and typography considerably
• A new jQuery-based @reply system for the comments section, modeled after the ad hoc format that his community evolved and had been manually typing in — his posts often reach 500+ comments, so this helps keep track of who’s talking to whom a bit
• A new Advanced Archives page that lets users build the archive they’d like to see (ex: “Show me this month’s posts about Mary Worth that contain the word “meddle”, in ascending order, five per page”), also allowing for easy bookmarking of their search query
• Cleaner, lighter code and speed optimizations on the server side to help offset the time it takes to pull down the large daily comics
• A flexible “jello” layout that expands and contracts depending on the size of your browser window, to add a bit of whitespace and breathing room without breaking things for folks on smaller screens
• iPhone and “other” mobile versions of the site (which double as low-bandwidth alternatives for those on dialup who’d like a speed boost) with AJAX comment loading

Hopefully it’s all a change for the better (I think it is!), and I look forward to hearing the feedback!

Another freelance project from this Fall: a minimalist and crisp portfolio website for Austin-based photographer/artist Adam Schreiber. This hand-built site leverages clean HTML and jQuery to display his works in a custom set-based image gallery. He’s had great shows at the CRL and Art Palace, and is currently featured in his first museum show at the Contemporary Arts Museum Houston until February 7, 2010, so if you’re in the area be sure to check it out!

Last Summer I was asked to help design a website “brochure” for the new eClass Distance Education program, a new graduate-level legal education offering at the John Marshall Law School in Chicago. I designed the basic look-and-feel of the site for them and the structure of the single-page concept with custom jQuery scrolling effect. The final coding and layout was handed over to the JMLS web team, who fleshed it out very nicely.

Trying to keep up with the proverbial Joneses, today we launched an iPhone / iPod Touch mobile web app for the University of Texas School of Law. If you want to check it out on your iPhone right away, fire up the following link in Safari: http://www.utexas.edu/law/m/

I built it from the ground up with PHP, JavaScript, and a bit of elbow grease, pulling data from a handful of existing sources both on-campus and off. It makes use of the iUI JavaScript framework, which is a great resource for getting up and running quickly (but which also has some drawbacks — I’ll likely switch to pure jQuery for the next major version, but I’m also keeping an eye on the jQTouch project). A quick rundown of the features of the web app:

• Directory Search — if you’re affiliated with UT Law School you can search our internal phone and email directory by name or department, using the native iPhone apps to place calls and send emails directly,
• Event listings and Notices pulled from our existing calendar and Law Mail announcement systems,
• RSS feed view of our press releases,
• Recent Twitter posts from our Communications office (this will make more sense when/if we have more than one Twitter account posting official news, and can combine them into one stream here),
• Maps: detailed building maps, Google maps that use the iPhone location services to guide you to our building, KML-based maps of public parking, nearby hotels, and restaurants,
• and a psuedo-iPhone style photo gallery that’s pulled from our existing mini-gallery on the regular website, adding the ability to flick through the images (did you know that Mobile Safari adds nifty JavaScript events for multi-touch gesture support? I didn’t until this project…)

There are a lot of things already in the works for the next iteration. The number one goal is to support other popular devices, to live up to the ideal of “one web, any browser”. As a developer who has wrestled against the wide range of inconsistent desktop browsers and all of their HTML and CSS inconsistencies over the years, though, it was really, really, nice to work with a single browser that already supports HTML5 and CSS3 presentation out of the box. Now I’m spoiled.

The first of my summer freelance projects is now live: the portfolio site for fabulous packaging designer, Christy Carroll. Love her work! Christy crafted the visual design for the site, and I implemented it in WordPress with a completely hand-tailored jQuery portfolio browser for the homepage. More to come soon…

Freshened up my personal blog and portfolio site for 2009. While similar to the transitional look and content that you’ve seen for the past couple of years, this theme has been hand re-written from scratch and features many advancements over the old style. The entire site is better integrated through WordPress than ever before using features newly available in WP 2.7.1 (gravatars, per-post styles, threaded comments, etc), a handful of customized plugins, subtle jQuery enhancements, and Subversion to tie it all together on the backend. I’ve also moved to a new domain after about ten years of being at asnorwood.com. All of the old links should still point to the right place (or get you pretty close), but let me know if you find something missing.

The bulk of the improvements are behind-the-scenes, but I can at least say that the following changes make my life easier and me happier:

• Uploading new portfolio work is much more straightforward.
  No more need for a separate gallery plugin!
• The category and link organization is more sensible! Tags, too!
• Better error-handling — hopefully you won’t end up 404 Not Found, but you at
  least have a sporting chance of getting unstuck now!
• The search engine optimization (I hate that term) seems to be working
  already, too. Thanks, Google!
• The search form pulls up better, more accurate results!

All of this tech stuff is secondary, of course, and I’m still trying to decide how best to balance the blog entries between my different interests. Maybe I’ll eventually split off into two or more distinct sites to keep things from rambling together. I’d also like to figure out a better way to incorporate the side-channel links (currently I’m using del.icio.us) and scrap-collecting elements (I love Tumblr for gathering quotes and other detritus, but not sure how best to tie that content in with my main site). Being nearly the fifteenth anniversary of my first website, you’d think I’d have this all figured out by now!

What do you think? What would you change?

Another fairly straightforward WordPress theme built from the ground up. This time it’s for Marsha Riti’s secondary blog, MIXED BAG, which collects her project instructions, recipes, and Craigslist finds from around Austin (are you obsessed with midcentury modern furniture and weird old junk, too?).

A quick but cute WordPress site for budding Austin children’s book illustrator Marsha Riti, designed to highlight foremost her paintings and sketches. After looking at so many other illustrators’ sites with slow-loading Flash intro pieces, broken navigation, and missing content, I vowed to keep this one clean, accessible, and friendly.

The WordPress-powered Bleep Labs site was commissioned by good friend Dr. Bleep himself, purveyor of fine homemade analog synthesizer noise toys. His best-known product is the Thingamagoop, co-designed by cartoon legend Goopy. It’s the beloved device seen above (and more notably seen in MAKE Magazine, boingboing, Wired, and in the hands of some very popular musicians).

I especially enjoyed building the  custom jQuery color picker for the Thingamagoop — it’s lightweight, works in all browsers (including the iPhone), does its best to be accessible, degrades nicely if JavaScript is unavailable, and runs purely off of an XML list of colors currently available.  It also felt great to be working with a product that itself is so nicely designed.

Today sees a new homepage for the University of Texas School of Law. This iteration is more of a realign than a redesign as the decision was made to keep our interior pages intact while we continue a long-term look at our branding and online presence. The biggest design challenge was creating something cleaner and more useful for our visitors while retaining most of the same content and enough of the previous design to tie it in comfortably with our current site’s look-and-feel.

Realignment

The new version emphasizes our communication pieces, changing the rotating banner graphic into something more dynamic: the accompanying text is now HTML-based and will link to richer features similar to our Clinical Education stories. Our previous 75×75 pixel highlight buttons (which themselves were reduced from the intricate 200×140 highlight graphics of two years ago) have been folded into our general News list to help simplify the page. The navigational links were dramatically reorganized to make the hierarchy clearer and more contextual. Everything’s still there, it’s just been reshuffled.

Make it pretty

The goal aesthetically was to reduce the homepage’s clutter and to make the information presented more visually balanced. I designed the old homepage, so I’m to blame! To accommodate the larger banner graphic I increased the width of the site to 840 pixels, and then subdivided that width into a five-column layout. The typography is much more consistent, and care was taken to align the text vertically on a baseline grid. The colors are lifted from the previous version but greatly toned down — far less orange, no more crazy orange-stripe-gradient thing, and a nice white background with some subtle color at the top. Still feels like UT, but doesn’t scream it, and the new design continues to match our internal pages.

Behind the scenes

I’ve shifted the site from Transitional to XHTML 1.0 Strict and have made greater use of XML for the maintenance of the feature stories and news items. The layout and typography are all still handled with plain CSS: if you strip away the stylesheet, you’ll find that the homepage is semantic, streamlined, and very navigable with screenreaders or other assistive technologies. Text can be adjusted in the browser to just about any size without breaking the layout. We’re also sporting a bit of hCard markup so that folks can easily scrape our contact and location info into more useful formats.

Hopefully the refresh is just what we need to help carry us along until the sitewide redesign. I think the updated technology and cleaner look will do a lot for us, and it should help increase our visibility as one of the top-ranked law schools. If you have any comments about the design or about site refreshes, I’d love to hear them.

The new Clinical Education at UT Law site, showcasing the large number of community outreach programs available at the school that bring together upperclass students with real-world legal experience and service.

I designed all of the branding for our in-house technology department at the UT School of Law, including the logo, color scheme, and website. The department had recently undergone a restructuring and a name change (we were formerly called “Internet Initiatives”), and it was time to reposition ourselves as a more service-oriented and forward-reaching organization. This particular graphic was used as “marketing” for our site in the form of mouse pads given out to all faculty and staff.

I’ve been commissioned on three occasions to make print ads for the University of Texas School of Law to appear in CLEO Edge magazine, a publication for minorities seeking information about education in the legal field. I don’t usually do much print work, so I enjoyed having the chance to lay out some type, play with CMYK inks, and work with the excellent photography of Mark Rutkowski (which I heavily tweaked in Photoshop — sorry, Mark!).

When I revamped the UT Law homepage back in 2005, one of the previous homepage’s design elements had to be sent out to pasture: the single “rotating” highlight button that accompanied each major news or event announcement. They were very time-consuming for a tiny shop like ours as they had to be made by hand using Photoshop each time an event came along, and setting the type was always tricky (there’s a reason that the newer design featured buttons separated from their headlines!). I miss working with these, though — they were a good exercise in design, photography, and typography. Above are a handful of my favorites out of the hundreds I ended up creating.

In early 2004 I started working as a temp worker at the UT School of Law, and within the next year I was working on redesigning the visual look of the entire site. I reworked the previous homepage extensively, keeping most of the content while aligning to a strong grid and refactoring our previous single “rotating” highlight graphic into the multiple news photo buttons and the single large banner feature. The navigation was changed from dicey old JavaScript into purely CSS-driven drop-down menus, there was much more room for secondary action items like the “Apply Now” button, and users reported being able to find what they were looking for much more quickly. This homepage lasted until 2008 when it was superceded by a related but much cleaner design.

This was the principal look and layout of my personl site circa 2002–2006. Content was limited to my portfolio of art, sketches, and some design work, along with basic contact and bio info. While I hadn’t gotten up to speed with web standards by 2003 (the layout was all tables and presentational tags, oh no!), the site was entirely written in homemade PHP, using image file metadata to handle the portfolio and navigation. As far as I know, it was also one of the earliest uses of the “CSS repeat-x with single-pixel-wide images gradient background effect” on the web. (At the time I thought I had invented the technique…maybe I did? Nah.)

An alternative design mockup for the VDOSports.com homepage — you can check out another interface concept here. Definitely a product of its time (in the year 2000!). This design included a Flash navigation menu co-developed by good friend and colleague Aaron Conover.

Interface design mockup for VDOSports.com, an early video-sharing site for extreme sports amateurs. It wasn’t a bad idea, really, and seems downright obvious in the wake of YouTube and its ilk: anyone could mail in or submit video footage of their wakeboard, kite surfing, waterskiing, whatever, and it’d be rated by professionals in that sport as well as by the wider Internet community.

This logo I did back in 2000 for VDOSports.com, our extreme sports online video-sharing site that never got off the ground before the parent company folded. I ended up kind of liking this logo, if not the name it represented. At least it made it onto t-shirts and other company collateral for when we paid some extreme sports conferences a visit.