0 1 00:00:01,170 --> 00:00:06,560 Now it's very rare to see a design that only contains one color in its color palette. 1 2 00:00:06,600 --> 00:00:11,220 Now of course there's predominant colors and subsidiary colors. But very often when you're designing 2 3 00:00:11,220 --> 00:00:15,990 anything either for print or for digital, you're going to need to combine different colors. And there's 3 4 00:00:16,020 --> 00:00:20,690 different ways that you can go about doing this to make your designs convey different messages. 4 5 00:00:20,700 --> 00:00:27,000 So let's look at some of the ways in which we can use the science of color theory to combine different 5 6 00:00:27,000 --> 00:00:28,370 colors for your designs. 6 7 00:00:28,440 --> 00:00:30,360 So here we've got a color wheel. 7 8 00:00:30,360 --> 00:00:35,060 Most of you will have seen it from-- most of us have seen it from art classes. 8 9 00:00:35,220 --> 00:00:40,860 And essentially the rainbow wrapped around itself. And the color wheel is an incredibly useful tool not 9 10 00:00:40,860 --> 00:00:43,110 just for artists but also for designers. 10 11 00:00:43,110 --> 00:00:46,520 So let's look at one of the ways in which you would combine different colors. 11 12 00:00:46,590 --> 00:00:52,800 So for example if I wanted to pick an orange color to have in my design, how would I combine it with 12 13 00:00:52,800 --> 00:00:55,350 a different color to complete my design? 13 14 00:00:55,440 --> 00:01:01,050 Well one of the simplest color palettes is going for what's called an analogous color or an adjacent 14 15 00:01:01,050 --> 00:01:01,530 color. 15 16 00:01:01,530 --> 00:01:06,360 This is where when you take one color on the color wheel and combine it with the color that's immediately 16 17 00:01:06,360 --> 00:01:10,410 next to it or adjacent to it and you get an analogous color palette. 17 18 00:01:10,410 --> 00:01:17,210 Now analogous color palettes create designs that are incredibly harmonious and easy to look at. 18 19 00:01:17,220 --> 00:01:23,130 So this is something to think about when you're designing app background screens or the main interface 19 20 00:01:23,220 --> 00:01:24,270 of your app. 20 21 00:01:24,270 --> 00:01:30,210 Because unlike that color yellow that we stared at earlier on, it's not so demanding on your attention 21 22 00:01:30,480 --> 00:01:35,430 and it's pleasant to look at for a long time which is what you're hoping for when you make an app because 22 23 00:01:35,430 --> 00:01:38,960 you want them to stay within the app as long as possible. 23 24 00:01:38,970 --> 00:01:46,350 So the opposite of analogous colors is when you take one color on the color wheel and match it with 24 25 00:01:46,350 --> 00:01:49,320 it with the color that's directly opposite to it. 25 26 00:01:49,590 --> 00:01:51,660 And this is called complementary colors. 26 27 00:01:51,810 --> 00:01:59,430 Now complementary color palettes produce extremely clashy designs that stand out, that grab your attention 27 28 00:01:59,760 --> 00:02:07,080 and can be good for logo design or attention grabbing screen shots but they don't make very good color 28 29 00:02:07,080 --> 00:02:09,100 palettes for your main interface. 29 30 00:02:09,270 --> 00:02:13,440 You don't want to be staring at clashing colors all the time. 30 31 00:02:13,440 --> 00:02:17,770 So how can you tone down the flashiness of complementary colors? 31 32 00:02:18,090 --> 00:02:22,220 Well you can take one color on the color wheel for example red, 32 33 00:02:22,470 --> 00:02:26,950 and instead of going for its direct opposite in which case it would be green here, 33 34 00:02:27,180 --> 00:02:35,020 you can split that color into its analogous colors namely a sort of limy yellow and a light blue. 34 35 00:02:35,310 --> 00:02:41,970 Now by having a three color palette like this, you end up with designs that are still attention grabbing 35 36 00:02:42,240 --> 00:02:44,990 but are less classy and easier to look at. 36 37 00:02:45,180 --> 00:02:51,210 And I'm a huge fan of using split colors for app icon design because you're going to keep it very simple 37 38 00:02:51,210 --> 00:02:57,690 and it's going to be mostly shapes and colors and split colors allow that app icon to stand out in the 38 39 00:02:57,690 --> 00:03:00,600 app store without being incredibly clashy. 39 40 00:03:00,600 --> 00:03:03,750 Now what if you want to take that concept even further? 40 41 00:03:03,930 --> 00:03:10,500 Well you can pick one color on the color wheel and draw an equilateral triangle that links up to other 41 42 00:03:10,500 --> 00:03:11,060 colors. 42 43 00:03:11,250 --> 00:03:17,640 And what you end up creating is a triadic color palette. Now triadic colors tend to be quite well balanced 43 44 00:03:17,730 --> 00:03:19,670 and yet still attention grabbing. 44 45 00:03:19,770 --> 00:03:25,030 But the important thing about triadic colors is that they were pretty much over used during the 90s 45 46 00:03:25,260 --> 00:03:28,110 in traditional print design and advertising design. 46 47 00:03:28,170 --> 00:03:31,280 So a lot of the color palettes look very 90s 47 48 00:03:31,380 --> 00:03:37,110 and when you look at these two designs here they look very much like fast food chains from the 90s. 48 49 00:03:37,110 --> 00:03:39,890 So it's a color palette that feels a little bit dated. 49 50 00:03:39,990 --> 00:03:45,360 Now what's very modern at the moment and very in vogue is the idea of monochromatic colors. 50 51 00:03:45,480 --> 00:03:50,850 So taking the same color and combining it with either various amounts of white or various amounts of 51 52 00:03:50,850 --> 00:03:55,800 black to create different tones and shades that stand out from each other. 52 53 00:03:55,800 --> 00:04:01,620 Now of course you can mix in as much white or as much black as you like in order to provide as much contrast 53 54 00:04:01,650 --> 00:04:02,760 as you need. 54 55 00:04:02,820 --> 00:04:07,740 And these color palettes tend to be incredibly contemporary and work really well for modern digital 55 56 00:04:07,740 --> 00:04:08,260 design.