color scheme 3

32
Introduction Color Schemes (CS) is the brainchild of Gregg Patton and Eni Oken, in face of the lack of software dedicated to help the artist make better art, specifically when dealing with color. Color Schemes is not an application to manipulate color; instead it will help you to stimulate your creativity in order to make your art more compelling through color combinations. Computer graphics tools have helped artists to develop their skills and to make it easier to produce

Upload: brett25

Post on 15-Apr-2017

241 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Color Scheme 3

Introduction

Color Schemes (CS) is the brainchild of Gregg Patton and Eni Oken, in face of the lack of softwarededicated to help the artist make better art, specifically when dealing with color. Color Schemes is notan application to manipulate color; instead it will help you to stimulate your creativity in order to makeyour art more compelling through color combinations.

Computer graphics tools have helped artists to develop their skills and to make it easier to produce

Page 2: Color Scheme 3

technically perfect graphics and imagery. The same tools also allow artists to manipulate color in aneasier way, making 16 million colors available to the artist. Historically speaking, that is unheard of;before the computer age, artists had to rely on pigment which was always difficult and cumbersome tomanipulate.

However, even with so many colors available, artists and clients alike are still unprepared to deal withthis wealth of information. It becomes necessary to go back to traditional teachings in order tounderstand color theory and the basics of what makes good art.

Color is everywhereEven though most of the time we are unaware of it, color is the phenomenon that allows us to seeshapes and perceive form. It can also cause psychological response deeper than we care to admit.Every year, trends and fashion dictate what color we will use, and entire generations are governed bythe "right" colors. Color has deep cultural meaning: what is proper in one culture may not be foranother. And unfortunately, color is also cause for segregation.

The artist is the controller of colorAs artists, we are responsible for the effect color will cause over our audience. Dark colors mayprovoke entirely different reactions than bright saturated colors. As controllers of color with suchresponsibility, it is imperative that we learn to manipulate it in order to make the audience react exactly

Page 3: Color Scheme 3

how we want them to.

Color schemesOne method to control color and the effect it will have over the audience is to choose a "color scheme",or "color theme" before starting the project. A color scheme contains nothing more than the basic mainhues present in the project. By choosing this colors ahead of time, without the influence of form orshape, artists are more capable of perceiving color in it's purest state.This is an example of the color scheme for a 3D computer graphics scene:

Page 4: Color Scheme 3

Advantages of using a color schemeBy using a solid and well planned color scheme, you will guarantee that the audience will have aresponse to color exactly as you intend it to be. Visual art work which has received careful planningthrough color schemes is more likely to have a finished, designed look and therefore, more likely to beaccepted by the audience no matter how outrageous the design.

That is exactly what Color Schemes, the software, does: it helps you to come up with interesting andappropriate color schemes for your project, by using conventional color theory as a guide to stimulateyour creativity.

Color theorySince good understanding of color theory is such an important issue for the success of any visualartwork (besides playing a fundamental role in the creation of the software), a few basic points areworthy of note.

Color is subjectiveFirst of all, it is necessary to point out that color theory is a very subjective study; there are severaltheories and we can only offer what is common knowledge. Other theories will offer different views, werecommend that you further your studies in color theory to become more acquainted with all of themand choose the most suitable one for your needs.

Page 5: Color Scheme 3

Primary colorsEven though they differ, most color theories agree on a few basic points. The first one is:

• There is a collection of colors, called primary colors, which are responsible for forming all theother colors in the spectrum.

Even though this is such a simple rule, that is where the confusion starts:depending on the medium used to form colors (light, pigment, etc), theprimary colors will vary. There are two basic systems, based on the medium,used to classify colors:

1) Additive system: also called RGB, it is based on color made by light,and can be easily observed in the lights of a theater, or the tiny dots ofthe TV screen. The primary colors for the additive system are: RED,GREEN and BLUE and when all of them are mixed together, they formwhite, hence the name.

