HN Explorer

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

147 points by pgambling ↗ HN
I'm a developer and writing code comes naturally to me. However, I feel that user interface design is a weak area for me and I want to improve. All my UI development is web based, HTML, CSS, and JS. Can you recommend any books or other resources that helped you improve you UI skills?

51 comments

[ 2.8 ms ] story [ 124 ms ] thread
mtrn
Take a look at http://ux.stackexchange.com/ - a place to ask/answer/discuss UX questions.
dave5104
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.
jacobroufa
I've been finding that just simply mocking up the sites/apps I'm building or even just pieces of their functionality has helped me refine what I feel is implementation of good user experience. The marker comes down to "Would I use that?", and more often than not, as fast as I can get a page up it's no match for a mockup that comes to fruition even quicker. Check out Balsamiq (http://www.balsamiq.com/) for the app that I choose to use. I also lurk ux.stackexchange.com, as mtrn suggested it's a great resource.
BaconJuice
I use sites like patterntap for transpiration.
kadabra9
There are a ton of good blogs, articles and collections out there, this quora post covers some good ones:

http://www.quora.com/What-are-the-most-influential-UX-design...

Also, create a bookmarks folder (or even just a regular folder on your Desktop) just for collecting UX/UI designs that jump out or appeal to you. Either bookmark them, or take a screenshot, and use good, descriptive tags (e.g "Search Results", "Dashboard", etc). Then block out a small amount of time each week(I usually spend like a half hour or so over Sunday morning coffee) to review them; ask yourself why you like the designs/patterns, what appeals to you, why its effective, how could it be more effective etc. You'll start to recognize patterns and develop a sharper eye for effective UX/UI design throughout the web.

Finally, accept and embrace the idea that good UX/UI design is very much an iterative process, it's OK (and actually pretty common) to not get it perfect the first time around.

PaulHoule
As you can in other fields, you can learn a lot by studying what the leaders do, understanding it, and imitating it.

You've got to get away from people who say "We can't do it the way Google or Amazon does it because they're big and they can afford it." You've got to think instead "Google and Amazon are big because they did things right."

You've still got to think about (small) scale though.

Back around 2000 I was interested in user management and authentication and back then the main challenge across the industry was conversion rate, and it was very good to imitate what Yahoo did.

A few years later, Yahoo's signup and login process had become quite complicated because they had a notoriously foolish user base that was vulnerable to fraud and phishing. If you imitated them you'd quadruple your development costs, kill your conversion rate, and get your email box flooded from people who forgot their passwords.

(Funny, Yahoo started to go downhill around they time they did this!)

So look at the leaders and think about what they do critically. Don't listen to voices that say "we can't afford it" -- you can't afford to have employees that are lazy like that or for that matter, to be working for a project manager who won't do what it takes for your projects to succeed.

chr15
I started a weekly newsletter that provides design-related articles and tips: http://seriffed.com

Like you, I wanted to improve my design skills, so I coded this up over several weekends.

maerek
Chris - can you elaborate a bit more on this newsletter? What sort of content it covers, how you source data, etc.? Just signed up and am interested to learn more.

Thanks!

chr15
Hey Maerek, thanks for signing up! I try to cover typography, frontend techniques, interviews with designers, industrial design, and branding. It's a broad range of topics that I'm interested in learning more about since I come from a backend coding background.

You can view some past issues here:

http://seriffed.com/issue/6/ http://seriffed.com/issue/5/

If you have any ideas on how I can improve, I would love to hear them.

tagawa
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 ultimately what good UI design is all about.

indspenceable
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.
harrybr
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 an experienced professional giving you advice, critiquing your performance and stretching your abilities. You need them to help you track your own performance, to become acutely aware of your weaknesses and focus on them relentlessly.

A lot of organisations don't get this. A few books, a conference and a spot of mentoring doesn't turn a team of front end developers into UX designers.

msutherl
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, as a self-teacher, to accept a broad range of influences extending beyond what you might call "UX". That includes, but is not limited to, graphic design, psychology, object design, information design, information architecture, HCI, and fine art.

But, if you can find a mentor, that is always the best way.

simba-hiiipower
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.

msutherl
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.
sopooneo
Great UI can be created without adding anything new. Use old things well, in intuitive ways, and you already are ahead of 99% of your competition anyway.
smashing
Who trained the trainers? Hint: They were probably self-taught.
maerek
I've been fortunate enough to attend talks given by both Luke Wroblewski (LUKEW, http://www.lukew.com/) and Joshua Clarke (Global Moxie, http://globalmoxie.com). Both have written excellent books on design principles and UX/UI implementation (Luke on web form design, Joshua on app interfaces and design).

