คลิบแนะนำตัวของผม

clip จะมาเร็วๆนี้คับ



ชื่อ เบญ อ่ำเจริญ รหัส 5202100062 IT 2 ต่อเนื่อง +++++++++++++++++++++++++++++++++++++

คลิบแบบสอบถามเรื่องภัยจากโลกไซเบอร์

คลิบอันนี้ผมเอามาจากเบนอยู่กลุ่มดียวกันคับ

GUIDE

หลักการการใช้ตัวอักษร และภาพกราฟฟิก

1.สีของตัวอักษร
เข้ม พื้น อ่อน/กลางกลาง ,พื้น เข้ม/อ่อนอ่อน ,พื้น เข้ม/กลาง

2.ลักษณะตัวอักษร
html (css) การกำหนดสีด้วยภาษาคอมพิวเตอร์ โดยการเขียนโปรแกรม
ฟอนต์มาตรฐานที่ใช้กับหน้าเว็บ Ms san serif,Arial,Geneva,
Helvetija 14-20 pt ซึ่งอ่านง่ายสุด

3.จำนวนของภาพกราฟฟิก
ภาพที่ใช้ประกอบในเว็บไซต์
ขึ้นอยู่กับความเหมาะสมของเนื้อหา

4.ต่ำแหน่งในการวางภาพ
ควรจะอยู่ด้านซ้าย ขวา หรือกลาง ขึ้นอยู่กับเนื้อหาของเรา

5.ขนาดของภาพ
ควรจะคำนึงถึงการโหลดภาพของภาพ
ขนาดภาพควรไม่เกิน150k
ไฟล์ที่ใช้ JPEG , GIF

6.หลักการใช้สีสำหรับการออกแบบเว็บไซต์
จำนวนของสีหลักให้เลือกตาม Concept + Mood Tone หรือ Theme เพื่อแสดงให้ถึงภาพลักษณ์
สีหลักควรจะมีอยู่4สี เป็นชุดเดียวกัน ส่งเสริมภาพลักษณ์ให้ดูเข้ากัน

6.1การใช้สีพื้นหลัง
ภาพ ลวดลาย สีควรใช้แต่พอดี ควรใช้ตามความจำเปน ไม่รบกวนสายตา
ควรจะเป็นสีโทนเย็น แต่ถ้าจะใช้สีโทรร้อน ตัวอักษรควรใช้สีอ่อน

6.2โทนสีโดยรวม
โทนร้อน โทนเย็น แบ่งเป็นเปอร์เซ็น

6.3สีกับหมวดหมู่
หมวดข่าว บันเทิงอยู่ลักษณะเนื้อหาของหมวดหมู่
เช่น เว็ปทีวี ข่าว ละคร บริการ แต่ละหมวดหมู่ก็จะมีสีประจำตัวอยู่

7.การใช้ภาพเคลื่อนไหว
ใช้เพื่อสร้างสีสันในส่วนของโลโก้ (LOGO Animated)
Interactive คลิกแร้วใหญ่ขึ้น อยู่ที่ปุ่มต่างๆ แถบเมนูนำทาง
วิเคราะห์ว่าเว็บมีภาพเคลื่อนไหวมั้ย มีลักษณะอย่างไร

7.1การใช้วีดีโอคลิป
อยู่ที่ความเร็วอินเตอร์เน็ตด้วย คิดว่ากลุ่มคนที่ดูเว็ปเราการโหลดเร็วแค่ไหน

7.2การใช้เสียง
เว็บที่เกี่ยวกับข่าว หรือไม่เกี่ยวกับบันเทิงก็ไม่ควรมี
แบ่งตามลักษณะหมวดหมู่ด้วยนึกถึงกลุ่มคนที่เข้ามาดูเว็ป

8.การทำรูปemotion ต่างๆ
สามารถทำภาพแบบโปร่งแสงได้ เมื่อนำไปวางบนพื้นหลังสีอะไร ด้านหลังรูปจะเป็นสีตามพื้นหลัง

รูปLOGOและรูปแบบFONT

ตัวโลโก้



แบบสีที่ใช้



รูปแบบFONT

โครงสร้างเวป แบบแนวนอน

