รูปแบบและการนำเสนอ

ลักษณะโครงสร้างหน้าเว็บ

แนวตั้ง

ขนาดของหน้าเว็บ 1024X768 px

การจัดวางตำแหน่ง

ส่วนหัวมี Logo ชื่อเว็บ แถบเมนู Navigation

ส่วนเนื้อหา มีตัวอักษรข้อมูลต่าง ๆ ภาพและวิดีโอประกอบ

ส่วนท้าย ข้อมูลเพิ่มเติม

ตำแหน่งของเมนู

แถบNavigation อยู่ตรงกลาง

ลักษณะของเมนู

ข้อมูลข่าวสารและภาพเคลื่อนไหว

การแบ่งหมวดหมู่ของเว็บ

ข่าวรายการ เนื้อข่าว / วิดีโอข่าว / ฐานข้อมูล / ละคร / รายการบันเทิง

แนวนอน

ขนาดของหน้าเว็บ 1024 X 768 px

การจัดวางตำแหน่ง

ส่วนหัวมี Logo ชื่อเว็บ แถบเมนู Navigation

ส่วนเนื้อหา มีตัวอักษรข้อมูลต่าง ๆ

ส่วนท้าย ข้อมูลเพิ่มเติม

ตำแหน่งของเมนู

แถบNavigation อยู่ตรงกลางด้านซ้าย

ลักษณะของเมนู

ข้อมูลตัวอักษร

dropdown

Roll-Over

การแบ่งหมวดหมู่ของเว็บ

Home / About / Our Matrials / Produucts and Services /

Advantages / Our Colours / Contact / Downloads

รูปแบบการประยุกต์ใช้มัลติมิเดีย

วันที่ 9 กันยายน 2553

องค์ประกอบของการออกแบบเรืองสี

The Color Whee วงจรสี

Hue - เนื้อสี

Saturation – หาคำศัพท์ ,ความสดของสี ,ความเจิดจ้า

Value - น้ำหนักสี

ระบบสี CMYK

400 ,20m, 100y, 0k

RGB

141r, 145g , 32b

หลักการเลือกสี Color combination

1. MONOCHROMATIO การใช้สีเดียว สร้างความแตกต่างด้วยระดับความมืด ความสว่างของสี

2. TRIADS การใช้สี สาม สี่ เลือกจากสีตรงข้ามกันในวงจร เพื่อสร้างความแตกต่าง

3. ANALOGOUS การใช้สีที่อยู่ติดกัน โดยเลือกจากสีที่อยู่ถัดไป อีก 2-3สี สร้างความกลมกลืน

4. COMPLEMENTARY การใช้สีตรงข้ามกัน สามารถช่วยเน้นความโดดเด่น การใช้สีดำหรือเทาเพื่อลดความรุนแรงของสี

5. SPLIT-COMPLEMENT]S การใช้สีแบบผสม เป็นการผสมผสานระหว่างสีโทน ร้อนและเย็น โดยเริ่มจากสีใดสีหนึ่ง และจับคู่กับอีก 2 สี ในโทนตรงข้ามกัน

องค์ประกอบของสี

สี, เนื้อสี Hue
เนื้อสี หรือ Hue คือความแตกต่างของสีบริสุทธิ์แต่ละสี ซึ่งเราจะเรียกเป็นชื่อสี เช่น สีแดง
สีน้ำตาล สีม่วง เป็นต้น โดยแบ่งเนื้อสีออกเป็น 2 ชนิด

1. สีของแสง (Coloured Light)
สีของแสง คือความแตกต่างสั้นยาวของคลื่นแสงที่เรามองเห็น เริ่มจากสีม่วงไปสีแดง
(เหมือนรุ่งกินน้ำที่เรามองเห็นหลังฝนตก)
2. สีของสาร (Coloured Pigment)
สีของสาร คือสีที่เรามองเห็นบนวัตถุต่าง ๆ ซึ่งเกิดจากการดูดซืมและสะท้อนของความ
ยาวคลื่นแสง

น้ำหนักสีValue

