งานสอบถามเรื่องภัยเงียบจากโลก Cyber

หน้าเว็บ

การเลือกรูปแบบตัวอักษร

ชุดสีRGB

สีสำหรับเว็บไซต์

3. สีสำหรับเว็บไซต์

แนวตั้งหัวข้อที่ 3

3.1 สีหลัก เป็นสีชุดเดียวกัน เรียบๆ / เหมาะกับ concept + Tone เว็บไซด์

ใช้สีอย่างสม่ำเสมอ

แบ่งเป็นหมวดหมู่

- Color

- Font

- Logo

- Lay – out

- ข่าวสาร

- รายการ

- ละคร

- หนัง

3.2 สีพื้นหลัง

- สี เย็น, อ่อน, อ่านง่าย

- ภาพ หลากหลาย มีทั้งหนัง ละคร รายการต่างๆ ข่าว และซีรีส์

- มีวีดีโอและLink ต่างๆ

- ลวดลาย มีภาพประกอบเป็นรวดลาย

3.3 สีโดยรวม เข้ากับ Theme หลักของ Concept + Tone

สีหลัก - เป็นสีเรียบๆ ดูสดใส

แถบด้านล่าง - เป็นสีอ่อนเพื่อให้ภาพที่ลงโดดเด่น

3.4 สีกับหมวดหมู่

หลากหลายหมวดหมู่

- ข่าว เข้มๆ ทึบๆ

- บันเทิง สนุก, สดใส

- รายการทีวี ฟ้าเขียว, สะอาดตา, สบายตา

แนวนอน หัวข้อที่ 3

3.1 สีหลัก เป็นโทนอ่อนหลากสี / เหมาะกับ concept + Tone เว็บไซด์

ใช้อย่างเหมาะสมให้เห็นโดดเด่น

แบ่งหมวดหมู่

- Color

- Font

- Logo

- Lay – out

3.2 สีพื้นหลัง

- สี เย็น, มีอ่อน, อ่านง่าย

- ภาพ ไม่ค่อยมีภาพ

- ลวดลาย กลมกลืนกับสีพื้นหลัง

3.3 สีโดยรวม เข้ากับ Theme หลักของ Concept + Tone

สีหลัก - เป็นสีอ่อนหลากสี ดูสดใส

แถบด้านล่าง - เป็นสีอ่อน มีเขียวเข้มเพิ่มความสดใส

3.4 สีกับหมวดหมู่

- ติดต่อบริการ ฟ้าเขียว, สะอาดตา, สบายตา

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

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

แนวตั้ง

ขนาดของหน้าเว็บ 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 หาตัวมาผสมกัน มีความแตกต่างทางน้ำหนัก
- ใช้อักษรมีเชิงกับตัวหลัก
+การปรับระยะห่าง
- ควรปรับให้พอดีกับรูปแบบตัวอักษร

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

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




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




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

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

การออกแบบ 2

การออกแบบ

ธรรมชาติคือสิ่งเราต้องการ

น้ำตกทีลอซู ตั้ง อยู่ในเขตรักษาพันธุ์สัตว์ป่าอุ้มผาง อำเภออุ้มผาง จังหวัดตาก ห่างจากที่ทำการเขตฯ 3 กิโลเมตร ทีลอซู เป็นภาษากะเหรี่ยง แปลว่า น้ำตกดำ มีลักษณะเป็นน้ำตกภูเขาหินปูนขนาดใหญ่ ตั้งอยู่บนความสูงจากระดับน้ำทะเล 900 เมตร เกิดจากลำห้วยกล้อท้อ ลำน้ำทั้งสายตกลงสู่หน้าผาสูงชัน มีน้ำไหลแรงตลอดปี ความกว้างของตัวน้ำตกประมาณ 500 เมตร ไหลลดหลั่นเป็นชั้น ๆ มีความสูงประมาณ 300 เมตร ล้อมรอบด้วยป่าดงดิบที่สมบูรณ์ เป็นน้ำตกที่มีขนาดใหญ่เป็นอันดับ 6 ของเอเชีย

แนะนำตนเอง