Principles of Design: Color

Jonathan alfons0

Picking our Topics

What was my Topic?

color

Thinking about it…

Issues…

ideas

Project Description

• Color = a form of visual communication that impacts on our daily lives.

Sitemap

Mockup

Examples with color on Websites

html

<a href="http://decode.uk.com/"><img src="images/decode_site.png" id="decode" alt="decode site" class="span6”></a>

css

#decode {width:40%; max-width:400px;-webkit-box-shadow:3px 3px 3px #000;-moz-box-shadow:3px 3px 3px #000;box-shadow:3px 3px 3px #000;

}

javascript

$(document).hover(function () { $("#decode").css("background" , "url(../images/decode_hover.png)");

}, function () { $("#decode").animate({opacity:'0'}); } );

pros

• Arranging the images paragraph and text properly.

• Using the bootstrap button-generator.

Cons

• JavaScript doesn’t work.

• Unable to hover from image to image.

Other Technicalities

• Unable to do the three external sizes of large displays, default, tablets, and phones.

• Dealing with proportions of each object.

To improve

• More time = More Effort• Learn more about the JavaScript tool

in order to animate my desired objects.

Thank you

Jonathan Alfonsojmalfonso7@gmail.com

jalfonso4@horizon.csueastbay.edu