Andrew Gormley

Creating the Path Button Effect with CSS3 and jQuery

I'm really big fan of the recent 2.0 release of social app Path. I think the design is impeccable and the little touches put it head and shoulders above competing apps like Facebook's. Concensus seems to show that one of everyone's favorite features seem to be the button interactions for adding a "moment". I set out to quickly recreate this effect with CSS3 and jQuery.

The How and The Why

I can't remember where, but I recall reading a quote that said good designers can explain how they solved a problem but great designers will explain why. I'm not so egotistical as to call myself a great designer, but I'd like to give a little insight into how and why I designed this site.

Maildrop: A Free Email Template

The other day I was Photoshopping a few designs for email campaigns that I’ve been working on and after about the fourth comp I decided as a public service to start offering the designs I didn’t use as free downloads—both the code AND the PSD. It is with that in mind that I offer you Maildrop.

Media Queries

Since I’ve added my screencast on responsive web design to Nettuts, I’ve gotten a ton of awesome email and tweets asking for a list of all possible media queries. I’m not sure I know all of them, but here’s a brief outline of how to use them and some additional hooks not covered in the video.

jQuery UI Tabs With Previous and Next Buttons

Recently I had a client ask me for what was, in essence, a tabbed interface without tabs. He wanted to have the option to link directly to each one, make them bookmark-able, and the ability to navigate between them with a simple series of previous/next buttons. I immediately went to jQuery UI Tabs as my solution, but how to code those previous and next buttons?

Realign Step 2: Finding a Voice

Now that I know my visitors and their capabilities, it’s time to dive into what they come to my site to see and then begin to build my messaging and branding around that.

Realign Step 1: Finding the Audience

As promised, here is the first of a multi-part series that goes through the process of realigning my site not only to better address my target audience, but to also tackle issues that I’ve noticed or had to work around since the initial launch (over a year and a half ago). These principals could be applied to any type of site you work on, albeit corporate, personal, or otherwise. I hope the method and information you find here proves useful.

I’m Sorry, Dear Readers

I’ve been caught up in a bunch of projects and just haven’t had the time I’d like to dedicate to blogging for any length of time. Fear not, though, as I have some big design-related writing plans coming up.

Mac Web Development on the Cheap

As you (hopefully) know, I’m a web developer by trade. Whenever possible, I try to take time to help other aspiring designers and developers get their feet wet when they make the switch to Macs. There’s a refreshing amount of excellent software for Mac that will allow you to dive headlong into web development with a minimal investment on your part. Here’s a list of what I consider the essential software that you can get for free or inexpensively, as well as a few paid alternatives.

HTML5 Video: First YouTube, Now Vimeo

After getting a lot of (offline) comments and questions about my foray in HTML5 video, it seems like the rest of the online world is also making tremendous leaps away from Flash and towards this slick new method of serving files.