| Email not displaying correctly? View it in your browser. |
SitePoint Design View |
Issue 50: September 30th, 2008 The Useful and the Usable in Web Design |
Introduction
The SitePoint Team are back in the office this week after the craziness of last week's Web Directions South conference. Whilst at the conference, Matt got the opportunity to chat with the talented designer behind popular web sites Digg and Pownce, Daniel Burka. Read on for some fascinating insights into the design decisions behind one of the most highly trafficked sites in the world. Enjoy!
Alex Walker
HostGator eats up the Competition with their newly priced plans!
Host Unlimited sites on our Baby Plan!
Along with superior
support and a features like instant backups, 99.9% Uptime plus an all new
45 day money back guarantee you will be glad you chose HostGator. Summary
Daniel Burka Describes Designing Digg
Daniel took a few minutes at last week's Web Directions South conference to chat with SitePoint's Matthew Magain about designing user interfaces, responding to user feedback, the Web 2.0 aesthetic, and more. SitePoint: So why don't we start by telling the SitePoint readers a bit about yourself--your background, and how you came to where you are today. Sure. I got involved in the Web back in '98 or '99. I was in high school, and my brother, some friends and I started getting into web stuff. So we started a small company, and a year later we did a big project with another small web firm that was nearby. The project went really well, and we thought we'd merge our two companies, so we started this company called silverorange. And over the last 8 or 9 years, silverorange has evolved into a very good, boutique web shop. So I was working at silverorange for years, way out in Eastern Canada, and working with groups like Mozilla--I worked on the Mozilla visual identity team. So I worked on the Firefox logo (I helped draw it), which was really fun. I sketched on a whiteboard, and then Steve DesRoches, who works with me, did a pencil sketch of it, and Jon Hicks did the rendering. Don't get me wrong--Jon Hicks gets 90% of the credit, he was awesome. But it was fun to be involved in that project. Then I worked on mozilla.org, which was a big project for me. And then after seeing that work, Kevin Rose hired silverorange to work on Digg, and that project started taking off. I was doing all the work on that, so I'd been doing silverorange for a very long time, and moving to Digg was a nice transition for me without burning any bridges with silverorange. I started working more and more on Digg, and became an employee of Digg, and worked part-time for silverorange. And now I'm creative director of Digg, and that's my full-time gig. Then about a year and a half ago, Kevin, Leah Culver and I started Pownce together, which takes up all of my spare time. SP: Many of our readers aspire to working for themselves, leaving their 9 to 5 so that they can be their own boss. Was that a difficult decision for you to give up something that you helped grow from the ground up, to go and "work for the man"? I don't "work for the man", so to speak. I was very early at Digg--I was the fourth person to be working on the project, so I have some ownership of the project. I'm certainly not a founder, I don't presuppose to say that. But I feel like I've got a great deal of ownership, and I have a lot of say in the direction of a site that it is, you know, a big site that has a lot of influence. And when you're near the tiller of a ship like that, it's a lot of fun. It's pretty crazy that, when you roll out a new feature, 30 million people are using it. That's pretty bizarre. And I'm a co-founder at Pownce, so that's something I have a lot of ownership in, so I don't feel like I'm working for the man, no. SP: Do you have a specific philosophy that you apply to your designs? I don't think it could be expressed as a philosophy. I learn a lot of stuff through working with really smart people, so I was really lucky working at silverorange with people like Steven Garrety, my brother, Steve DesRoches, and a few very good designers. None of us went to design school--this is all stuff that we picked up when we were young, from experience, and from bouncing stuff off each other. When young designers ask me for advice. You know, going to school is great, I guess. But I don't think it's necessary at all. You look at the top tier designers--Dan Cederholm, Doug Bowman. They didn't go to design school. These are smart guys who figured this stuff out. And I think, if I'm asked by young designers what to do, especially if you go to design school, I'd strongly encourage them to find people with like interests and start working together on stuff. Build fictitious projects, and try stuff. I mean, that's the beauty of the Web--it's like the Wild West. You can look at everyone else's source code, you can learn from it, you can see their interfaces. Know what's working and what's not working. Listen to them talking at conferences. If you want to walk that way, if you're a smart, driven person, a classroom is not necessary. SP: Where do you find your inspiration, apart from those names you've mentioned? A lot of my inspiration comes from our users, and watching how people use our systems. I talked about this a bit today, but our users are fascinating! They do all kinds of weird stuff. It's really interesting to take what they're doing and adapt it. Of course, other web sites in our area too--sites like Facebook, for instance. I think the crew down there are doing some really interesting UI work. Even if they're borrowing from Digg *cough*. Ha ha, I'm referring to some of the new UI stuff on the new Facebook feed -- they borrowed a couple of ideas. It's funny. Not to say that we haven't taken a few ideas from them too! And a bunch of the other social networking sites are doing some interesting stuff too. I think last.fm is doing some interesting UI work. And that's how we started too. I'd look at 37signals and think "What are they doing?" If you're smart, and you pay attention, you can tell that [a 37signals app like Basecamp] wasn't just pretty. You could see where the genius was. And you don't need to flat out copy it, but you can emulate it and learn from it and start doing it yourself. I think that's the best way to learn. There's so much going on out there on the Web, and it's all so public. SP: This phenomena of sites influencing each other, and users influencing design--are the days gone where a print designer can bring anything to the table? Hmm. I read magazines, and sure, I get some influence from print. But I don't have a print background. I'm mostly looking at the Web. SP: Surely we're seeing a resurgence in print influence, though? People like Mark Boulton are talking a lot about grids, and we're hearing lots about elegant typography ... all of these traditional print concepts are coming back into the fray. Maybe, but these aren't things I focus on a lot. I'm so much more focussed on interaction stuff, particularly with stuff like Digg. Don't get me wrong, I don't think that typography is unimportant. But on a site like that, there's so much content that has been entered by users, and it's so unpredictable in many ways. I've never been focussed on making it look a certain way. It's more free, flexible, and I'm OK with it being a little "dirtier" as long as people are able to push it around and do crazy stuff with it.
BUILD SITES ON GOODBARRY. MAKE HIGHER PROFITS. SAVE MORE TIME.Hi, I'm Barry. Allow me to introduce the best way for web designers to build online businesses without coding and faster than ever. With GoodBarry, you can:
Ideas, Aesthetics and MetricsSP: What advice would you have for designers who are used to designing for static content? Let go! Of course, there are some things that we obviously box in--you can only make titles so long, you can only enter so many characters in a description. But the biggest thing is the philosophical idea of not worrying about it. It's cool! For example, I once did something on the Digg site design where I didn't expect a certain number of diggs to happen within a certain period of time ... and it broke the layout. You know, we fixed it! It's not a big deal. Stuff like that happens. Let go of that control, don't sweat it. And take inspiration from what your users are doing, rather than boxing them into doing it one way. SP: So does user-centred design impact or restrict your vision for the site? User-centred design is the only thing I think about--that's the critical aspect for designing Digg or Pownce, or any of the web sites I work on. All I care about is how people use the site currently, and how they will use it, depending on what I do. SP: Do we need ideas any more then? Or should we just let our users tell us what we should be doing entirely? No, no, our users don't tell us what we should be doing. Our users guide us to what the problems are. They'll sometimes make good suggestions, but usually they're suggesting a specific thing when they really mean a problem. An it's up to us to find solutions to the problems--like the Henry Ford maxim that I mentioned in my talk today: "If I had have asked my users, they would have told me they wanted a faster horse." Anticipating beyond what our users can imagine. Having the feel to make that logical jump to the next level. That's where the real genius is. SP: Let's talk about the visual aesthetic of Digg. It's very common for someone to say "the design of Digg has some gradients, it has some rounded corners--it's Web 2.0". What's your take on that? I used to make fun of Kevin a lot for saying "Web 2.0", back before it was a common term. It's such an empty, vapid thing to say. Especially the "Web 2.0 aesthetic". I mean, granted, I've been involved in it--like the Mozilla site. But I blame Cameron Adams for that! His site, themaninblue.com, with those gradients. I was influenced by that! So when I designed the Mozilla site, I put gradients everywhere. So I think he inspired a lot of people to start using them! I don't think he would like it if he knew I was blaming him ... But I think there is this notion of friendliness, and because we care so much about people participating, we want it to feel easy for them. So you end up with that toyish, easy feeling: rounded corners, pastel colors--these kind of things became common because we wanted to put people at ease for participation. So it's not just an aesthetic. That was definitely my mindset with Mozilla. The previous design was black, and red and brown--it was very harsh. Almost a brutalist style, and it was intentional. They had this whole socialist thing going. But it was very inaccessible, from a branding standpoint. It wasn't friendly--you know, a mother of two wasn't going to go installing Mozilla [based on that site design]. It felt like a hardcore product. And at the time, Firefox was trying to break into the mainstream, and that was my thought: bright, friendly colours, a nice, simple aesthetic, which was basically the idea. And that carried into something like Digg. Those projects back on to each other for me, so I was in that mindset. SP: In your presentation you spoke a lot about metrics, and about using information about how people really use your site to influence design. So what do you think about surveys? Should we be running them? What should we do with the results? And how much weight should we give the responses? A certain type of person is going to fill out a survey, so automatically put that into your weighting. But surveys can be quite useful. We did one on the recommendation engine on Digg, and it resulted in some good data. But I wouldn't use surveys as your sole means of getting feedback from people. Surveys come across as quite tainted, so there's a lot of deciphering to be done with a survey. I think doing user testing, task-based analysis, and focus groups; bringing in a more targeted set of users is probably more beneficial. But it's more work than a survey too. SP: What kind of tools do you use in your craft? Do you sketch or draw thumbnails, or jump straight into Photoshop? I'm not a paper person--I'm really terrible. I whiteboard big, broad ideas. For example, Kevin and I have been doing some date planning for Digg lately, and we've done a bunch of whiteboarding lately, which has been really useful. So he and I will just disappear into a room and just whiteboard. But I'll go straight into Photoshop. I'm really comfortable with Photoshop. I still like making perfectly realistic comps that look like I'm actually developing. My brain works that way. And I use Coda as my coding tool. That's pretty much it. SP: The amount of data that Digg generates has allowed you to have some fun with visualisations, like the BigSpy, Swarm, and some other Flash stuff. Yeah, it's all built by Stamen Design. We hired those guys and they're good friends of ours who work just a few blocks away from Digg. SP: And is there anything that you can tell us that's on the cards for the Digg labs? I can't, sorry! We're holding that one close to our chest. SP: On a final note, are there any books that you would like to recommend or share with our readers? Yes! There are several books that I absolutely love that aren't about web design, but have lots to do with web design. One is How Buildings Learn, by Stuart Brand. Seriously, it's an amazing book. Two is The Death And Life Of Great American Cities, by Jane Jacobs, who sadly passed away a couple of years ago. A brilliant book! It's about urban design. For example, it explains how wide sidewalks should be for optimum behavior, so that children can have enough room to play, but if the sidewalk is too wide, they're too far away from observers, so dangerous things can happen. So many of these kinds of ideas extrapolate to the Web. And then of course there's Edward Tufte: Envisioning Information. As for books that are specifically about the Web, Dave Shea's book about the CSS Zen Garden is great. And the really old book by Kevin Cox, called User Interface Design. SP: And any blogs that you discovered recently that you're enjoying and would like to share? The Canadian Design Resource weblog, which posts print and industrial design, is a great site. The Big Picture, which is from boston.com, is amazing. They've started posting photo essays every two or three days, but they're 600-pixel wide, huge images. They did one for the Olympics, they did one for earthquakes ... they're amazing. Huge, gorgeous images every two or three days. Put it on your RSS reader. They make Digg all the time. SP: Thanks for your time Daniel. Thanks a lot Matt, that was really fun!
How do you create rich Internet apps fast? Apply Adobe ColdFusion 8 to your business.
That's all for this issue -- thanks for reading! If you're interested in reading further coverage of the conference by the SitePoint team, be sure to check out the following posts:
We also have some more interviews with many of the thinkers and doers of the Web going live on sitepoint.com over the next couple of weeks, so be sure to check in regularly. I'll see you in a few weeks.
Alex Walker
 |
