Design: What are the best resources for learning bleeding-edge web, UI and UX design?
Here's a pretty good resource for learning UX/UI design, if I do say so myself.
There is a difference between UI design and UX design. There is a lot of overlap though, so I'll try to bundle them together. Here it is, in ten simple steps.
#1 Discover the problem
Far too many designers sit down to work on a new project without doing any research at all. Their thought process usually goes something like this....
No. Stop.
I’m sure your new CSS technique is wonderful but the point of designing an interface or experience is to solve a set of problems. As much as I'm partial to CSS animations and Proxima Nova, these things are more improvements to solutions than they are solutions to problems.
Stop looking at websites and wincing at misaligned elements, native fonts and ugly color schemes. Start looking at websites as solutions, solutions to problems. Problems might include:
- Not optimized for mobile
- Not accessible to screen readers or color blind people.
- 12 second load time
- Value of the app not immediately obvious
- Too many steps in sign up flow
#2 Get to know your users
It's much easier to solve problems when you first figure out who is experiencing them. Find out as much as you can about your users before you start.
- What is their average age?
- What browser do they use?
- How did they find your site?
- What do they want from your site?
- What does your site want from them?
#3 Learn to wireframe properly
So, now that we know who our users are and what problems they are experiencing, we can start redesigning our homepage, right?
Wrong.
One of the most common mistakes I see in UX design is the reflex to automatically start with the homepage. It's tempting to guide the user from the homepage to where you want them to be. However, in a lot of cases, the homepage is not always the landing page. Perhaps your blog is where most users begin their journey.
Open a Google Doc. Make a list of all your site's entry points. Now, starting with the most important entry page, take your pen and paper and start adding content. Let's pretend we're wireframing our blog.
So, we need a heading, the article body, the date, th.....wait. Do you really need to add the date? Does the date affect the relevance of your article? If so, add it. If not, leave it out. Keep going until you have all the necessary elements added.
Now you want to start thinking about where to guide the user. Maybe you want them to tweet your article? Maybe you want to show them related articles. Maybe you want to guide them to your homepage? Offer too many options and they will probably do nothing. So choose wisely.
Make sure every single piece of content you add has a valid reason for being there. It must serve a purpose, solve a problem. If it doesn't, remove it.
Rinse and repeat with all other entry points. Regardless of where the user enters your site, it should be easy for them to complete their tasks and reach the desired goal.
#4 Communicate effectively
It is your job to communicate the information your users want in the quickest, most effective way possible.
Video and images are very effective forms of communication. Study well designed websites and see how they frequently use images and icons to communicate.
Don’t make your users work any harder than necessary. Most users scan websites rather than read them. Give each section of the page a heading, so users can quickly scan to the section they’re interested in. Make sure you keep your headings short and sweet. Experiment until you have effectively communicated what you’re trying to say in the simplest way possible.
Too long winded.
Better.
Bleeding edge.
#5 Guide your users
When a user lands in your app and doesn't immediately see how it can benefit them, chances are they're gonna leave and won't be coming back anytime soon. Don't base all your design decisions on how the app will perform when it's full of data. Design the journey.
#6 Encourage your users
When a user makes a mistake, don’t just inform them in a cold manner and leave them to figure out the solution.
If you do this, they will blame you and you will lose their trust instantly. Instead, let them know they made a mistake in a polite, even perhaps humorous way and then point to the solution.
#7 Reward your users
Likewise, when your users do something right, reward them. Don’t just inform them of their success like any robot would.
Congratulate them in a human tone. Reward your users and they will feel compelled to use your product. Make them feel loved. In turn, they will love your product.
#8 Learn the basic fundamentals (HTML, CSS, JS, Ruby, Python etc.)
Enough said.
#9 Learn visual design
Lots of UX designers think they don’t need to know about color or typography. Others say it’s a complete waste of time. It's not. The problem is, designers are frequently using visual solutions to solve UX problems. If your users are having trouble completing the checkout process, making your buttons a little shinier is not going to help.
However, assuming you have your user flows in good order, improving your visual design will help your users trust you more.
Gaining a good understanding of visual concepts will not only empower you with the ability to design awesome buttons.
#10 Study. Study. Study.
There are countless resources out there for learning about design. Here are just a few to get you started:
Resources
Smashing Magazine
Aarron Walter (aarron) on Twitter
Paul Irish (paul_irish) on Twitter
Responsive Design
Ryan Singer (rjs) on Twitter
Chris Coyier (chriscoyier) on Twitter
www.designskool.com
CSS-Tricks
AaronRobbs (AaronRobbs) on Twitter
Designing for Emotion
Welcome | Voice and Tone
Dribbble - Popular
iOS Mobile Patterns
The Main Tap › PatternTap
Designer News
Awesome Sites
http://mailchimp.com
https://yourkarma.com/
http://facebook.com
http://layervault.com/
Good luck :)
See Questions On Quora