Color Palette Generation - Presentation

Here's the discussion notes I plan to use while presenting in class this morning.

http://mhsanders.iweb.bsu.edu/TCOMM351/color_palette.html

-Mitch Sanders

Creating Texture

What is it?
Texture is the combination of points, lines, shapes, and patterns to create complex visual imagery.

Examples:

Wicked Worn Look
The Wicked Worn Look is used to give sites an antique look. It involves using distressing, color variations, shadows, as well as perceived ripping and tearing.

Web 2.0
What could be, by far, one of the most annoying design trends to become popular within the last few years, Web 2.0 sites are characterized by gradients, white space, rounded edges, big type, and a clean feel

Cartoon Style
The Cartoon Style can best be described as what a website would look like if it were designed by a 10 year old with photoshop skills. It features bright colors, often cartoonish images (duh), rounded corners, simple layouts, and a playful feel. Basically Web 2.0, minus the "NEW!" badge.

For more information, and a ton of examples, check out this quick google presentation.

Pattern

Repeating patterns have been given a bad rap from the horrible tiling backgrounds of early 90s websites. Pattern has a new face thanks to DreamWeaver and CSS properties. Using the settings one can manipulate a pattern using five different elements found in the CSS properties.
1: Color - background color can be applied to any element along with transparency settings.

2: Image - Any image can be used as a background instead of a simple color background using a url image or an uploaded file.

3: Repeat - Any element can be repeated just like the early 90s tiling backgrounds. CSS properties differs by letting you repeat x, repeat y, apply no repeat, or repeat all over the place like the olden days.

4: Attachment - The background image can be applied to stay fixed or to scroll in congruence with the scroll bar

5: Position - CSS allows you to control the placement of the image on the x and y coordinates using three methods. Simply using top, left, right, and center will place the object in any combo of those positions. You can define the location by using percent (ex. [50% 0%] would place it in the top center). Lastly you can use the most amount of accuracy and define its location via pixels (ex. [200px 300px]). NOTICE: Do not combine any of these three methods!)

Using these elements can be a crucial way to create a unique layout to your website. Though some are weary of using a repeating images in their sites in fear of looking gaudy, applying a repeat to a pattern can be at times unnoticeable to the untrained eye. SEE!