Latest Release
Free Book Samples
Latest TutorialsMap Your OpenSocial Data Using Flex
Jina Bolton on Creating Sexy Stylesheets
Hacking JavaScript for Fun and Profit: Part I
10 Rules for Driving Traffic Using Forums
Hot Discussions
New BlogsWeb Tech |
||||||||
Help Your Friends OutPeople you care about can benefit from the wealth of information on new and maturing technologies available on the Internet. Help them learn how to do it by forwarding them this issue of the Design View! |
|||||||||
You are
subscribed as :
Unsubscribe from this list. Mailing Address:48 Cambridge St, Collingwood, VIC, 3066 AUPhone: +61 3 9090 8200 |
Welcome to Design View #50.
Whether you are a web designer,
or a small site owner; HostGator offers a web hosting plan to fit your
needs. With their 
Based in San Francisco, Daniel Burka is one of the
founding partners of silverorange, a Canadian web development company.
He's also the lead designer at the news web site 
Adobe® ColdFusion® 8 software makes RIA development
easier - and quicker. And you can use it for small or even
enterprise-class deployments.
The
emerging OpenSocial standard is a powerful new API for creating exciting
new mashups. In this tutorial, Jack shows how to mix Google Maps, Flickr,
and OpenSocial using Adobe Flex. Take the quiz at the end for your chance
to win a book!
Jina
Bolton is a designer and artist, working and residing in Silicon Valley. In
this candid interview, she reveals where she finds inspiration for
beautiful design, why she is fascinated by sushi and robots, and what
makes a style sheet "sexy."
Ever
wonder what makes a real JavaScript guru? How about someone who has used
JavaScript, CSS, and HTML to successfully implement a 2-D side-scrolling
platform game? In this two-part series, Myles will help you elevate your
JavaScript skills to the ultimate level!
We all
know forums are a great place for networking, getting advice, or getting
answers to problems we couldn't solve on our own. But did you know that
your participation in a forum can drive high quality traffic to your site
too? Josh explains why.