Jason Robb

Over the past 6 months, I’ve accumulated a hefty reserve of web UI design screenshots, and it’s time I share them.

Unique goal

The goal of UI Scraps is to gather UI design inspiration and discuss good, bad, & noteworthy snippets of UI design. I haven’t seen anyone else specifically doing UI design commentary in the way I’d like to see it. But there are two people who have inspired me to aggregate screenshots and discuss interface designs.

Inspiration elsewhere

A fellow Bostonian, Patrick Haney, has a nice collection of web site screenshots on Flickr and points out their triumphs and shortcomings. Check out his Web Design Inspiration set. The dissection and discussion of specific design elements is the key to his approach. He has a set for Uninspiring Web Design, too. It’s sparse, but it gets the point across, some web sites are a wreck. I’d like to capture bad UI designs more frequently at UI Scraps.

Then there’s Tom Fadail, a friendly chap who runs the site Design Snips. He’s assimilated a collection of web site snippets, then rates and categorizes them. One qualm I have with the ratings is, there aren’t any sites that get rated lower than 2 (I’m only guessing, though I haven’t seen any). It’s appropriate for his site, since it’s an aggregate of good design snips. This site is great because of its brevity.

Lessons learned

I applaud both of these gents, as they’ve inspired me and many others over the years. I plan to take the things I like about each of their projects and add my own spin to the subject.

I like the small scope of Tom’s Design Snips, giving just a taste to whet your appetite. And I like the discussion and elaboration that Pat provides in his photo set. But where they both fall short is the lack of examples of bad UI design. Learning from the failures and shortcomings of ineffective UI’s is extremely valuable, and should be captured.

How to share the screenshots?

I’ve tried to use Flickr to collect UI design inspiration (my photo set), but I like to keep my Flickr photostream for photographs, so that wasn’t the best solution for me. Sharing the screenshots on Skitch.com isn’t as accessible as I’d like it to be. Plus it’s not easy to make screen captures public by default.

Tumblr: for the share?

Due to my limited free time, I’ve decided to use Tumblr. It took a couple hours to get the site set up and running with all the trimmings. Comments via Disqus. I styled one of Tumblr’s prepacked minimal themes to my liking, mimicking this site. And designed another visual identity, which is always a treat for me.

I’m welcoming any questions, comments, or suggestions to make the project better. Feel free to comment here, there, or email me: Jason at this domain.

I love my MacBook Pro, but it’s not perfect. Over the past week, my sweet machine’s keyboard and trackpad went unresponsive intermittently, but my USB keyboard and mouse worked fine. (For the record, this is a 10-month-old, refurbished, 2.2Ghz MacBook Pro.)

It’s a hardware problem

It’s not software related, but due to this ribbon cable being curled/bent.

Putting the laptop to sleep, removing the battery (while plugged in), and pressing down on the ribbon cable brings it out of sleep mode and gives life back to the keyboard & trackpad. Astounding. I discovered how to do this, thanks to a thread on the Apple Support forums.

The fix?

I rolled up a sticky note and placed it on top of the cable. When the battery is locked in place, it puts pressure on the cable, and makes the keyboard and trackpad functional.

Sticky note under battery saves the day

Isn’t that a little unsafe to put a piece of paper under your battery? Won’t it get hot down there? Yes and yes, it will get hot, but if my battery is hot enough to burn paper, I’ve got bigger issues to worry about than a toasty sticky note. So I’m not worried about it, for now.

One of my colleagues, Tony, put it nicely, “You don’t have to worry about sunburn if the sun explodes.”

Dear Adobe,

I want to pick a color overlay for a layer style. But Photoshop (CS3) makes me open 2 windows instead of one to do so. It’s a bit aggravating and wasteful. Please combine these windows.

When trying to change a color overlay, I’m confronted with this:

Naturally, I want to change the color on this menu. Which brings me to this:

But what I really want is both in one, like this:

Wouldn’t that be great? Now get on it, Adobe. Thanks!