2) Subtractive system: also called CMY, is based on pigments and paint,and can be observed in all kinds of paintings, prints, magazines, books.The primary colors for the subtractive system are: CYAN, MAGENTAand YELLOW. These colors when mixed all together form black.

Page 6: Color Scheme 3

Note: When the printing industry startedusing this system, it was noticed thatalthough mixed together these threecolors form black, it does not have thedepth necessary to achieve rich, darkcolors. Therefore, they added black as afourth primary color, forming the CMYKsystem.

CS allows you to choose colors usingboth the Additive system or theSubtractive system. Under the tabSliders, you will find three types ofsliders, two of which are based on theadditive (RGB) and subtractive (CMYK) systems.

3) Popular system: Although not based on any medium, there is a third system, which is based oncommon knowledge and usually taught to children in grade school. The "popular system" is based onthe three primary colors RED, YELLOW and BLUE and has proven to have a deep, ingrainedpsychological effect on people, and therefore is the system more commonly used by artists whenchoosing colors that will affect the audience.

Page 7: Color Scheme 3

Secondary colorsThe first rule of color theory stated that the primary colors are responsible for forming all the othercolors of the rainbow. Most color theories also agree that if two primary colors are mixed together, theywill form a secondary color. So, in summary, these are the basic primary and secondary colors for thethree systems:

Page 8: Color Scheme 3

Tertiary colors and the Color WheelWhen a primary color is mixed with a secondarycolor, a tertiary color is formed. When displayedin a circular fashion, it forms what is called a colorwheel. Each color can be then mixed to itsneighbor to form other hues.

The color wheel is one of the most important toolsan artist can use to make up color schemes. CShas a powerful interactive color wheel, that can bemanipulated in a very intuitive way.

The example shown here displays the popularsystem's color wheel. This is obviously a verysimplified version, showing only colors in thepurest hue, that is, in their purest state.

Page 9: Color Scheme 3

Complementary and Analogous ColorsTwo other color theory concepts are also important to know before approaching CS:1) Complementary colors: are those that are directly opposite to each other on the color wheel.

These colors in theory nullify each other, that is, they irritate our eyes in a way that we strive for amedium grey.

2) Analogous colors: are those colors that are close to each other on the color wheel. They aresimilar and therefore form a more or less neutral combination, without irritating our eyes.

Page 10: Color Scheme 3

Color Schemes: The ProgramCS was designed to help you see how colors interact with each other independently of the theme,shape or form of your project. It displays colors in their purest form. CS was created for artists anddesigners, in an attempt to ease the process of choosing the best color scheme for each project.

CS InterfaceThe main windows of CS are divided into the following areas (see figure on next page):1) Color scheme display window: displays the color scheme you are working with. In this window,you can clearly see how one color affects the other. The window shows colors in three differentpatterns, helping you to visualize how each color can affect it's neighbor. This window can also showmultiple color schemes.2) Color Wheel window: displays a sophisticated color wheel, with almost all the different colorsavailable.3) Current color display: displays one single color and allows real-time adjustment through controls.4) Interface tabs: change the color wheel display into other controls that allow fine-tuning of singlecolors.5) Color tabs: displays all the colors of the current scheme, showing the current one being work onabove the others.6) Pull-down menus: traditional pull down menus have controls the allow saving files and editing.

Page 11: Color Scheme 3

1. Colorscheme displaywindow

2. Color Wheelwindow

3. Current colordisplay

4. Interface tabs

5. Color tabs

6. Pull-downmenus.

Page 12: Color Scheme 3

How to create color schemes: different methodsCS offers many ways to manipulate and create colors schemes. You will find that your own personalmethodology will guide you after you've acquired experience with the software. As a starting point, weoffer the following methods:

First method:Choose quantity andRandomize Colors

When you first initiate CS, thecolor scheme window will pick arandom color scheme that canhave any number of colorsbetween 1 and 5. You canchoose then adjust the numberof colors you want by adjustingthe Total colors amount andclicking on the Randomizebutton to make the softwarechoose for you. You can alsorandomize individual colors.

