Dispatches from the Union
Introducing United Pixelworkers 4.0
We’re back after a month-long hiatus and, as you can see, things are a little different around here.
WHY WE WENT AWAY
The most frequent question we’ve been asked lately is “Didn’t you guys just redesign the site?” Yes. Yes we did. Our last revision launched in January of this year, and looking at the numbers, it’d be hard to call it anything but a success. We’ve sold more tees in 2012 than we have at any other point in our brief history (and it’s not even close). But as much as people liked the last site, we started to see its warts almost immediately. It was the first responsive website we’d ever created, and boy did we make some mistakes. It was a monster, and didn’t run very quickly. There was too much competition among pre-order shirts, so while we sold a bunch of tees collectively, no single shirt was ever able to shine. We had a bunch of in-stock tees, but they were buried in the site and hard to navigate. The month-long pre-order cycle was inefficient: a lot of dead space sandwiched between rushes at the beginning and end. We’ve learned a lot since January. The new site is the result of a lot of accumulated I-wish-we-had-done-this’s, and it was time for a change.
WHAT’S NEW
The biggest change? We’re done with the old way of selling tees: a dozen or more new shirts available for a month-long pre-order window. The new way? A few featured shirts (or even just one), available for a week-long pre-order window, with a foundation of in-stock shirts that are available at any time. The new model allows us to focus the attention on only a few products (like it used to be), it reduces the turnaround time that you guys are waiting for your orders to ship, it narrows the overwhelming choice that we’ve thrown at you recently, and increases our flexibility on the timing of when we run certain shirts. It may look like there are even more shirts to buy since they’re changing so often, but there aren’t.
We’ve built up quite a collection over the past two years. Now you can search, filter, and browse every shirt we’ve ever made. Want to see everything we have available in your size? You can do that. Want to see all the local tees? You can do that too. If we don’t have your shirt (or size) available, let us know on that shirt’s page. If there’s enough interest, we’ll bring it back, and we’ll restock popular tees as often as we can.
You may have noticed that we’ve been giving a lot more stuff away lately, namely conference passes to Web Design Day and the Circles Conference. We’re hoping to ramp that up in the coming months with conference passes, books, software, etc. The web design community keeps us going, so we want to give back in whatever way we can.
Regarding the design and infrastructure of the site, we wanted it to be faster, smarter, responsive, and as resolution-independent as possible. No more just-make-it-bigger responsive design; now when you increase your window size, you actually see more of the site at once. All images are served to you at the appropriate resolution, so you’re always looking at a crisp product shot. All icons (including the logo) are served using a custom icon font. We’re particularly proud of the new header we designed (play around with making the window bigger and smaller to see how it works). United Pixelworkers has long been our experimental lab, and if you’ll allow us to toot our own horn, we think this is the best website we’ve ever made.
CREDIT WHERE CREDIT IS DUE
In planning the next version of United Pixelworkers, we knew we wanted to improve the performance, flexibility, and richness of the experience, so when it came time to make the design flow across the page regardless of window size or serve high-res images to devices capable of displaying them, we were faced with a choice: write a whole bunch of code or find libraries that had the features we wanted. In the end, it wasn’t much of a choice. So many smart people have made useful tools available for free or at very reasonable prices.
Here are just a few of the ones we found to be helpful for this iteration:
- Isotope from David Desandro. Used for our perfect grid layout (with a little assist from our own Matthew Chambers), Isotope is Masonry‘s big brother. It’s all grown up with wicked animations and buckets of options.
- Foresight.js from Adam Bradley. After looking at all the options, Adam’s seemed like it made the most sense. Specify the image (almost) like normal, and use stylesheets to control which image is displayed when. Neat.
- Enquire.js from Nicky Williams. A solution for targeting JavaScript at window sizes that won’t make you pull your hair out.
- jQuery Zoom from Jack Moore. An über-simple drop-in for having zoomable images.
- jQuery Timers, jQuery Form, and jQuery Placeholder
The old standbys that seem like they’ve made it into every project for years:
And, of course, the platforms that make it possible for us to take all your money without having to worry about losing it, Shopify and Stripe.
A modern website can’t exist without the tireless work of hundreds of people who have shared their tools and techniques over the years. We’re especially thankful to the folks above (and, of course, Mr. Responsive Web Design Ethan Marcotte) for hacking their way through the thickest of jungles so that we can be where we are today.
WHAT’S NEXT?
We promised more products, and more products are coming. We asked you on Twitter about hats, and the response was overwhelming, so hats are happening (in fact, the hat saga deserves its own blog post, so we’ll write something up soon). We’ve been thinking about prints for a long time, and they’re coming too. Pixelivery will (finally) launch later this year in a big way. We also want to start offering fun and inexpensive schwag: things like patches, pens, pencils, pin and sticker packs. All that stuff is in the works.
But more than that, United Pixelworkers always deserved to be more than just an online shop, and we’re starting to realize that potential. A podcast is coming to reintroduce you to some of your favorite pixelworkers. A membership program is coming to reward those of you who keep coming back to us time and time to again. And there are a few other big things in our plans that we’re not quite ready to lift the lid on yet.
THANKS
As always, none of this is possible without the continued loyalty of you guys. We started off two years ago selling a few dozen tees a month, hand-writing addresses on envelopes, bringing armloads of packages to the post office. Now we routinely sell hundreds of tees a month (sometimes over 1,000), and the post office comes to us! We’ve sent our tees to dozens of countries around the globe, gotten to work with a bunch of our idols, and seen our tees on the backs of people in Instagram photos, in web videos, and at conferences. Hell, Aaron Draplin even designed our logo. It’s more than surreal. Thanks for letting us do what we love to do. We promise there’s more awesome stuff coming down the road. Stay tuned.
My only regret, i wasn’t aware of this movement earlier. Great work men, love your work and the work of your contributors. Hope to be one of those someday.
Nice round-up. Love the work!