21-year-old Code for Cape Town alumni, Mandisa Dlubom joined Responsive Tech as an intern earlier this year and we’re so grateful that she did. We asked her a few questions and her answers reveal why she has been such a good fit and how having her with us has been more than mutually beneficial. What a woman!
Print designers are increasingly faced with the decision of staying in print only or making the digital dive. I will try to help by touching on some of the biggest differences and challenges I experienced in a three part series. Here is the first part:
Much of the theory is the same (a designer is a designer, right?), but there are also a lot of technical differences between designing something that will be sent off to the printing press and something that will be sent into the world wide web.
If you’re standing on the edge, dipping your design toe into the digital pool, but are too scared to take the plunge: Don’t be! It’s totally possible! Yes, you’ll possibly get frustrated, occasionally feel like a caveman, and sometimes miss the smell of paper… But the journey will also be exciting, and as you submerge yourself in it you will stand amazed at your abilities and progress. Be patient – it’s so worth it!
It’s fun to stay at the CMYK… but RGB is calling
PART 1: COLOUR ME INTRIGUED…
As a print designer, you are used to thinking in terms of four colours – Cyan, Magenta, Yellow & Key (Black) – of ink mixing in various percentages to give you the colour you want. Suddenly you have to wrap your mind around the concept of three colors (Red, Green, Blue) of light combining…
SO, WHAT’S THE DIFFERENCE?
CMYK adds ink to white paper, decreasing the amount of light reflected off the paper to produce different colours. CMYK is therefore a subtractive process: you start with white and eliminate light to create colours until you eventually get to black. It’s interesting to note that simply adding cyan, magenta and yellow together will give you a very dark brown and not a pure black, so black is needed to totally remove light from the white paper and thus give black. Colours are named with CMYK percentage values (0 to 100) for each color (for example 90,10,20,5).
- White: 0,0,0,0 (no ink) & Black: 100,100,100,100
RGB adds light to a black screen, increasing the amount of light shining from the screen to produce colour. It is an additive process: you start with black and add light to create colors until you get to white. Colors are named with RGB values from 0 to 255 for each color (for example 24,218,194) to theoretically create a whopping 16 777 216 different combinations.
- White: 255,255,255 & Black: 0,0,0 (no light)
PAINT BY (NEW) NUMBERS
As a former print-only designer I used to see colour in four numbers. I would see a nice purple and inadvertently think: “…probably about 55,90,10,0…”. To get that purple a bit more pink, I’d know to add magenta… When I started working in RGB, I could simply not figure out which three numbers that purple would be represented by (115,25,230, by the way) or that by decreasing green would make it more pink… Luckily most design programs (and a plethora of websites, like www.rapidtables.com) can do these conversions for you, and you will learn over time, but here’s some basic knowledge to start off with:
Imagine a colour wheel with the six colours in this order, clockwise: red, yellow, green, cyan, blue and magenta (see illustration). Each colour interacts with the colour opposite it in the wheel:
to achieve a pinker shade in RGB, you will reduce the green;
to make it more yellow, you simply reduce the blue;
to get a more cyan hue, you reduce the red;
WHAT THE HEX?
You’ll soon notice that colours online are sometimes represented by HEX values. These are an HTML expression of the RGB colour. HEX is short for hexadecimal (or base 16). It uses sixteen symbols: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 to represent values zero to nine, and A, B, C, D, E, F to represent values ten to fifteen. Colours are named using a hashtag followed by a six-digit number, with a symbol pair for red, green and blue each (for example #18DAC2 which is RGB 24,218,194). Understanding the HEX colour notation will require you to understand the hexadecimal system which is pretty interesting (if you’re a bit of a geek like me), but not important as, once again, there are enough websites (like www.calculatorcat.com) and programs that can convert these colour values for you if the need ever comes up.
“GOOD NEWS, EVERYONE”
Still unsure about this RGB thing? Here’s some good news to sell it: Many print designers know the frustration of seeing beautiful colours on screen, and then being disappointed when it looks less eye-popping in print. That’s because each pixel on your monitor emits up to 16 million colours. Your printer, using CMYK, can only produce a few thousand colours through absorption and reflection. Designing for web, however, means that what you see is what you get! So you’ll never be disappointed with the difference in colour between your design and what reaches your audience again!