Page 13: Color Scheme 3

Second method:Choose quantity and pickindividual colors from the ColorWheel

If you want to have a little bit more of controlover the color scheme, you can pick eachcolor individually on the color wheel.Depending on the number of colors youdetermine in the Total Colors, CS willdisplay a different shape (also calledgeometric overlay) on the color wheel: astraight line for 2 colors, a triangle for 3colors and so on. Each vertex correspondsto the position of the individual color on thescheme. By clicking and dragging on thevertex of the shape on the color wheel, youcan adjust individual colors. If you dragthem towards the center, they will becomelighter; towards the perimeter, they willbecome darker.

Page 14: Color Scheme 3

An important comment about the colorwheel: the wheel itself is not capable ofdisplaying 16 million colors, for it shows onlyhues added with white (making them lighter) orhues added with black (making them darker).

The amount of grey (saturation) is controlled withthe slider bar underneath the wheel. If you dragthe slider, it is possible to create unsaturatedcolors, however, you may create a color thatcannot be displayed on the wheel. If that shouldhappen, CS will then display the vertex outsideof the wheel marked in red, and will show thebutton FN (find nearest). If you click on FN, thenearest match will then be located.

The color wheel offers many creativepossibilities, see further on for a more detaileddescription of it's side bar.

Page 15: Color Scheme 3

Third Method: Create individualcolors using the sliders

If you prefer a more logical approach tochoosing colors, CS offers a range oftraditional sliders with which you can finetune colors. Under the tab Sliders you willfind three sets of sliders:First slider àà Hue, Saturation and Value:the hue slider controls the color at itsmaximum brilliance and saturation. TheSaturation controls the amount of gray, or"dirtiness", and the Value controls theamount of white or black (brightness).

Second slider àà RGB: by varying theamounts of red, green and blue, you canobtain colors using the additive system.

Third slider àà CMYK: by varying the Cyan,Magenta, Yellow and Black, you can obtaincolors using the subtractive system.

Page 16: Color Scheme 3

The easiest way to create a color usingsliders is to use the HSV set of sliders:

1) Choose the main hue (in the figure weare using purple as the main hue), thendrag both the Saturation and Value slidersall the way up to 100%.2) Fine tune the colors: if you want thecolor to have less strength, to be dirtier,then drag the Saturation slider down;

3) If you want to control the darkness,then drag the Value slider down.The figures show the same color purplebeing manipulated with the HSVSaturation and Value sliders.

Note: The C buttons allow you to copyvalues to a text file, and the HTMLbutton converts colors to html format forweb sites.

Page 17: Color Scheme 3

Fourth method:pick individualcolors by name

CS also offers thealternative of choosingcolors by name, althoughthis is quite a bitsubjective.

By clicking on the tabNames you will bepresented with a list ofcommon names given tocolors and a fewalternatives per name.You can then click anddrag the color chosen tothe current color displayor the color schemewindow.

Page 18: Color Scheme 3

Fifth method: Use the formulas to come up with new ideasCS offers a powerful tool that helps you stimulate your creativity: the formula wizard. By usingtraditional Color Theory concepts, CS can come up with suggestions for color schemes. To call theFormula dialog box, simply click on Formulas at the bottom of the color scheme window.

A new window, similar to the main interface, will appear over CS. Notice thatCS uses the current color to make its first calculations.It is recommended that the first thing you do is hide the main window by clicking on the buttonHide/Show Main Window, so the colors in the background will not conflict visually with the formulaswindow (See figure on next page).

Page 19: Color Scheme 3
Page 20: Color Scheme 3

FormulasSince color is such a subjective theme, please keep in mind that the solutions offered by the FormulaWizard will not always fall into a specific category, and the comments made here are largelygeneralized.

The wizard can work based on thecurrent color or independently. Whenworking with the current color, the colorwill be displayed in the current colorwindow. When using a formula that doesnot use the current color, the wizard willdisplay a checker board pattern in thedisplay area. See figure ßThere are four main action buttons in theformula wizard:• Add and Update: Will either add a

