I get a lot of students looking for ways to level up their UI/UX skills, and my answer is almost always to get familiar with traditional art and graphic design fundamentals, as a lot of what you create in UI have referenced real objects and environments. Below is a list of resources for learning the fundamentals of design so that you can apply it to any medium (web, software, posters, etc). There are a lot of different resources and creators out there that speak to these in greater detail, so I encourage you to rabbit hole, learn the language and have fun.
I have personally read these books/used them as reference in my design process and when I went to graphic design school, so many of these resources may be an oldie, but still a goodie.
Graphic Design
General
If you’re interested in a general overview of graphic design, you can also rabbit hole from here
- https://readings.design/ — a comprehensive list of free PDFs and books to read about design
- Graphic Design: The New Basics
Composition
The arrangement of visual elements within a frame that creates harmony and visual interest
Color
Understanding color relationships, psychology, and applications
- Color & Contrast — In-depth color theory
- coolors.co— color palette generator
- https://www.color-hex.com/ — color profiles for hex codes (provides all color values, tints, shades, wheel pairings)
- https://app.contrast-finder.org/ — contrast checker
- https://www.radix-ui.com/colors — UI-specific palette generator
Typography
The art of selecting and arranging type
- Follow Ellen Lupton on Instagram, if you’d like to have more design in your algorithm
- ^ Ellen Lupton is just a OG in design anyway, so pick up her books as well
- The Elements of Typographic Style by Robert Bringhurst
- https://typewolf.com/ — font pairing
- https://fontsinuse.com/ — font pairing/inspiration
Visual Hierarchy
Guiding the viewer’s eye through importance
Balance & Proximity
Creating equilibrium between elements
Contrast & Repetition
Creating visual interest through differences and patterns
Space (Positive/Negative)
Using emptiness as effectively as filled areas
More Fundamentals centered in Traditional Arts
I add these resources because a lot of digital/graphic design fundamentals is borrowed from traditional art. A lot of times our references are the objects around us and spaces we live in, and creating a human experience would benefit from understanding these fundamentals. TBH a lot of these don’t have a comprehensive list of resources because these were taught to me in school, but I encourage you to find something on YouTube or Skillshare to help you with these. TBHx2 Bob Ross does a pretty good job too.
Drawing/Mark Making
The foundation of all visual art
Value & Light
Understanding how light creates form
Perspective
Creating dimensional space on a flat surface
Anatomy
Understanding human and animal forms
Materials & Techniques
Understanding tools and their applications
Art History & Visual Literacy
Understanding visual language through history
- Youtube: Great Art Explained— Digestable art analyses
- Generally speaking, learning about Art History will be helpful for you to articulate specific art and design patterns and themes (modern, contemporary, minimal, art deco, bauhaus, brutalism, dadaism, expressionist, etc). All of these inform how we create today.
UI/UX Design
- Get familiar with design heuristicsas a baseline for good interaction design
- A Book Apart Series— industry-standard writing for all things design, code, and product
- O’Reilly Series— also industry-standard, but I’ve found more spelling errors in these books than an undergrad paper