Live data from Hacker News

Ask HN: Recommendations for learning and improving UX/UI skills?

news.ycombinator.com

31–40 of 52 posts

Re: Ask HN: Recommendations for learning and improving UX/UI skills?

#31
post #17

I'm going to go out on a limb here and say that books, articles and conferences are totally insufficient to become a good (UI/UX/User centred/etc) designer. Here's an analogy with physical fitness. If you want to reach "competition level" fitness you don't just watch youtube videos and read books. You have to practice. And if you practice alone, you'll never hit competition level. You need formal TRAINING. You need a…

There's a certain extent to which you can be your own coach. You still need to practice, but you can monitor your own performance if you can train your eye faster than your abilities. Training your eye involves a combination of noticing and analyzing interfaces around you (good & bad), reading texts on design, watching talks, and having conversations with friends and colleagues about design. It's especially important…

agreed; there are some things you just can't learn without proper training, but if it’s something fairly straight-forward, you can get pretty far in studying common practices and trying things out yourself.

there’s a huge wealth of knowledge out there in just looking around you. my approach (not a pro at all) when designing anything really is just to look for cues from others. there are a lot of resource-rich players that have invested a lot in UI/UX design, and, the great thing here, is that much of the pay-off from those investments is freely available; just look at their products.

this is especially true on the web where it’s so easy to find and compare sites or apps related to what you’re doing. if you take the time to examine them closely and look for commonalities, you’ll generally find many of the more successful sites share a lot in common when you get down to fundamentals (though they may look and ‘feel’ very different). the ‘artistic’ aspect of UI/UX gets the majority of attention (and, in my opinion, is the hard part to master), but what makes or breaks a design is usability, and that you can learn fairly easily.

at the very least you end-up with a product that works; and this is the most important element in UI/UX. from there you can learn to perfect it and make it look amazing, but that takes time and experience.

Re: Ask HN: Recommendations for learning and improving UX/UI skills?

#32
An alternative approach:

– Start by reading "Magic Ink" by Bret Victor: http://worrydream.com/#!/MagicInk

– Now you understand that UI design is actually graphic design, so start with graphic design fundamentals. They are: Drawing, Layout, Typography, Color, History.

– Drawing: understand how images are created on a canvas. Includes concepts of how to use line, shade, and color to create forms, volumes, depth, etc. Art historians talk about "color and line" in painting. Understand the distinction. Pick up a used copy of Janson's History of Art. Peruse some other books about drawing. Go to the museum. Whatever you come across. Have fun with it.

– Layout: I haven't found a great resource for this. You can have a look at Grid Systems by Josef Müller-Brockman, which set the tone for layout in the 20th century. Making and Breaking the Grid is a modern spin on grid-based layout. Read about book design since that's the oldest and most developed layout system. You can start with Wikipedia: http://en.wikipedia.org/wiki/Book_design. Generally pay attention to how websites are arranged. Is there a top-bar or a side-bar? How many sections of content are there? What is their relative proportion? How does the layout relate to the borders of the browser window? Take some time to investigate 'responsive design'. Understand what it means to design from the content out rather than from the edges in. Understand the fact that book design has a rich set of systems of proportion while web designers completely ignore this for the most part. Look up 'golden ratio typography'.

– Typography: there are a number of well-regarded classics on typography. The Elements of Typographic Style is great. But you should start with this: http://webtypography.net/. Then check out the Wikipedia entry and Google around for blog posts about typography. Once you understand the basics, then attempt an in-depth text. The most important thing to understand is that typography can be used to create structure. People who do not understand this use lines, planes, and volumes to create structure around content. A good place to learn about this is in Edward Tufte's The Visual Display of Quantitative Information (as well as its sequels). He vigorously recommends removing as much "non-data ink" as possible. Beyond structure, there is the issue of choosing typefaces. Let me just get this one out of the way: serif faces are not significantly easier to read than sans-serif faces. Beyond that, understand that typefaces are created by designers for different uses. Use typefaces according to what they're designed for. Understand how typefaces are used to create a stylistic feel, to evoke associations, nostalgia, emotion. Understand that some typefaces are expressive and some are not. The web so far has favored non-expressive typefaces. Now that we have @font-face and Google Fonts, people are going crazy using different type-faces will-nilly. Web design will evolve. Watch the documentary "Helvetica".

