Graphic Color and Tools 322432 Web Design Technology
By Yaowaluck Promdee, Dr. Sumonta Kasemvilas
WDS CS KKU
Web design technology | 2015 1
Index
• The Design Concept • Color • Graphic • Graphic Tools • Assignment
WDS CS KKU
Web design technology | 2015 2
THE DESIGN CONCEPT
WDS CS KKU
Web design technology | 2015 3
The Design Concept
1. To inform 2. To identity 3. To persuade
WDS CS KKU
Web design technology | 2015 4
Plan Research, Observe
Wireframe, Concept
Design
Design Concept WDS
CS KKU
Web design technology | 2015 5
WDS CS KKU
Web design technology | 2015 6
Design isn’t visual
Be user centric
Design is in detail
Sketch often User white space
Keep inspirations
Design is all about
problem solve
Don’t copy ideas
Graphisc and colors
The Design Concept for web designer
http://www.creativebloq.com/web-design/10-design-concepts-web-developers-need-know-11135255
GRAPHICS AND COLORS
WDS CS KKU
Web design technology | 2015 7
Graphic • Vector • Bitmap
WDS CS KKU
Web design technology | 2015 8
Web design technology | 2015 9
http://www.creativebloq.com/colour/tools-colour-schemes-12121430
Web design technology | 2015 10
Color of
emotions
GRAPHIC TOOLS
WDS CS KKU
Web design technology | 2015 11
Graphic Tools
Picture editor, Design page Vector picture editor
WDS CS KKU
Web design technology | 2015 12
Screen of Illustrator
Artwork
Zoom in, Zoom out Page for Show your work
WDS CS KKU
Web design technology | 2015 13
Selection, Crop & Slice Tools
Retouch & Paint Tools
Drawing & Type Tools
Foreground Color & Background Color
Screen Modes
WDS CS KKU
Web design technology | 2015 14
Layout Design Sketch
Digital Mockup
WDS CS KKU
Web design technology | 2015 15
Example
http://i.ytimg.com/vi/1kW9LQ9hYK4/maxresdefault.jpg http://wwwimages.adobe.com/
WDS CS KKU
Web design technology | 2015 16
Example
http://webdesignfan.com//
http://webdesignsurvivalist.com/ WDS CS KKU Web design technology | 2015 17
http://vanimg.s3.amazonaws.com/
Example
http://bloomwebdesign.net/
Web design technology | 2015 18
Assignment#9 • Design your blog 2 pages (Homepage and
About Me using Photoshop)
Web design technology | 2015 19
Top Related