If you're interested in web standards and design, http://www.alistapart.com/ is also a great site to follow.

pgambling
Wow HN readers, you're awesome! I didn't expect such a wealth of information when I posted this an hour ago. Keep it coming!
madoublet
A lot of resources mentioned here are great and a really good starting point. If you decide that you want to get serious about UI/UX, I would highly recommend looking into a graduate or certification program. I have heard good things about Human Factors (humanfactors.com) and a number of universities offer HCI certificates. I am currently working toward one at Missouri S&T.
dochtman
A Coursera course on Human-Computer Interaction?

https://www.coursera.org/course/hci

smartial_arts
Second that, it's an awesome course. Prof Scott Klemmer knows his stuff real well and is really passionate about the subject.

Highly recommend to take next class when it starts in September.

FreshCode
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/

msutherl
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?
nc
I'm a developer too, for the last year I've been working on my UI & UX skills - and I've somehow managed to get paid to built out product features for the web (UI, UX + code) professionally.

Here's what I figured out (YMMV):

---

For UI design

Books aren't that helpful, you have learn by doing.

Instead, for theory Treehouse offers a primer on HTML, CSS & UI design which provided a great foundation, they have courses on things like colour theory. Really really helpful.

Practice. I designed & launched a bunch of complete web apps, each one with a landing page + full functionality. Each attempt had a visible improvement in UI & UX over the last. I got tons of great feedback and encouragement (you're gonna need it) from forrst. So I'd highly encourage posting there and asking for feedback (tell people you're learning).

Learn Photoshop.

Check out Sacha Greif's ebook on UI design http://sachagreif.com/ebook/ it comes with a PSD and has a great intro into UI stuff.

Check out Lighting & Realism In Interface Design by Mike Rundle (developer + designer) here http://designthencode.com

Get a bunch of freebies from dribbble and deconstruct and remix them to your taste.

-----

For UX

Watch this https://peepcode.com/products/ryan-singer-ux then watch it again. Ryan Singer is an absolute UX god - he understands how to navigate the problem space very very well.

To really improve UX measure how people use what you make (mixpanel, click tracking) & conduct user studies - watch people use an interface to really understand what works UX wise.

kenshiro_o
Developer as well here - mainly server side Java and Node.js on my spare time.

I started looking into useful material to help improve my non-design skills, because well... they are non-existent.

I started with Twitter Bootstrap but I don't think it is the way forward if you want to learn design the proper way. I recently bought this book: The Non-Designer's Design Book (http://www.amazon.com/Non-Designers-Design-Book-The-Edition/...) and would warmly recommend it to anyone who wants to put one foot or their whole body into the design world.

I now try to spend more time analyzing the design of websites, brochures, menus, etc. It is very fun and I believe it is my observing and analyzing other peoples' work (mistakes included), then practising, that you can improve your eye(s) for design.

sgdesign
Thanks for recommending my eBook! I wrote it specifically to give non-designers an overview of my design process, in the same spirit as Ryan Singer's screencast.

But of course, just like with everything else you get better by actually doing, not just reading about it. Still, I think reading case studies like this can at least show you good design is a logical and iterative process, and anybody can master it with some hard work.

deafbybeheading
To me, a turning point in my feelings on UX was reading Alan Cooper's "The Inmates are Running the Asylum" [1]. It's a little anti-engineer (he argues that engineers cannot do this right and you always need dedicated UX people), but he explains core interaction design principles very well.

E.g., he draws a distinction between mere UI design and interaction design: UI design is just layering another abstraction (the interface in question) on the underlying software architecture, whereas interaction design starts with what the user wants to accomplish, and adapts the underlying pieces to enable that.

Note that this is not a UI book, or even really all that much of a UX book, but it does make a great argument for the importance of user interaction.

[1]: http://dl.acm.org/citation.cfm?id=553473

bgnm2000
As a professional UX guy, here are my two cents:

Do it : repeat.

If the best chance for practice you have, is on personal projects - so be it.

Find sites for inspiration. Design is ALWAYS changing. Things you're just getting sick of now (chunky buttons, ribbons, page tears etc.) other designers first saw a long time ago - those thing slowly saturate the design community before they're everywhere.

Browse Dribbble.com every day.

When you have to design a site, use sites likes patterntap.com, and uiparade.com to see great examples of slick UIs.

Most importantly, "eat your own dogfood." Use the products you've made, non-stop. Just keep testing and testing. If things feel weird, or unnatural, iterate, and eat more dogfood.

Design should never be something someone gets "right" the first time - its an iterative process of learning user behavior based on what does or does not perform well.