new scheme or replace the currentone in the main interface window.

• Re-Calc: will recalculate a newversion for the current formula tab.

• Re-Calc All: will recalculate newversions for all the formula tabs.

Page 21: Color Scheme 3

Click on one of the tabs to bepresented with one of thefollowing formulas:

Monochromatic: By using thecurrent color as a starting point,CS offers a color scheme withmonochromatic colors, that is,the same hue with differentvalues (brightness). This kindof color scheme is usually dullbut not irritating.

The figure shows an exampleof an almost monochromaticscene, using brown as maincolor, and a few isolatedaccents of other hues.Image by Eni Oken, Copyrights1996 2Way Media.

Page 22: Color Scheme 3

Analogous: CS offers a color scheme by choosing colors that are neighbors to the current color on thecolor wheel, with different values. This type of color scheme is usually appropriate for moreconservative audiences.

Primaries/Secondaries: CS disregards the current color and offers a color scheme based solely onprimary and secondary hues, with different values. These colors are usually vibrant, and this kind ofcolor scheme usually appeals to younger audiences such as children and teens.

Tertiary: CS disregards the current color and offers a color scheme based only on tertiary colors. Thistype of color scheme is also vibrant, but they do not have the primary appeal as the Primary/Secondaryones have. This type of color scheme is suitable for more alternative audiences, capable of acceptingstrange combinations.

Pastels: CS disregards the current color and offers a combination of colors that are located next towhite. This type of color scheme is usually very feminine and soft, but can also be used for children'sthemes and poetic fairytales.

Warm: CS disregards the current color and offers only colors that are considered WARM (yellow,orange, red, magenta) in different values. This type of color scheme is usually cheerful and vibrant, butcan be tiresome after a long period of time.

Page 23: Color Scheme 3

Cool: CS disregards thecurrent color and offers onlycolors that are consideredCOOL (magenta, purple, blue,teal, green), in different values.This type of color scheme isconsidered soothing and doesnot irritate the eyes so much,but can be boring after a while.

The figure shows an exampleof an image using only coolcolors: purple, blue and green.Image by Eni Oken,Copyrights 1996 L-Squared.

Page 24: Color Scheme 3

Complementary: CSoffers a color schememade of the current colorplus a directcomplementary (a colorthat is directly opposite toit on the color wheel).These colors usually clashwith each other, irritatingthe eyes, therefore thistype of color scheme isusually more suitable formore audacious projects.

The figure uses blue andorange, which arecomplementary colorsàImage by Eni Oken,Copyrights 1997 AlfredPublishing

Page 25: Color Scheme 3

Discord: CS offers color schemes composed of colors that clash withthe current color. These combinations are usually vibrant andenergetic, but can tire the eyes quickly.

Neutral: CS offers combinations made of colors that do not clashwith the current color, and are visually soothing. These colors tend tobe a little boring after a while.

Split-Complementary: CS offers a color scheme using neighboringcolors of the current color. This type of color scheme is usually a littlesofter than the straight complementary combinations but are stillaudacious.

3-way-split: CS splits the color wheel in three parts, based on thecurrent color. This type of color scheme is usually cheerful and fun touse, although it should be used for more accepting audiences.

Page 26: Color Scheme 3

4-way-split: CS splits thecolor wheel into fourequally distant partsbased on the currentcolor, and varies thevalues. This type of colorscheme is difficult to usebut produces intense,vibrant results.

The figure shows animage with a complexcolor scheme originallybased on the 4-way splitplus one extra color,orange. See the colorscheme on the next page.Image by Eni Oken,Copyrights 1999 EniOken.

Page 27: Color Scheme 3

This figure showsthe color schemefor the image of theprevious page.Notice how thefour colors red,yellow, blue andmagenta form arectangle. Theadded orangebreaks the perfectquadrilateral.