– Color: there are many resources on color, but the study of color is an endeavor that can last a lifetime. There are a few things to understand about color: what it is (light frequency / a sensation), how it is modelled (Newton vs. Goethe, HSL/RGB, color spaces, Pantone), how it is created, how colors are combined, the fundamental nature of each hue, and psychological meaning of color combinations. Start with the Wikipedia entry. For more scientific information, check out the IESNA handbook. Understand the difference between Newton's and Goethe's studies of color and how current theories descend from those. After them came Maxwell, Helmholtz, and others. Munsell's text is responsible for much of the exploration of color in early modernist painting (impressionism, etc.): http://www.gutenberg.org/files/26054/26054-h/26054-h.htm. Study color combining by way of texts from the early 20th century by Albers, Itten, etc. But, as others have mentioned, the only way to truly understand color is to use it. Try different combinations, see what they do. Ask questions like: why are most websites blue? Why aren't websites ever yellow? Beyond cultural associations, each color has a fundamentally different nature and use. It's not just a spectrum. Why is red so special? Notice that blue and yellow are, in Goethe's theory, the fundamental colors from which all colors are created. Does this have something to do with their neutrality? The sun is yellow, the sky is blue, the ocean is blue... what does it all mean? Why are the road signs green?

– History: web design didn't just come out of nowhere, though most web designers are uneducated and the tools have been very primitive up until the last few years, so it kind of seems that way. Find a copy of Meggs' History of Design. Understand what it is, where it comes from, how book design is the father of graphic design. Then, something crucial to understand: that web design is constrained by the concepts of the past, which were developed in a world with different constraints. Do you know how graphics were created before computers?

Unfortunately there is no good book that gives an overview of all of this material. You need to piece it together. Here's a screenshot of my library of design books: http://img823.imageshack.us/img823/7795/screenshot20120731at.... Plus you should have a library of design inspiration. I have mine spread out between LittleSnapper and ZooTool right now. Evernote is another good way if you can stand all the visual noise in their interface. Other people use Pinterest, etc.

What you should take away from this is that UI design is actually part of graphic design, which is a relatively old discipline (though still young compared to, say, architecture).

On the other hand it can be said that UI/UX rather encompasses graphic design since UX brings in the notion of user-centered design from HCI, which has its own history in psychology and the US military industrial complex. Two great historical reads here are MIL STD 1472F: http://www.hf.faa.gov/docs/508/docs/milstd14.pdf and The Ecological Approach to Visual Perception by J.J. Gibson (from whence the concept of "affordance" comes). The classic synthesis of these ideas can be found in The Design of Everyday Things by Donald Norman. Bill Buxton is another person to follow in this space. A modern synthesis of UX is About Face 3: The Essentials of Interaction Design.

EDIT: fixed links

Re: Ask HN: Recommendations for learning and improving UX/UI skills?

#33
post #3

Take a look at http://ux.stackexchange.com/ - a place to ask/answer/discuss UX questions.

Just want to pipe in and say this is a fantastic resource. It's a great place if you have random questions like "Is it better to do this... or this?". Posting lets you tap into the collective previous experiences of tons of fellow UXers, which I've always had a good experience with. It's also nice for just browsing and getting little tips on ways to design.

Re: Ask HN: Recommendations for learning and improving UX/UI skills?

#34

Earlier quoted context omitted.

There's a certain extent to which you can be your own coach. You still need to practice, but you can monitor your own performance if you can train your eye faster than your abilities. Training your eye involves a combination of noticing and analyzing interfaces around you (good & bad), reading texts on design, watching talks, and having conversations with friends and colleagues about design. It's especially important…

agreed; there are some things you just can't learn without proper training, but if it’s something fairly straight-forward, you can get pretty far in studying common practices and trying things out yourself. there’s a huge wealth of knowledge out there in just looking around you. my approach (not a pro at all) when designing anything really is just to look for cues from others. there are a lot of resource-rich players…

99% of UI/UX design is people copying each other. The remaining 1% advance the narrative. Becoming great at UI/UX means becoming the 1%, but there's no shame in just being good.