โครงสร้างเวป แบบแนวนอน
ขนาดของเวป 1024*768
การจัดวางตำแหน่งของ LOGO เนื้อหาภาพประกอบอยู่ซ้ายมุมบน
ส่วนหัว branding,design for print, หน้าเว็บ,editorial,ติดต่อเรา
ส่วนกลาง เนื้อหา,รูปภาพหัวข้อเรื่อง
ส่วนล่าง แสดงความคิดเห็น,web design essex,graphic designers,company logodesign,brangdesign
ตำแหน่งข้อมูล Navigation Bar อยู่ด้านบนขวาสุด
ลักษณะของเมนู แบบตัวอักษรภาษาอังกฤษ
การแบ่งหมวดหมู่ กิจกรรม,branding,design for print, หน้าเว็บ,editorial,ติดต่อเรา

โครงสร้างเว็ป แบบแนวตั้ง

ขนาดของเวป 800*600
การจัดวางตำแหน่งของ LOGO เนื้อหาภาพประกอบอยู่บนสุด
ส่วนหัว ชื่อเว็ป,หน้าหลัก,เติมcash,item shop,สมัครไอดีเกม,download,speed test,ติดต่อเรา
ส่วนกลาง มีรูปภาพ,ข้อมูลitem show และข่าวสารเกี่ยวกับเกม
ส่วนล่าง Home,News,Game,Info,Game,Guide,Data room,Community,Support Job,Opportunities
ตำแหน่งข้อมูล Navigation Bar อยู่ด้านบนสุด
ลักษณะของเมนู แบบตัวอักษรภาาาไทย+อังกฤษ
การแบ่งหมวดหมู่ ชื่อเว็ป,หน้าหลัก,เติมcash,item shop,สมัครไอดีเกม,download,speed test,ติดต่อเรา

องค์ประกอบของการออกแบบ

1.สี และ วรจรสี
2.The color Wheel ( หาภาพประกอบ เข้าหาแม่สี) ( วงจรสี )
3.Hue คือ ตัวสี หรือ เนื้อสี
4.Saturation คือ แบบว่า ขาวจั้ว เหลืองอ๋อย ดำปี้ ความจัดจ้านของตัวสี
5.Value คือ ค่าน้ำหนักของสี





องค์ประกอบการออกแบบ ( Element of Design )
1.สีแม่สีศิลปะประกอบ ด้วยสี แดง สีเหลือง และสีน้ำเงิน ซึ่งเมื่อนำแม่สีทั้งสามมาผสมกันในอัตราส่วนต่างๆก็จะเกิดสีขึ้นมามากมาย ซึ่งประโยชน์ จากการที่เรานำสีมาผสมกันทำให้เรา สามารถเลือกสีต่างๆมาใช้ได้ตามความพอใจสร้างสรรค์ผลงานศิลปะที่งดงามตามความ พอใจขอผู้สร้าง สีที่เกิดจากการนำเอาแม่สีมา ผสมกัน เกิดสีใหม่เมื่อนำมาจัดเรียงอย่างเป็นระบบ รวมเรียกว่าวงจรสี

ภาพแสดงวงจรของสีที่เกิดจากการนำแม่สีมาผสมกัน
การเกิดสีดังภาพ เกิดจากการนำเอาแม่สีมาผสมกัน ในอัตราส่วนต่างๆกันซึ่งพอสรุปได้ดังนี้

สีขั้นที่ 1 (สีขั้นต้นหือแม่สี)(Primary Color) ประกอบด้วย สี แดง สีเหลือง และสีน้ำเงิน

สีขั้นที่ 2 (Binary Color) เกิดจากการนำเอาสีขั้นที่ 1 (แม่สี ) มาผสมในอัตราส่วนเท่าๆกันประกอบด้วยสี เขียว สีส้ม
และสีม่วง
•สีเขียว เกิดจากการนำเอา สีเหลือง กับ สีน้ำเงิน มาผสมกันในอัตราส่วนเท่าๆกัน
•สีส้ม เกิดจากการนำเอา สีเหลือง กับ สีแดง มาผสมกันในอัตราส่วนที่เท่าๆกัน
•สีม่วง เกิดจากการนำเอา สีน้ำเงิน กับ สีแดง มาผสมกันในอัตราส่วนที่เท่าๆกัน