Page 28: Color Scheme 3

Typical workflow with CSA typical workflow with CS would consist of:1) Create a color scheme using one of the methodsdescribed before.

2) In the color scheme window, double-click to change tomultiple color scheme mode. See figure. àThis allows you to see several color schemes at the sametime.

3) Right click to show the mouse menu (or choose Edit/AddScheme) to add a new scheme. It will be a copy of the firstscheme created.

4) Click on the new scheme to make it active.

5) Double click anywhere in the window to work in singlecolors scheme mode.

Page 29: Color Scheme 3

6) Manipulate and fine tune one or more colors of the new scheme. Click on the color tabs to make achosen color current and use the color wheel, sliders, randomize or color names to fine tune it.

7) Create another color schemes using the formulawizard. Add the new scheme to the multiple windowdisplay.

8) Interchange colors between the color schemes bydragging colors from one scheme to another. Use theCTRL or SHIFT to swap or replace (see the roll-overhelp: position the cursor anywhere in the maindisplay window and a help window will appear).

9) Test the colors in the TEXT tab to see how theywould appear in a graphics arts project or web site.See figure ß

10) Name the individual color schemes if you like,using the Rename schemes button (or useEdit/Rename Scheme). Save your work by usingFile/Save.

Page 30: Color Scheme 3

Stimulating your creativityThe methods described before are just a way to start using CS to create color schemes. The truepower of CS lays in it's ability to create unexpected color schemes to jump start your creativity. Youalready saw the power of the formula wizard, and also the Randomize buttons.

The Color Wheel Side barIf you are lacking ideas, you can also play with thecolor wheel's side bar, manipulating the shapes, andat the same time, creating surprising results.

1) Create any color scheme, with at least 3 colors.2) Be sure that the Show geometric overlay checkbox is checked. This will show the geometric shapeover the color wheel.3) Be sure that none of your colors is falling off thecolor wheel (A button FN will appear in the lower lefthand corner of the wheel, which will allow you to findthe nearest match inside the wheel).4) Use the Move button and arrows to move theshape over the wheel. Notice how it shifts colors.

Page 31: Color Scheme 3

5) Use the Rotate button and arrows to rotate the shape, creating unexpected results.6) Use the Scale button with the plus and minus size to change the darkness of the colors (minus willmake the shape smaller, thus making the colors whiter; plus will make the shape larger, making thecolors darker.

The Variable color tabAnother way to vary a color scheme in CS is by using the Variables color tab: it's the last tab under thelateral color tabs (See figureà).This tab offers a menu that allows to vary thecolors of the current color scheme:Contrast: will adjust the contrast betweencolors.Brightness: will adjust the relative brightnessof all colors.Saturation: will adjust the saturation of allcolors.Hue: will change the hue of the colors, basedon the Amount slider underneath.If you make changes and like the results, youcan make those changes permanent byclicking on Make Changes Permanent.

Page 32: Color Scheme 3

CreditsThis document was written by Eni Oken. All rights reserved.CS was designed and developed by Eni Oken and Gregg Patton.CS was programmed by Gregg Patton.Copyrights 1999 Can You Imagine Software, Inc. All rights reserved.

Eni Oken is a freelance 3D artist based in Los Angeles. As an architect with 11 years of experience incomputer graphics, she has participated in the creation of 3D art for numerous interactive projectssuch as games, web sites, multimedia and virtual worlds. She has also won several awards for herwork and is the author of 3 books and several magazine articles covering topics related to creatingcomputer graphics art. You can reach Eni at: www.oken3d.com

Gregg Patton is a software engineer with over 11 years of professional experience in softwaredevelopment. Gregg has developed several computer graphics applications and plug-ins over theyears. Some of these applications include Tree Factory, Tree Factory - MAX, and DigiPeople.Gregg lives in Fort Worth, Texas and can be reached at [email protected]

Web site: www.canyouimagine.com/prod_cs.htmTech support: [email protected]: [email protected]