I understand that this wont make me a web Picasso or anything, but I would love to be 'not horrible' when it comes to sites design and UX. What are some good places to look at, get inspiration from, and especially, learn from?
Some previous discussions:<p>Ask HN: Learning Web Design — <a href="http://news.ycombinator.com/item?id=1604915" rel="nofollow">http://news.ycombinator.com/item?id=1604915</a><p>Ask HN: How can I get better at design? —<a href="http://news.ycombinator.com/item?id=1474315" rel="nofollow">http://news.ycombinator.com/item?id=1474315</a><p>I’ve found this online book great — <a href="http://designingfortheweb.co.uk/book/index.php" rel="nofollow">http://designingfortheweb.co.uk/book/index.php</a><p>Experienced designers always emphasize learning about typography, and which seemed unintuitive to me until I began to study it. Bringhurst is a fantastic place to start there:<p><a href="http://www.amazon.com/Elements-Typographic-Style-Robert-Bringhurst/dp/0881792055/ref=sr_1_1?ie=UTF8&qid=1286480633&sr=8-1" rel="nofollow">http://www.amazon.com/Elements-Typographic-Style-Robert-Brin...</a>
I want to do the same (not suck at it) so i started to look at web design communities a while ago. I found some interesting things that helped me be a little better:<p>- <a href="http://webtypography.net/" rel="nofollow">http://webtypography.net/</a> for typography basics<p>- <a href="http://uxmovement.com/" rel="nofollow">http://uxmovement.com/</a> for general user experience advice<p>- <a href="http://uxmovement.com/resources/4-best-design-pattern-libraries" rel="nofollow">http://uxmovement.com/resources/4-best-design-pattern-librar...</a> (inspiration :) )<p>- <a href="http://alpha.patterntap.com/collections/Tabs" rel="nofollow">http://alpha.patterntap.com/collections/Tabs</a> (found recently about it).<p>- <a href="http://www.blog.spoongraphics.co.uk/articles/25-classic-fonts-that-will-last-a-whole-design-career" rel="nofollow">http://www.blog.spoongraphics.co.uk/articles/25-classic-font...</a><p>Hope it helps.
If you want to understand the psychology of design you need to look for books on "human factors" and not web design books. Human Factors is a scientific discipline that is a subset of IO psychology.<p>While many of the books recommended on this board are good books, some of the authors learned through trial and error without the guidance of the scientific rigor that is provided by Human Factors, while others are just plain wrong.<p>The mind works in particular patterns, understanding those patterns will help you conceive of interfaces and test those conceptions, while verifying that it does indeed improve whatever metric you are trying to improve, not just emulate something that worked for someone.<p>Now I am not saying you need a PHD in Human Factors to design good interfaces, but a little grounding goes a long way. It will help you understand why something worked for someone in a book and determine if it will also work for what you are trying to apply it to.
Check out Smashing Magazine <a href="http://www.smashingmagazine.com/" rel="nofollow">http://www.smashingmagazine.com/</a><p>Their posts are usually really informative and provide a lot of jumping off points and design analysis. They have a book out as well that I've only thumbed through a bit, but looked really well done.
I like Luke Wroblewski's advice a lot (<a href="http://www.lukew.com/" rel="nofollow">http://www.lukew.com/</a> plus his two books on form design and web usability)<p>I have to worry about form design mostly, so two links I liked were<p><a href="http://www.uie.com/articles/web_forms/" rel="nofollow">http://www.uie.com/articles/web_forms/</a> and
<a href="http://www.uxmatters.com/mt/archives/2006/07/label-placement-in-forms.php" rel="nofollow">http://www.uxmatters.com/mt/archives/2006/07/label-placement...</a><p>I also stole some ideas from here:
<a href="http://developer.fellowshipone.com/patterns/" rel="nofollow">http://developer.fellowshipone.com/patterns/</a><p>Those are the ones I've read and somewhat followed.<p>I also bookmarked this framework to try out:
<a href="http://gantry-framework.org/" rel="nofollow">http://gantry-framework.org/</a><p>There are also several eyetracking services (some provided by Ycombinator companies I believe) - I'd love to have eyetracking studies on the company website, but the current management doesn't mind that it looks like crap since it will be outsourced anyways.
I basically sent the same question in an e-mail to Amy Hoy last night. She recommended these two books, "The Universal Principles of Design (have to get a used copy) and About Face 3 for interaction design."
I have to say of all 37Signalers, I enjoy listening to Ryan Singer the most. He seems to have a genuine interest in teaching and not in a "controversial for the sake of marketing" kind of way. He has a bunch of videos on Vimeo.<p>He talks more about user experience and interaction, not graphic design, that as someone else mentioned, you can find tutorials on the tuts plus network.
It's worth checking out Don Norman's (the author of The Design of Everyday Things) recommended reading list:<p><a href="http://www.jnd.org/recommended_readings.html" rel="nofollow">http://www.jnd.org/recommended_readings.html</a><p>I have yet to choose a book from the list that didn't leave me feeling much more informed. If you click on a book in the list it jumps to a description of why he thinks someone should read it.<p>I desperately want to get the Handbook of Human Factors and Ergonomics, but it's just way too expensive:<p><a href="http://www.jnd.org/recommended_readings.html#000235" rel="nofollow">http://www.jnd.org/recommended_readings.html#000235</a>
"About Face" by Alan Cooper is far-and-away the best book I've read on interaction design.<p>Don Norman's books are also worth a read (though more difficult to immediately apply to creating software).<p>For general visual design "The Non-Designers Design Book" by Robin Williams is an excellent tutorial to teach you how to be, as you say, "not horrible".
I just started reading Cooper's <i>About Face</i> and by chapter 2 it's already changing how I think about UI design. Granted, I sucked at it, but still...
Adding to the others.<p>You should understand the difference between Web design and UI/UX design: it's like Monet/van Gogh versus Da Vinci.<p>In UIs you're crafting like an "engineer", while with general website design (eg. most of the cases done by graphic designers) you're painting. Either way practice is required (if you're a programmer you know this, you can't learn programming only by reading books :).<p>Also if I may, I would recommend "Semiology of Graphics"
by Jacques Bertin, it's a reference to information design and visualization (if you plan to design apps, you may want to give it a look). <a href="http://www.amazon.com/Semiology-Graphics-Diagrams-Networks-Maps/dp/1589482611" rel="nofollow">http://www.amazon.com/Semiology-Graphics-Diagrams-Networks-M...</a>
1. Rosenfeld Media has a ranking tool for UX books
<a href="http://www.rosenfeldmedia.com/zeitgeist/" rel="nofollow">http://www.rosenfeldmedia.com/zeitgeist/</a> and top lists provided by respected industry professionals.<p>2. Whitney Hess, a respected UX professional with great PR skills, has a recommended list at <a href="http://www.flashlightworthybooks.com/Best-Recommended-Books-User-Experience/224" rel="nofollow">http://www.flashlightworthybooks.com/Best-Recommended-Books-...</a><p>As a person who once switched to UX design for a while, I can say that they are definitely great books, though I can't understand everyone' obsession with Steve Krug (he has EXTREMELY basic books).<p>Also, Whitney has two popular blog posts of So You Wanna Be a UX Designer series:
<a href="http://whitneyhess.com/blog/2009/06/30/so-you-wanna-be-a-user-experience-designer-step-1-resources/" rel="nofollow">http://whitneyhess.com/blog/2009/06/30/so-you-wanna-be-a-use...</a> and <a href="http://whitneyhess.com/blog/2009/11/23/so-you-wanna-be-a-user-experience-designer-step-2-guiding-principles/" rel="nofollow">http://whitneyhess.com/blog/2009/11/23/so-you-wanna-be-a-use...</a> .
They will provide you basics, but also overwhelm with the huge volume of recommended sources.<p>3. konigi.com (ther blog and wiki) is a top source of information about ALL old and new UX tools, some UX basics and new UX trends. They also sell some very handy tools for UX designers <a href="http://konigi.com/tools/overview" rel="nofollow">http://konigi.com/tools/overview</a>
There's no "The way to design" but there is "A way to design".<p>I would recommend you "Defensive Design for the Web" by 37 Signals and "Designing Web Interfaces" by Bill Scott.<p>These books use examples of Web Interfaces but you can apply them on anything. Be it a software or hardware.<p>Also, I would say, when you design something, Dont focus much on visual appearance. First try to make things clean and ask your non-tech friends to use it. See what difficulties they face in using your product. You will learn a lot from these experiences.
I'm not a UX guy, but I found this to be a good infographic to encapsulate what UX actually means:<p><a href="http://uxbasis.hellogroup.com/" rel="nofollow">http://uxbasis.hellogroup.com/</a>
Here's a list of books I've put together for classes:
<a href="http://hci4.me/static/16-475-references.pdf" rel="nofollow">http://hci4.me/static/16-475-references.pdf</a><p>MIT's OCW class on UI - <a href="http://ocw.mit.edu/courses/electrical-engineering-and-computer-science/6-831-user-interface-design-and-implementation-fall-2004/" rel="nofollow">http://ocw.mit.edu/courses/electrical-engineering-and-comput...</a><p>Also, look at RISD, Stanford, CMU, Berkeley, Cornell (in no particular order).<p>If you can, anything by Doug Engelbart is amazingly motivational (inventor of the mouse) and insightful.<p>If you contact me, I'd be happy to send you my slides from lectures I've done on interaction and answer any questions.
tl;dr: Take a course!<p>Don't know about all these books recs. All good books, but reading books wont make you a better designer. Reading books about fine art wont make you a better painter; and reading books about soccer wont make you a better soccer player. You'll learn the rules, sure, but at the end of the day you need to develop the skills by training/being coached (if I can run with the metaphor), so I suggest taking a short course on graphic design fundamentals and learn by doing.<p>Getting drilled on the fundamentals will stay with you much longer than anything you read in a book about ux/design.
I found it possible to absorb more knowledge (wisdom?) about UX by performing user tests than by any other method of studying the subject.<p>Grab a copy of "Rocket Surgery made Easy" by Steve Krug, a copy of Silverback for Mac, and start doing some user tests.<p>In time, you will start to see the same patterns coming up over and over again, and this information will begin to unwittingly inform your thinking during the design phase.<p>This isn't going to help you with visual design so much, but it certainly will help you with the communication aspects of the software/website, and will help you to avoid design/UX pitfalls.
"don´t make me think" by steve krug (is a classic)<p>if you wanna learn about users, the way they think, and which problems they have on the web (eg with forms,..)
just sit by your girlfriend, your mum or everybody you can watch in front of a computer.<p>the best is to watch them using something you created. so you get a clue of how different problems (than you think) other people have that you might think.<p>i was yesterday at a customer showing my progress. so he (a trainer for wordpress stuff) registered on the site and asked and did some (for me) weird things.<p>there´s tons of things to learn from that. :)
I steal heavily from some of the best designers/design shops out there.<p>Here's some of my favs (look through the portfolios)<p><a href="http://www.odopod.com" rel="nofollow">http://www.odopod.com</a> <a href="http://bigspaceship.com" rel="nofollow">http://bigspaceship.com</a> <a href="http://barbariangroup.com/" rel="nofollow">http://barbariangroup.com/</a> <a href="http://codeandtheory.com" rel="nofollow">http://codeandtheory.com</a> <a href="http://akqa.com" rel="nofollow">http://akqa.com</a> <a href="http://rga.com" rel="nofollow">http://rga.com</a>
Plenty advices on books and urls have been given but I'd like to shed some light over practice. There is no book, people or tip will move you forward faster than design-and-critique.<p>Design, and art in general, is not very different from coding. You have to write code to be able to appreciate and learn from other's work. Here is one good link on how to critique art: <a href="http://bit.ly/d5Ep7p" rel="nofollow">http://bit.ly/d5Ep7p</a>
This is an answer to your request for "good places to look" rather than learning user interfaces: I've been curating a list of "clean sites I like the look of" since '06:<p><a href="http://www.delicious.com/jashmenn/cleansitesilikethelookof" rel="nofollow">http://www.delicious.com/jashmenn/cleansitesilikethelookof</a>
People have posted a lot of resources here, but are there any resources that talk about how to use specific tools to create webpage designs, rather than just concepts behind designs? I'm not sure which tools I should even use to go about creating a design (other than hand coding HTML and CSS)
I can't believe a quick Ctrl-F didn't find him already mentioned, but look up Jakob Nielsen and his ten usability heuristics. If there's one thing doing some postgrad work in HCI taught me, it's to remember those absolutely. Always, always evaluate what you're making against them.
You know how you tinker with code day after day, and you've been doing it for years? How you're connected with peers and betters who know how to code also, and who can critique your work? You know how you think about code even when you're not coding?<p>Do that for UX/Design.
Check out Joel Spolsky's UI Interface design. <a href="http://www.joelonsoftware.com/uibook/fog0000000249.html" rel="nofollow">http://www.joelonsoftware.com/uibook/fog0000000249.html</a><p>and as well as mrshoe, I love The design of everyday things.
Want your UX/Web Design to make money?
Try Web Design for RIO (<a href="http://www.amazon.com/Web-Design-ROI-Browsers-Prospects/dp/0321489829" rel="nofollow">http://www.amazon.com/Web-Design-ROI-Browsers-Prospects/dp/0...</a>)
This thread on Quora provides a lot of great advice: <a href="http://www.quora.com/How-can-I-learn-to-be-a-good-product-designer" rel="nofollow">http://www.quora.com/How-can-I-learn-to-be-a-good-product-de...</a>
Ben Fry's Dissertation is awesome, very easy to read and FREE! Ben is the creator of the Processing language (which is awesome by itself)<p><a href="http://benfry.com/phd/" rel="nofollow">http://benfry.com/phd/</a>
What I learned from a Human-Computer Interaction class in college<p>- Always think of the user. All tradeoffs should be made in favor of the user<p>- Don't expect users to read anything; they're busy<p>- Make it as simple as possible, but no simpler. Don't dumb it down, just don't complicate it<p>- For each page/window, know exactly what the user wants to do there.<p>- Make things clear, easy to see, and easy to learn<p>- Have an Undo command, for Christ's sakes