Practical Color Theory & Design Tips for People Who Code
I want to share what I've learned about design and color theory, and of course, make it fun and entertaining all at the same time. This isn't a read-out of any documentation, but coming from years of digging through a bunch of amazing resources aimed at painters and updating them for people who work on the web.
Big aims & goals of the presentation
- I want to talk about the why of color implementation and design, rather than the just the how. For example, how does contrast and texture affect the perception of depth? Why should you pick a complimentary color as your accent color?
- I want this talk to be fun and entertaining, so there will be jokes.
- I know just how intimidating color and design decisions can be, and how often people pass it on to "someone better" even if they're really interested in learning more! I want everyone to feel like they can do the basics, and to feel confident learning more on their own if they are inspired.
Specifics of color theory takeaways. After my talk, people should be able to:
- Add Sass color functions to their toolkit by learning how to wield luminosity, saturation, tint, shade, and opacity with confidence and understanding. There's plenty of documentation on the how, I'd be focusing on the why.
- Be able to confidently pick color schemes and create their own Sass color variables partial. I am also going to be providing a gist https://gist.github.com/Tallys/130b2a34b3ce11357c14 as an example.
- Finally understand the reason every art room had a color wheel poster! It actually has its own documentation for how to read it - surprise, it's actually a color map.
- Feel confident in exploring the old school design pattern that is color theory.
- Resources - I want everyone to leave my talk with a better understanding of how to seek out design resources that will actually help them in their day-to-day work.
I like to encourage curiosity, so here are some of the questions that will come up (and most will even be answered) :)
- Why are there rounded corners on just about everything?
- How can I improve accessibility with my use of color?
- Why are traffic cones and safety vests orange?
- Why shouldn't I use #000 on my website?
- Why can red and green color schemes troublesome in design?
- What happens if you mix exactly equal parts red and green? How about blue and orange?
- Why do we start to like beige as we get older?
- Why do highlights always go on the tops of buttons?
- Why does a color look good in a color picker, but can look so bad when you put it on your site?
- Why does putting art in frames make it look so much better?
- Why are Sass variables and color functions such an awesome tool and timesaver?
About Natalya Shelburne
I'm a classically trained fine artist who spent 6 years lecturing and teaching people how to paint, draw, and grow their creativity. Upon realizing that the Renaissance had in fact already ended, I decided to join the modern world and am now a front end developer at RealMassive. I love writing code as much as I love painting, and I want to convince the world that writing CSS is an art form. I get excited about updating and sharing old school design theory and knowledge and applying it to the infinite canvas that is the internet.
I love sharing all kinds of knowledge. I have a bachelor's in Developmental Psychology and a master's degree in Creativity and Talent Development, and do my best to weave interesting facts about how our brains work, learn, and develop into every talk.
When I'm not writing code, I paint, I do improv comedy, sing in musicals, and drink absurd amounts of coffee.