Any advice on learning UI/UX?

[Kenny Skaggs]

Hi!

Can someone help with gaining UI/UX design skills?

I've been interested in improving my interface and experience designing skills, but progress has been slow. Here's what I've been using so far:

• Design award-like sites - Something like http://www.webdesign-inspiration.com gives well designed sites, but I get the feeling they're hard to analyze and learn from without having a good foundation first.
  
• Design pattern collections - I stumbled on http://ui-patterns.com/, which seems like a bunch of useful tools and gives good explanations of them, but I haven't read through them all yet.
  
• Hack Design - https://hackdesign.org/ has so far been the most resourceful. Signing up (for free) gets you an email every week with a bunch of resources related to one topic (typography, color, layout, ...). I got all the emails they send and have been slowly working through them.

I imagine that what I need to do is just keep finding user experiences and learning from them (why they're done the way they are) and learning the fundamentals like typography and color theory. But I think I also should focus on building things that I can get feedback on. A site like http://www.dailyui.co/ seems like a next good step.

So I'm wondering:

• Am I on the right track? Are there other things I should try?
• Where/how can I get feedback on layouts and user experience?

[Justin Threlkeld]

Hi Kenny, great question

I'm one of the organizers from the [Nashville UX meetup](https://www.meetup.com/nashville-ux/) and a UX practitioner and I can say it sounds like you're on the right track!

Learning patterns and analyzing things that others have built is a great way build awareness of experience and interface. Keep pushing forward in that direction and you're well on your way. In addition to the sites you mentioned, I'd recommend reading articles from sources like [A List Apart](http://alistapart.com), [NN/G](https://www.nngroup.com), [Intercom.io](https://blog.intercom.com), [InVision](https://www.invisionapp.com/blog), [Marvel](https://blog.marvelapp.com), and [UXPin](https://www.uxpin.com/studio/blog/) all have incredible blogs that I always find relevant.

I'm going to pause here: the rest of my answer is going to be long and probably a bit dense. There's a list of books and some other resources at the bottom.

As you push further into it, you'll start to notice a widening split between the UX and UI arena. These two areas are distinct (though highly related) disciplines, and I have very different recommendations on how to develop in each. My perspective on this is by far only one of many. You can get a million great answers from an equal number of practitioners. Here's how I approach the field and my own skill development:

UI design is highly visual and makes use of color, detailed typography and meticulous animation in order to create a beautiful and functional interface. Learning visual design principles, color theory, and gaining mastery over pixel-perfect execution are important. Learn to use tools like Illustrator, Sketch, Marvel, Principal and Framer. You'll also want to get a handle on [accessibility guidelines][a11y] (and regulations!) and the various complexities of designing interfaces for various contexts: an interface for the web has different limitations and requirements than a desktop application for Windows. Read up on the Apple [Human Interface Guidelines][hig] and Google's [Material Design][] system.

As for practicing the application of UI skills— I personally find it a fun challenge to take an existing pattern, say the list of messages in your Gmail inbox, and apply some constraints on it: Apply the Nike brand colors or find new icons. Round the interface and soften it a bit or make it feel more "geometric" – but keep those interface guidelines and best practices in mind.


Now for UX: wireframing page layouts is just the tip of the iceberg. Read up on interviewing users and conducting [various types of research][research methods] to test those wireframes. Use a [heuristics][] checklist and perform an UX audit on an app you use (or one you don't). Learn about some of the [common deliverables][deliverables] used in UX work: prototypes, research briefs, user flows, journey maps, personas, etc.

Putting it into practice: try showing a wireframe (even as a pencil sketch) to a [random stranger in a coffee shop](https://pixelrevival.com/coffee-shop-usability-testing/) and see if they can accomplish the task the design should be able to support (but be friendly and gracious if you do this!). Try making storyboards and user flows out of experiences from your daily life.

Regardless of which side you find more interesting, there are no end of resources to help you. Here's a shortlist of resources (I'm always happy to share more, chat at length, or point you in the right direction if you've got a specific interest in any particular topic):

- The [Nashville UX meetup][] group: we have an active Slack community and an engaged attendee group with lots of discussions, design critique, tips, and some hands-on learning of techniques — I can get you an invite
- the classic book: [The Design of Everyday Things][]
- Ellen Lupton's [Thinking with Type][]
- ustwo's [Pixel Perfect Precision Handbook 3][]
- the [UX for the Masses][] blog
- The Apple [Human Interface Guidelines][]
- Intuit's [Harmony design system][]
- Google's [Material Design][]
- [uxdesign.cc](http://UXdesign.cc)
- [Cognitive Lode][] — a great collection of human behavior thought starters
- [A List Apart](http://alistapart.com)
- The blogs by [InVision](https://www.invisionapp.com/blog), [Marvel](https://blog.marvelapp.com), [Intercom](https://blog.intercom.com), and [UXPin](https://www.uxpin.com/studio/blog/) (and the UXPin [webinars](https://www.uxpin.com/studio/webinars/))
- The [Nielsen Norman Group](https://www.nngroup.com)
- [Design at Facebook](http://facebook.design)
- [Design at AirBnb](http://airbnb.design)

And like I said, I'm always happy to be as much of a resource as possible. And there's a very talented community of UX designers of many stripes, both in Nashville and beyond, and I'm happy to point you in their direction.

---
[The Design of Everyday Things]: https://www.amazon.com/Design-Everyday-Things-Revised-Expanded/dp/0465050654/ref=pd_sbs_14_1
[Pixel Perfect Precision Handbook 3]: https://ustwo.com/blog/the-ustwo-pixel-perfect-precision-handbook-3/
[UX for the masses]: http://www.uxforthemasses.com
[Deliverables]: https://uxdesign.cc/ux-design-methods-deliverables-657f54ce3c7d
[Thinking with type]: http://thinkingwithtype.com
[Material Design]: https://material.io
[Human Interface Guidelines]: https://developer.apple.com/design/
[Harmony design system]: http://harmony.intuit.com
[Cognitive Lode]: http://coglode.com
[heuristics]: https://blog.optimalworkshop.com/guide-conducting-heuristic-evaluation
[research methods]: https://blog.optimalworkshop.com/qualitative-research-methods
[a11y]: http://a11yproject.com
[nashville UX meetup]: https://www.meetup.com/nashville-ux/

[Kenny Skaggs]

Hi Justin, thanks for such a thorough response! I'll start working through the materials you sent :D

I like the idea of working on design exercises on my own and will definitely try it out. But I worry that I wouldn't have much motivation to work on them without some sort of community to compare with. Maybe I'll get a coworker to do them at the same time so we can critique each others. Something like reddit.com/r/dailyprogrammer for design would be ideal.

Thank you again for so much info and for offering support. At this point I don't have much of a direction with this other than to learn as much as I can and to get exposure to what's out there, and all the resources you sent will be a great way to go. But when I want to dive deeper into something and don't know where to go I will definitely reach out.

[JnBrymn]

 I worry that I wouldn't have much motivation to work on them without some sort of community to compare with. Maybe I'll get a coworker to do them at the same time so we can critique each others.

Yep! I think a lot of people have this feeling when they're investigating a new field of interest. Check out what the "Data Nerds" group is doing (#data-nerds-project in slack).  Since we're a band of people interested in learning data science, we've taken on a shared project - the Zillow data science challenge on Kaggle. And just like you're idea, we're all working independently on the project and then coming back together early next month to compare our progress and our techniques.

So I think your idea is fantastic. Do you have any group that you could co-work with on the exercises and then compare your work? @Justin, do you have any recommendations for Kenny? I bet you know plenty of people that you could introduce Kenny to.

[Justin Threlkeld]

Community is critical — I don't want to be too self-promotey, but the Nashville UX group has a large, active slack team with several channels that a perfect opportunities to post work and get feedback and advice from UX practitioners all over on the spectrum of experience. Our #working-on channel is usually pretty busy with exactly that kind of conversation. We're still working out details on a self-service signup, but I'm happy to send invites directly.

If there's a larger interest in the PennyU community, I would also be happy to set up a UX-studygroup or Q&A channel on the penny-university.slack team and see if some of my peers would be interested in joining me there.

And Kenny (and anyone!) — I am absolutely willing to make any direct introductions I can. Feel free to reach out to me directly, or even send me some of your work or questions and I can provide pointers or match-make you with another in the community who has a perspective you might find valuable!