4 ms·
How Design Works
- fiatpandas 15y agoFont rant: year 2012, Windows still cannot nicely render (most) embedded web fonts. Font rendering in my various browsers-> Chrome: horrific, Firefox: pretty bad, IE9: better, but still bad. All MS has to do is put together a designer with good sensibility and one brainy dedicated developer, and have the developer tweak font code until the designer is satisfied and font rendering is just as good as Mac. Boom, the world on the web instantly becomes more beautiful for millions of people, or whatever. One big reason designers like Mac is the font rendering. Everything is wonderful over there. Anywho, carry on.
- keithpeter 15y agohttp://dl.dropbox.com/u/8403291/design-page-screen-grab.png http://dl.dropbox.com/u/8403291/design-page-screen-grab.png How does the font rendering here compare? Its Firefox on Ubuntu 12.04 (actually using Gnome Shell). I've always found Ubuntu font rendering different to other GNU/Linux distributions, and I prefer it.
- intended 15y agoThis is how it looks like on chrome running on windows with default settings. http://dl.dropbox.com/u/17182392/Bad%20Fonts.png http://dl.dropbox.com/u/17182392/Bad%20Fonts.png
- keithpeter 15y agohttp://dl.dropbox.com/u/8403291/design-page-windows7-explorer9.png http://dl.dropbox.com/u/8403291/design-page-windows7-explore... What we get on our Windows 7 / Explorer 9 desktops at work. I actually can't see too much difference between this and the grab from Ubuntu/Firefox. If you can see obvious differences, now you know what you are up against when you talk to non-designers like me.
- intended 15y agoMine is hideous - the absolutely terrible rendering of corners and curves - it makes pages like this abhorrent to read. I should have made that clear - yours looks great comparatively and yes the ie9 and FF versions are close to each other comparatively.
- fiatpandas 15y agoIf I'm judging your screenshot on aliasing/rendering alone, it's very nice (Mac-tier). However, when I look at your screen, I can't help but notice how big everything is on the page. Did you change default font size settings in FF? Could be a GTK issue as well. Text is being occluded in the red circles; the FB stuff at the top is bigger than it should be; the credits to the right are too big. Here's my FF for comparison, which has the sizes right but bad rendering on the body text: http://i.imgur.com/LnY6h.png http://i.imgur.com/LnY6h.png And chrome, being even worse with aliasing: http://i.imgur.com/zFcu1.png http://i.imgur.com/zFcu1.png
- keithpeter 15y agoScreen shot was taken using gnome-core package installed on a CLI Ubuntu 12.04 installed from the netinstall iso. So no Unity desktop. I'm still working out what might be missing or altered in this very non-standard setup. I'll pop another one on later with a default Unity interface as the Ubuntu team intend I've always preferred Ubuntu's font rendering over other distributions/oses.
- dt7 15y agoI use Firefox on Windows 7 on two separate machines, and web font rendering is perfectly fine for me on both. I'm not sure whether its because I tweaked some settings in about:config relating to it? Chrome on the other hand looks terrible for me, and no matter what I do I can't fix it.
- smacktoward 15y agoThey've already done it. Windows Vista and 7 provide an API for text rendering called DirectWrite (http://en.wikipedia.org/wiki/DirectWrite http://en.wikipedia.org/wiki/DirectWrite) that gives much cleaner results. XP and prior use an older API called GDI (http://en.wikipedia.org/wiki/Graphics_Device_Interface http://en.wikipedia.org/wiki/Graphics_Device_Interface), which hasn't kept up with advances in modern displays. The reason why this switch hasn't resulted in a simple "boom, instantly beautiful" improvement is a chicken-and-egg problem. The choice of which rendering API to use is made by application developers; they naturally want to target the one that's most widely adopted. But Vista/7 haven't driven XP out of the marketplace yet. So cautious browser developers stick with GDI. You can see the result in the examples you cited. IE9 is a special case because it's only available for Vista and 7 anyway, so Microsoft was free to move it to DirectWrite. Firefox defaults to GDI, but as of FF4 has optional DirectWrite support (how to turn it on: http://forums.mozillazine.org/viewtopic.php?t=1775755 http://forums.mozillazine.org/viewtopic.php?t=1775755). Chrome is GDI-only.
- Eduard 15y agodesignersthisisnothowyoushouldnameawebsite.com
- mehulkar 15y agoi'm digging all these new long-name-urls actually. they're easier to remember then the ones with randomly missing characters.
- cemregr 15y agoI'm not sure if startups need any more convincing that they need designers, and even at that, this page doesn't do a terribly good job at it by providing a nicely laid out collection of definitions from Wikipedia or uninformative poll results. Also, I feel like trying to recruit designers off Dribbble is like trying to recruit novelists off Twitter. It's hard to gauge somebody's higher level product design skills by looking at 400x300 shots devoid of context. The benefits usually associated with having designers on board come from their empathy and desire to solve problems. "I just want to make pretty things" designers on Dribbble won't provide you this if they are the only designer you have. Last month I was communicating with designers on Dribbble looking for full-time startup work, and I was sadly unsurprised to find out that none of them were interested in solving problems. (Note: I'm a designer myself)
- eamesly 15y agoThe problem is you went to Dribbble looking for a designer. Dribbble is a website for artists. At first, this idea may be confusing because of their job board and the postings which call for the types of people you may be looking for. The reason you can't find anyone you want comes down to the very essence of the site: a place for artists to show off their pixel perfect creations on 400px canvases. Artists aren't that great at problem solving, but they can make really beautiful UI and related imagery. Go there when you need pixel magic, but I wouldn't expect to find the kinds of people to solve high level design problems. You are probably looking for a "design thinker" type. Someone with a brain sculpted by a big consultancy like IDEO, Frog, etc. trained to think about design in terms of logic and creative thinking rather than visuals. But definitely not an artist. Good luck.
- tomcreighton 15y agoWhile I agree Dribbble's limited canvas doesn't really help to find 'designers' as you're defining them, to thus write off everyone on there as 'artists' seems a bit short-sighted.
- designNERD 15y agoTotally agree. I think the word "design" has almost lost all meeting as it can mean so many different things depending on who you speak with. Yes I agree Dribbble is a problematic site. I cannot believe graphic design has been reduced to fractions of the work with no brief.
- duopixel 15y agoAs much as I appreciate Dieter Rams approach to design, I must say that favors one particular kind of design. For a much more encompassing discussion on design (which could include software architecture) this 1972 interview with Charles Eames is mind blowing: http://blog.gentry.io/eames-design-is-a-method-of-action http://blog.gentry.io/eames-design-is-a-method-of-action
- semisight 15y agoI was waiting for someone to say this. The Dieter Rams philosophy has picked up steam, but people would be mistaken to conclude that good design will always be a sort of zen minimalism. The best design is whatever most clearly communicates the message. When I took a graphic design class a while back, my teacher used the example of a pizza flyer. By any standards, they're not minimalist. They're full of garish colors and crowded with pictures--and yet, they work. Personally, I can say that I'm much more likely to buy from a place with that type of ad than one with a "minimal" ad.
- geoffsanders 15y agoThis smells of a resumé rather than a resource... HireMeIKnowHowDesignWorks.com
- bengl 15y agoPerhaps that's what the creator intended?
- geoffsanders 15y ago...my point exactly ;) lol
- milkmiruku 15y agoI'm finding it somewhat ironic that the website isn't responsive and gives me a horizontal scrollbar on a 1024*768 screen.
- DanBC 15y agoHaving the big red fixed box at the top left is causing me distraction. I expect left aligned stuff to hit the leftmost part of that box, but there's a lot of stuff that is not hitting it. And that makes me wonder what the right edge is aligned to. I know nothing about design. I guess I'm used to grid layouts and having everything nicely aligned, and this doesn't feel as if it is. Pictures of different widths on the left are giving me too many different left margins for text. So, some of them are aligned with each other, but you don't see that because they're not all on the same fold.
- keithpeter 15y agoYup, I noticed that by narrowing the browser on my 1080p screen until Firefox showed the horizontal scroll bar. Is the old '960px wide max for fixed width' rule out of the window now?
- benohear 15y agoGood design is, amongst others, making sure your headline font isn't too thin to render nicely on your target platforms and your body text is easy to read. It is also avoiding pie charts in general (see Tufte for an explanation), and definitely those with just two data points. Content-wise, the key message seems to be that AirBNB, Apple and a few others place a high value on visual design and are successful, therefore you should emulate that in order to be successful yourself. I've got to say, it's all a bit superficial for my taste. Others might find it a good starting point, especially for some of the referenced resources.
- overcyn 15y agoIf anything aren't pie charts best with 2 data points? The more slices you get the harder it becomes to read.
- benohear 15y agoYou have a point, but then what value do they add?
- ChrisNorstrom 15y agoLooks. That's all. Pie Charts are terrible for comparing anything because of the way the brain understands and interprets shapes, length, and size as a quantity. Someone came up with pie-charts a while back, others thought it looked cool, and it unfortunately stuck around. http://www.juiceanalytics.com/writing/the-problem-with-pie-charts/ http://www.juiceanalytics.com/writing/the-problem-with-pie-c...
- DanBC 15y agoThe original example - Florence Nightingale's Rose Diagram - is an excellent example of presenting information. Unfortunately, pie charts stuck around and they're usually lousy. (http://www.economist.com/node/10278643?story_id=10278643 http://www.economist.com/node/10278643?story_id=10278643) EDIT: And this article explains the problems: (http://dd.dynamicdiagrams.com/2008/01/nightingales-rose/ http://dd.dynamicdiagrams.com/2008/01/nightingales-rose/)
- deleted 15y ago[deleted]
- wizardhat 15y agoAs a programmer this sounds like some pretentious bullshit. I've done so many UIs where 20 people jump in all thinking they are experts and have long drawn out discussions about how the UI should look, only to change their minds after I've done it and have another round of discussions... Honestly, all the word "design" means to me is "I take so long to get anything done that I must plan my ass off like I only have one shot, and force everyone else to work this way". Just get stuff done, and move on. No ones going to give a crap about your sweet design if your product doesn't do anything.
- semisight 15y agoIf we're talking over-designing, I agree. Design without function is worthless. At the same time, function without design is an ugly cement cube with no windows for a house; sure, it does the trick, but I'd much rather live under the stars than in that.
- Weymouth 15y agoThis is like saying Ruby is numbers and syntax.
- keithpeter 15y agoBrave thing to do, knowing that 'the medium is the message' when you write about design. Ram's 10 principles look interesting. However to read each summary, I had to click the button and wait for the popup. Perhaps the same space could have been used to display the actual text?
- Tzunamitom 15y agoIn my opinion, startups aren't the problem when it comes to design - large corporations are. If I had a pound for every time I've had to fight to include budget for design work in work in a project for FTSE 100 clients, I could start my own VC fund. Why do I need design in my org chart? Process diagram? Status report? Business case? SDLC? Agile framework? Whatever... The best solution I heard of was the concept of a "Simplicity Tsar" - a C-level independent observer with the power of veto on any product (internal or external) that doesn't make the user's life simpler. It's a shame more corporations don't buy into this idea.
- dm8 15y agoSome of the points mentioned in this article are good. Additionally, I believe designer's role is not just limited to "design" but to become the most important cog in the product development lifecycle. I personally believe designers should have strong business sense as well as technical understanding. They must understand the limitations and reality of business as well as technology. Like technology you should never outsource your design completely. Its okay give some design assets to 99Designs etc. but not whole design job. Note to OP: You tried to make this page really visually appealing, but it fails on interaction design. For example, those popups for short summary about Dieter Rams 10 principals are annoying and provide terrible UX. You have to wait for few seconds after clicking each box. Why not simple tooltips? Tooltips are not fancy but they are really useful.
- reneherse 15y agoThis is a good place to start for people uninitiated to the concerns of design. I only wish I had been so concise as an undergrad. The title however, is a bit unfortunate. It's a touch condescending, something that designers should really try to avoid when trying to impart the importance of their craft on an audience. At all costs avoid any trace of snobbery. (We all know the pronunciation of 'design', for instance.) More significantly, the article is not so much about how design works as it is about what design does. That's fine as a starting point, but it's precisely the method of design that multidisciplinary teams need to understand to create truly great products. Dieter Rams's principles are a good touchstone for critiquing one's work, but how those qualities are arrived at, i.e. the process, is the bigger issue and the real "how design works". An article about how the design process can be understood by others and engaged with would be a benefit to the startup community: It's a huge challenge to create the methods and camaraderie that enable developers, designers, and other stakeholders to collaborate and iterate effectively. NB: The site is very difficult to peruse on an iPhone.
- tnorthcutt 15y agoPretty poor viewing experience on mobile (stock Android browser).
- gdilla 15y agoI prefer Mike Lee's explanation of design: UI sets the user's expectation, UX is how well you meet that expectation.
- mkramlich 15y agoCan you succeed with great design? Absolutely. Can you succeed without great design? Absolutely. Does it help? Yes. Is it needed? Well, some kind of design sense is needed. Does it have to be stellar? Does it require an official Designer/Artist? In some cases, yes and in some cases no. Depends on the business, depends on the software. You'd be surprised at how many people will pay you money just to solve a problem or make some pain go away, or to automate otherwise manual tasks. Don't all have to be purty.
- tef____ 15y agodesign, like engineering is about tradeoffs, and flourishes in the presence of constraints. unlike engineering it is often about the cross-domain trade offs. it's a nice love note to design, written by someone who has learned more css than information design. the pie charts are terrible (i'm totally sure he interviewed dieter rams and asked him to put a numerical quantity on the importance of his principles). I can't see a way anyone can interpret the data accurately from the charts he's written. the pie charts are misleading, the bar charts use two different proportions of responses (engineers vs 'biz'). the axes aren't labeled properly (is it % is it number of responses).
- Isofarro 15y ago1.) Use unreadable font for the header 2.) Pick tangentially related, but non-informative images (icons for interaction design). 3.) Ignore how the web works, e.g. incremental loading 4.) Pick low contrast colours for text, because that just interferes with the design. 5.) Ignore the simple thing that design is meant to complement and work with the product. 6.) Spread things haphazardly on the page so there's no natural flow to the content. That's how this site portrays design as "working". And for that reason, I'm out.
- nextparadigms 15y agoWhat I got from this is that Apple actually copies (or steals) the designs of Braun quite a bit. In fact it looks like they go out of their way to make similar designs to those of Braun. I don't understand how a company who does that so often, is so aggressive towards others that do the same thing to them.
- smacktoward 15y agoSaying Apple "steals from" Braun is too strong. (Xerox has a much stronger claim to having been ripped off by Steve Jobs than Braun does.) But it's undeniable that the Jobs/Ive design aesthetic was strongly influenced by the work of Dieter Rams. That's not unusual, though; anyone who works in a creative field (including programming) will know the work of another can inspire you to new directions in your own work.
- mlopes 15y agoHow ironic that this is on a page that is such a disaster, design wise. Gave up trying to read that, after less than 30 seconds.