Re: Ask HN: Recommendations for learning and improving UX/UI skills?

#35

Read Don't Make Me Think by Steve Krug. http://www.amazon.com/Think-Common-Sense-Approach-Usability/... Read everything on Jakob Nielsen's blog about Usability: http://useit.com/

It's good to read these guys, but it's nowhere near sufficient. Over time I've lost my fondness of Nielsen. He's too much of an engineer and doesn't understand subjective factors. Ever notice that his website has very poor usability due to inappropriate (read: lazy) use of typography and proportion?

Re: Ask HN: Recommendations for learning and improving UX/UI skills?

#36
Coursera.org is a good resource. I really enjoyed the Human Computer Interaction Course: https://www.coursera.org/course/hci

There were lectures and assignments built around design heuristics, different aspects of prototyping and you have to design your own application as part of the course grade.

Re: Ask HN: Recommendations for learning and improving UX/UI skills?

#37
Getting involved in your local UX community can be a good way to find mentors and experts who can help you grow. Be a sponge, and try to understand how these people look at the world.

Looks like you're in Houston, so: http://www.uxhappyhour.com/hou

Re: Ask HN: Recommendations for learning and improving UX/UI skills?

#38
post #15

Surely the first place to start is Jakob Nielsen's http://www.useit.com Ignore the ugliness and you'll find practical advice in the reports and Alertbox articles although his opinions are sometimes controversial and shouldn't necessarily be followed to the letter. Nevertheless they'll undoubtedly increase your awareness of the variety of user types out there and encourage you to think from their perspective, which is…

Doesn't it seem like a bad sign to say: "Here is where you should learn about UI - just ignore the bad UI." For all I know there is lots of good content there, but I'm immediately turned off of learning about UI from someone who can't even be bothered to make it easy to parse his frontpage.

Re: Ask HN: Recommendations for learning and improving UX/UI skills?

#39
I personally liked: User Interface Design for Programmers ( http://www.amazon.com/gp/product/1893115941/ref=as_li_ss_tl?... )(associate link) as a starting point. I also recommend the following series of articles on The Essence of Great UI ( http://community.devexpress.com/blogs/markmiller/archive/200... ) by Mark Miller.

Re: Ask HN: Recommendations for learning and improving UX/UI skills?

#40
post #32

An alternative approach: – Start by reading "Magic Ink" by Bret Victor: http://worrydream.com/#!/MagicInk – Now you understand that UI design is actually graphic design, so start with graphic design fundamentals. They are: Drawing, Layout, Typography, Color, History. – Drawing: understand how images are created on a canvas. Includes concepts of how to use line, shade, and color to create forms, volumes, depth, etc. A…

Completing the above, now for UX:

— Start by reading "Designing with the mind in mind" by Jeff Johnson (http://www.amazon.com/Designing-Mind-Simple-Understanding-In...)

— Now you understand that UX design is actually cognitive psychology + sociology. Of course, most cognitive psychology/sociology books will only be slightly relevant to UX design. Here's a short selection to get you started:

— Don Norman, Design of Everyday Objects

— Don Norman, Emotional Design

— Brenda Laurel, Computers as Theater

— Kim Goodwin, Designing for the Digital Age: How to Create Human-Centered Products and Servicesa

— Bill Moggridge, Designing Interactions

Bonus:

— Raph Koster, A Theory of Fun for Game Design (meant for video game design, but has a lot of lessons that can be applied to good UX)

For UI design, I'd also heavily recommend "Semiology of Graphics: Diagrams, Networks, Maps" by Jacques Bertin, and anything by Tufte. These titles are more about data visualization, but most UIs need a way to visualize data in some shape or form.

One point that msutherl forgot in his fantastic comment is animation (as in, 2D animation). UIs are not static things, and animators have spent decades understanding how we react emotionally to animations (Good introductory read: http://labs.oracle.com/techrep/1995/smli_tr-95-33.pdf). Good animation in a UI makes a whole lot of difference— Apple knows that (http://watchingapple.com/2007/06/are-apple-ui-designers-lear...).

For this, only one resource: "The Animator's Survival Kit", by Richard Williams.

Post reply on HN