•สีขั้นที่ 3 (Intermediate Color) เกิดจากการนำเอาสีขั้นที่ 2 ผสมกับสีขั้นต้นที่อยู่ใกล้เคียงกันได้สีแตกต่างออกไป
ได้แก่ สีเหลืองแกมเขียว สีน้ำเงินแกมม่วง สีแดงแกมม่วง สีแดงแกมส้ม สีเหลืองแกมส้ม และสีน้ำเงินแกมเขียว
• สีเหลืองแกมเขียว เกิดจาก การผสมกันระหว่างสีเหลืองกับสีเขียวอย่างละเท่าๆกัน
• สีน้ำเงินแกมม่วง เกิดจากการผสมกันระหว่างสีน้ำเงินกับสีม่วงอย่างละเท่าๆกัน
• สีแดงแกมม่วง เกิดจากการผสมกันระหว่างสีแดงกับสีม่วงอย่างละเท่าๆกัน
• สีแดงแกมส้ม เกิดจากการผสมกันระหว่างสีแดงกับสีส้มอย่างละเท่าๆกัน
• สีเหลืองแกมส้ม เกิดจากการผสมกันระหว่างสีเหลืองกับสีส้มอย่างละเท่าๆกัน
• สีน้ำเงินแกมเขียวเกิดจากการผสมกันระหว่างสีน้ำเงินกับสีเขียวอย่างละเท่าๆกัน





ระบบของสี Color
- C M Y K ระบบการพิมพ์ 4 สี คือ
1.น้ำเงิน CYAN ( C )
2.แดง MAGENTA ( M )
3.เหลือง YELLOW (Y)
4.ดำ BLACK (K)





- R G B คือระบบของแสง
สีแดง Red (r)
สีเขียว Green (g)
สีน้ำเงิน Blue (b)
หลักการเลือกสี ( Color combination )
1.) Monochromatic การใช่สีเดียว สร้างความแตกต่างด้วยระดับความ มืด สว่างของสี
2.) Triads คือการใช้สี 3 สีที่อยู่ตรงข้ามกัน เพื่อให้เกิดความแตกต่างของสีอย่างชัดเจน
3.) Analogous คือ การใช้สีที่อยู่ติดกัน ในวงจรสี สามารถสร้างความกลมกลืนได้ดี
4.) Complementary คือ การใช้สีตรงข้ามกัน สามารถช่วยเน้นความโดดเด่นได้ดี ควรใช้สีดำ เพื่อลดความรุนแรงของสี
5.) Split - Complements คือ การใช้สีแบบผสม เป็นการผสมผสานระหว่างสี โทรร้อนและเย็นโดยการเลือกสีใดสีหนึ่งและจับคู่กับอีก 2 สีในโทนสีที่ตรงข้ามกัน

การใช้ตัวอักษรแนวแนว

การใช้ตัวอักษร
Typo*+ ความหมาย "TYPOGRAPHY"
การใช้ตัวอักษรหรือการจัดวางตัวอักษร

"FONT (TYPEFACES) "
ชุดรูปแบบของตัวอักษร

"FONT FAMILIES"
ตระกูลของชุดแบบตัวอักษร เช่น ตัวธรรมดา ตัวหนา ตัวเอียง ฯลฯ

Typo* + ส่วนประกอบ

Typo* + ขนาด

Typo* ประเภท
+ Sans Serif (ไม่มีเชิง)
+ Serif (มีเชิง)
+ Script (ลายมือ)
+ Monospace (เป็นบล็อค , เป็นช่องๆ)
+ Novelty (แฟชั่น , ตกแต่ง , ประดับ)
+ Dingbat , Ornament (รูปสัญลักษณ์)

Typo* + การจัดตำแหน่ง

Typo* + การผสมอักษร

1. ตัวอักษรไม่มีขาตัวหนาผสมกับตัวอักษรมีขาตัวบาง ตัวอักษรทั้งสองแบบ มีความแตกต่างด้วยน้ำหนักและขนาด ทำให้เกิดความโดดเด่นได้ง่าย
2. ตัวอักษรมีขาตัวหนาผสมกับตัวอักษรไม่มีขาตัวบาง การผสมอักษรแบบนี้ทำให้เกิดจุดเด่นของสัญลักษณ์อักษรได้ง่าย
3. ตัว อักษรไม่มีขาผสมกับตัวอักษรมีขา การผสมอักษรแบบนี้ไม่มีจุดเด่น เนื่องจากตัวอักษรทั้งสองแบบไม่มีความแตกต่างกันด้วยน้ำหนัก // ไม่ควรใช้ !
4. ความแตกต่างอย่างชัดเจนของตัวอักษรแบบนี้ เหมาะสำหรับงานที่มีการพัฒนาแนวความคิด
5. เช่นเดียวกัน การผสมอักษรสามารถสร้างความแตกต่างได้อย่างหลากหลาย

Typo* + การปรับระยะห่าง