จะว่าไปแล้วแน้ำสีก็คือเรื่องของความสว่างของสี หรือการเพิ่มขาว เติมดำลงในเนื้อสีที่เรามีอยู่
และการปรับเปลี่ยนน้ำหนักสีนี่เองที่ทำให้ภาพดูมีมิติ ดูมีความลึก หรือที่เราเรียกวันว่า โทน Tone ซึ่ง
บางครั้งสร้างความน่าสนใจ ดึงดูดและความสมจริงให้กับงานที่เราออกแบบไ้ด้

ค่าความสว่างสีต่ำ ค่าความสว่างสีปานกลาง ค่าความสว่างสีสูง

เรามาดูตัวอย่างงานกันดีกว่า

ตัวอย่างงานออกแบบกราฟิกที่มีการปรับเปลี่ยนน้ำหนักสี ในการออกแบบ ซึ่งถ้าเราใช้สีเดียว
ในการออกแบบ จะเรียกว่าเป็นงาน Monochrome

ความสดของสี Saturation ความสดของสีหรือบางคนอาจเรียกว่า ความอิ่มตัวของสี เป็นเรื่องสำคัญอีกเรื่องหนึ่งใน การออกแบบ การใช้สีบางครั้งเราอาจจะต้องลดหรือเพิ่ม ความสดของสีใดสีหนึ่ง หรือ ทั้ง 2 สี เลยก็ไ้ด ในกรณีลดความสดของสีก็เพื่อไม่ให้ภาพงานที่ออกมานั้นดูฉูดฉาดจนเกินไป ลดความ สดของสีจะเรียกอีกอย่างว่า เป็นการเบรกสีก็ได้ ในการเบรกสีของงานศิลปะ ศิลปินมักจะใช้สี น้ำตาลซีเปียมาเติมลงในสีที่เขาต้องการเพื่อให้สีที่ได้ออกมามีเนื้อสีเดิมแต่ดูหม่นลง เรามาดูตัวอย่างภาพที่ความสดของสีต่างกันดีกว่า

ทั้งสองภาพเป็นภาพเดียวกันแต่มีให้แสดงความสดของสีของดอกไม้ ออกมาต่างกัน ทำให้เห็นได้ว่า ภาพแรกเป็นภาพที่น่าสนใจกว่า

ตัวอักษร

- บอกอารมณ์และความรู้สึกแม้แต่จะเป็นคำเดียวกัน แต่น้ำหนักและอารมณ์ต่างกัน

- ให้สำเนียงคำกับประโยค
TYPO*
*ความหมาย
'TYPOGRAPHY'
การใช้อักษร หรือการจัดวางตัวอักษร
'FONT (TYPEFACES)'
ชุดรูปแบบของตัวอักษร
'FONT FAMILIES'
ตระกูลของชุดแบบของตัวอักษร เช่นตัวธรรมดา ตัวหนา เอียง
TYPO*
+ส่วนประกอบ
- มีเชิง
- แบบเรียบ
+ขนาด
- หน่วยงาน = POINTS
- แล้วแต่การใช้งาน
+ประเภท
- Serif, เลือกจากการเปรียบเทียบ, Script (Hand - lettered) ลายมือเขียน
- Monospace เป็นบล๊อก ๆ เป็นช่วง
- Novelty, Dingbat, Ornament
+การจัดตำแหน่ง
- ให้เหมาะสมกับรูปร่างและลักษณะการใช้
+การผสมตัวอักษร- ไม่ควรเลือกเกิน 2 Font หาตัวมาผสมกัน มีความแตกต่างทางน้ำหนัก
- ใช้อักษรมีเชิงกับตัวหลัก
+การปรับระยะห่าง
- ควรปรับให้พอดีกับรูปแบบตัวอักษร

สรุปโจทย์การออกแบบ

กลุ่มเป้าหมาย :
ทุกเพศทุกวัย, ชอบเที่ยว, มีเวลาว่าง




ภาพสื่อแนวคิด : รวมพลคนไทย ร่วมใจเที่ยวไทย




ภาพสื่ออารมณ์และความรู้สึก :

ชอบเที่ยว, รักสนุก, ท้าทาย