A Responsive Retrofit: Frostic School of Art

Frostic School of Art HomepageA long, long time ago, in a gala… I mean when I was but a mere student of graphic design, I designed a really cool website for the Frostic School of Art along with fellow student, Max Millermaier. When it was time to build the site, I was hired on after graduation to do so. So in the summer of 2009, I was so psyched to launch, what at the time was, a bleading-edge, video-background website. Fast forward four years and the site was starting to feel sluggish, dated and disjointed.

A few months back I started thinking the Frostic School of Art’s site was a prime candidate for a makeover. I didn’t want to completely remake the site. Instead I decided it just needed to take advantage of the latest trends and technology. I dropped the dreaded use of Flash for videos and replaced them with HTML5 video, thanks to BigVideo.js.

iPhone screenshot of Frostic School of Art websiteThe next step was to make it mobile friendly. I’m a huge fan of responsive websites and have dabbled with them for a while now. I recently did a project that used the Skeleton boilerplate and found it to be very easy to use and produce great results with. I set off to re-write the whole site on top of the Skeleton. It wasn’t a small task, but in doing so I removed a lot of messy and redundant code. Like I said, the original site was made in 2009. A lot has changed in the Web world, and I’ve learned a lot too. Now the site looks awesome whether you’re on a desktop, a smartphone or a tablet.

Another goal I wanted to complete during this process was clean up. Over the years, files, directories and content became a mess. By starting from scratch, I was able to cleanup a lot of the mess. Now the end user should have an easier time getting around the site and finding what they’re looking for. There’s still some work to be done, but it’s already improved leaps and bounds.

Overall, I’m quite pleased with this retrofit. It’s not always an easy task to take an existing site and slap on a responsive framework. I suppose in a way, I didn’t really do that. I more or less rewrote the site, staying within the design guidelines of the original, but replacing almost all of the underpinnings. It was interesting to revisit a design from four years ago, and I’m happy with the results. What do you think?

Screen Shot 2013-05-15 at 2.48.09 PM

The User is Drunk

User experiences and interfaces are some of my greatest interests. My love of design and technology fuels this, but even in everyday life I am constantly thinking of user experiences. Whether it’s using a self-checkout at a supermarket or driving through a round-about, my mind is always thinking of how it could be better or how clever it is. That’s why I really enjoyed this little video called “The User is Drunk.” It’s a humorous take on user interfaces, but it makes very valid points.

When I’m designing websites and other interfaces, I’m always trying to keep things simple, elegant and most importantly easy to use. The video points out imagining the user as drunk is one way to ensure your end user’s experience is a good one. My personal rule of thumb has always been, “Can my mom use this?” but “the user is drunk” works too. Either way, the point is the same. Interfaces shouldn’t be complicated. A user shouldn’t have to have a computer science degree to fill out your form. In the video, he brings up the point that a good user interface disappears  I couldn’t agree more. The less you notice an interface and just get done whatever you were trying to do, the better.

Enjoy this little video, and pay attention. There are some great points in there, even if the title is a bit funny.