Ask HN: How to learn design and UX as a software engineer?
My current designing skills are non-existent: I live in the terminal and plain text emails make me happiest. I would like to broaden my skill set and learn web design/UX design.
There are plenty of resources to learn code: FreeCodeCamp, exercism, and tons of others.
What's something similar for learning to design web applications, websites, and UX/UI?
There's lots of courses out there similar to FreeCodeCamp, etc. but I think you'll find, like I did, that design is a different beast. It's not something that is codified into rules that are easy to reason about. It's fluid, it's a feeling more than a rule to follow. And what's more? It changes all the time. What was considered "trendy design" in 2005 is now old and antiquated (although, the same could be said of the JS ecosystem, so maybe it's not all that different after all)
That said, there are some "rules of thumb" that can be learned and applied to your existing projects.
Some of my favorite resources for learning design as an engineer:
https://refactoringui.com/ - The book is slated for release soon but I've followed the authors on Twitter for a while now and Steve in particular has some great advice for "designing" as an engineer [1].
https://dribbble.com/ - One thing I've found as an engineer is that most people recognize good design when they see it even if they can't create it. I've spent a lot of time picking out good designs from good designers and replicating them on my own. As I do so I try to reason about why they made that design choice versus something else. Over time I find myself thinking things like, "OK, so you gave the card a larger border radius because you wanted it to feel softer." It's just something you pick up with practice and deliberate effort.
[1] https://twitter.com/i/moments/880688233641848832
Like learning to code, visual design, web design, user interface design, and user experience design are broad topics. No one book or resource can teach you all there is, but one resource can help you make a lot of progress.
People on HN have recommended Design for Hackers https://designforhackers.com/
Learn about the design process https://www.slideshare.net/Klonowsa/design-process-overview-...
Some resources on prototyping https://www.productmanual.co/categories/prototyping
Some resources on interaction design https://www.productmanual.co/categories/interaction-design
This book is popular for people wanting to learn a little more about design. It's on my list of things to read. https://en.wikipedia.org/wiki/The_Design_of_Everyday_Things
An application of design that is useful for projects and companies is the Google Ventures sprint is useful http://www.gv.com/sprint/
learning some fundamentals always help. I've done this course and found it great for my base layer on UI/UX design: https://www.udemy.com/design-rules/
some good resources overall:
DESIGN INSPO RESOURCES:
- https://www.calltoidea.com
- https://www.dribbble.com
- https://www.uimovement.com
- https://www.goodui.org
- https://www.awwwards.com
TOOLS:
Colorzilla - to get the colors of the website you like
https://www.coolors.co - check which colors go well together
https://www.thenounproject.com - for icons, black and white
https://www.iconstore.co - free icons set
fontfaceninja chrome addon - to find the font on the website you like
https://www.uigradietns.com - generates the gradients
You already got some comments that cover UI. I'd give you a different perspective on the UX.
One thing is UI - "drawing" apps and web sites, a completely different area is the UX. You should have been dealing with UX while doing software development - writing frameworks, creating classes, etc, or during day to day life - dealing with invalid door push/pull handles, hard to use phone apps, etc.
Just start paying more attentions to details and areas that are not as efficient as they can be.
In case you would be interested to explore UX/UI best practices specifically for web applications, I have one resource.
Last weeks I've been researching patterns successful players in SaaS industry use to improve their user experience. And ship profitable products. I've listed these patterns and released as a collection here: http://minimumviabledesigns.com
Might be helpful to you as an inspiration.
Going over Apple's work on this is probably worthwhile:
https://developer.apple.com/design/human-interface-guideline...
If you're willing to put in the effort for some serious study, then try these 2 books. They worked very well for me.
a. About Face 3 by Alan Cooper
b. Contextual Design by Karen Holtzblatt
These two will set you up.
https://news.ycombinator.com/item?id=12711060