Graphic design is visual communication. Can you design a better graphic that communicates NYC “sugary beverage” law changes? (via Charles Go)
Start with our Best Hits on Design
- ⋆ Reminder: Design is still about words
- ⋆ The Typography and Layout behind the new Signal vs. Noise redesign
- ⋆ Backstage: How we use Basecamp to collect, share, and discuss inspiration
- ⋆ Backstage: Using Basecamp to build the Basecamp calendar
- ⋆ Behind the scenes: Reinventing our Default Profile Pictures
- ⋆ Behind the scenes: Highrise marketing site A/B testing part 1
- ⋆ What happens to user experience in a minimum viable product?
- ⋆ Lessons learned from implementing Highrise's custom fields feature
- ⋆ Ten design lessons from Frederick Law Olmsted, the father of American landscape architecture
- ⋆ Flashback: Every time you add something you take something away
Our Most Recent Posts on Design
Signal vs. Noise is a founding member of The Deck advertising network
I was lucky to get a crash course in Rails when production for the new Basecamp was kicking into high gear. But even after a year in the trenches, I wasn’t confident I was Doing It Right™. So last fall I took the Rails for Designers class at The Starter League. Obviously, the class helped me get better at programming. I wasn’t expecting it to transform my design process — yet that’s exactly what happened.
Before you can walk, you have to stand on your own feet.
An interface isn’t just a series of static screens pasted together. It’s a flow, with inputs and outputs. You can’t truly evaluate an interface until you can use it, and you can’t use it until you build it. Anything less than the real thing is a fuzzy approximation.
It’s fine to bring in a programmer when you’re confident that your idea is worth building, but what if you’re not so sure? Now you’ve used someone else’s time and mental energy to make something that might hit the dumpster. That stinks.
This hit home recently when we started working on a new app. Before, we’d make a static mockup or build a few working pieces and then call in a programmer assist. This time, we’ve been able to stay in the prototype phase much longer – almost 2 months – without having to use up a programmer’s time to test concepts and explore ideas. Basic programming knowledge lets us dance without a partner.
You don’t have to be a code master. I am most definitely not. If you can just make things functional, that’s enough to evaluate and a huge head start for a real programmer to make it great.
Are you a designer who learned to program? How did it change your process? Let’s hear it in the comments.
Find more opportunities on the 37signals Job Board.
There are sites, books, feeds, magazines, and movies about “design.” Thousands of people call themselves “designers.”
But have you noticed … “design” never means the same thing?
When I click on some “design” link, I feel like I’m spinning a roulette wheel. Will it be about:
- Grids and Helvetica?
- How to balance trade-offs?
- Applying engineering capability to a non-engineering problem?
- Producing emotions?
- Solving a business problem?
I just saw a cool link on Hacker News. http://color.hailpixel.com/
What is it?
- An interesting implementation because it’s made in HTML5, not Flash.
- A cool style because it doesn’t look like other pickers.
- A novel solution to a problem because the large scale gives access to values you can’t reach in a traditional picker.
- An emotional experience because the immersive colorfield evokes purple twilights and blue-yellow sunrises.
Designing the mobile version of an existing app is about so much more than screen size.
The fundamental concept of the new Basecamp is this: a project on a single page. Projects resemble a nicely organized paper document with wide margins, familiar proportions and plenty of white-space. In a glance you can see what’s happened in the project, what’s left to be done, and any relevant files. You can almost imagine peeling the sheet off the screen and handing it to a co-worker to get them up to speed. It’s an iconic design.
We knew that this design would be instrumental in making Basecamp for iPhone feel like Basecamp so it’s no surprise that we attempted a very literal reproduction in an early version of the app.
It’s all here: the clean, white sheet topped with the project’s name followed by sections with snapshots of the latest Discussions, To-dos, Files, etc. A virtual clone in smaller package. We were pretty happy with this mini-me design for awhile, but the story doesn’t start here.Continued…
Take a tour to see why others use Basecamp every day.
The Porsche 911 celebrates its 50th anniversary. What an incredible run. The 911 has always served as special inspiration to those who believe in long-term iteration. Excellence takes its time.
Click away from the pen tool…
Put down your Pantone book…
Stop rearranging your layers…
Close your stock texture folder…
Log out of your Dribbble…
And god dammit, hug your copywriter…
Designing for the web is still about words.
THAT’S THE THING ABOUT ALL OF THIS. IT’S ABOUT CHOICES. YOU CAN DO ANYTHING YOU WANT WITH A CAMERA, BUT WHEN HULK ASKS THAT ALL IMPORTANT QUESTION OF “WHY?” THERE BETTER BE A REASON FOR IT. AND WHEN YOU GET THAT ANSWER, IT BETTER SPEAK TO THE ACTUAL DESIGN OF WHAT PEOPLE ARE GOING TO FEEL FROM IT. OTHERWISE, YOU ARE NOT IN COMMAND OF YOUR MOVIE. YOU ARE NOT IN COMMAND OF YOUR CRAFT.
A few months ago I made a custom emoji for use in two of our products: Basecamp, the best project management app; and Campfire, IMHO the best real-time team chat.
Why Neckbeard? At first it was a joke—picking up on that Internet meme. But now he’s quickly become one of our most beloved emojis in Campfire. He’s also the unofficial mascot for our neckbeardiest co-worker’s pet projects. Neckbeard also made his way into GitHub and Turntable.fm (thanks guys—shout out to Emoji Cheat Sheet too).
I like Neckbeard so much, and I don’t want him to be limited. I want you and your friends to use Neckbeard in ways that we can’t. I want you to modify him and improve him as you see fit.
Here’s the downloadable vector illustration. The Creative Commons license is below. Thanks for downloading Neckbeard. I hope you have fun with him as much as we do!
License: Creative Commons Attribution 3.0 Unported. You are free to Share—to copy, distribute and transmit the work, to Remix—to adapt the work, and to make commercial use of the work. Please attribute this Neckbeard depiction to 37signals.