ยินดีต้อนรับ

Welcome to the land of knowledge about multimedia. By Mr.Suwit ChaiPhet Faculty of Information Technology @ Siam University

วันพุธที่ 6 ตุลาคม พ.ศ. 2553

Website ที่ออกแบบ

1.>>>WebPage ที่ออกแบบเอง



ชุดสีหลักที่ใช้ในการออกแบบ



2.>>>WebPage ตัวอย่าง

วันเสาร์ที่ 2 ตุลาคม พ.ศ. 2553

การใช้สื่อประสมสำหรับออกแบบเว็บไซต์

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

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



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

หลักการใช้สี

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


การใช้สีในงานออกแบบกราฟิก มีวัตถุประสงค์ที่จะทำให้งานนั้นน่าดู สวยงาม และตื่นตา หรือส่งเสริมให้เนื้อหาสาระที่นำเสนอมีความสมบูรณ์ยิ่งขึ้น คนแต่ละวัยมีความสนใจกลุ่มสีแตกต่างกัน เด็กเล็กๆจะสนใจสีสด เข้ม สะดุดตา ไม่ชอบสีอ่อน และจะสังเกตได้ว่าเมื่อมีอายุมากขึ้นก็ยิ่งไม่ชอบสีสดใสมากๆ กลับนิยมสีอ่อนหวาน นุ่มนวล การวางโครงสีในงานออกแบบกราฟิกในเชิงพาณิชย์ จึงต้องเน้นเรื่องวัยของกลุ่มเป้าหมายเป็นสำคัญ
เด็กเล็กๆ ควรใช้สีประเภทปฐมภูมิ หรือสีทุติยภูมิ ส่วนผู้ใหญ่อาจต้องใช้สีแท้ ผสมกลุ่มสีขาวหรือสีนวลหรือสีดำ การใช้สีขาวหรือสีดำมาผสมกับสีแท้ ก็จะช่วยลดความสดใสของสีเดิมลงตามขนาดสัดส่วนมากน้อยตามต้องการ ดังนั้น ก่อนจะวางโครงสีในการทำงาน จึงควรพิจารณาเกี่ยวกับการใช้สีในทางจิตวิทยาด้วย
1.ใช้สีสดสำหรับกระตุ้นให้เห็นเด่นชัด เพื่อการมองในระยะเวลาสั้นๆ เหมาะอย่างยิ่งสำหรับการทำสื่อเพื่อโฆษณาประชาสัมพันธ์
2.พึงระลึกไว้เสมอว่าการใช้สีมีวัตถุประสงค์เพื่อต้องการเน้นให้เห็นเด่นชัด มุ่งส่งเสริมเนื้อหาสาระมีความชัดเจนขึ้น ถูกต้องขึ้น บางครั้งการใช้สีของนักออกแบบ จะสามารถใช้สีได้อย่างอิสระเพื่อความสวยงาม บางครั้งก็ต้องจำเป็นนึกถึงหลักความจริง และความถูกต้องอย่างเหมาะสมด้วย
3.การออกแบบพาณิชย์ศิลป์ งานกราฟิกต่างๆ อาจจะไม่จำเป็นต้องใช้สีเสมอไป ผู้ออกแบบจึงควรพิจารณาถึงความเหมาะสมด้วยว่าควรใช้อย่างไร เพียงใด การกำหนดว่าจะใช้สีเพิ่มขึ้นมา 1 สีนั้น หมายความว่าจะต้องเพิ่มงบประมาณตามมาอีกจำนวนหนึ่งเสมอ
4.ควรใช้สีให้เหมาะสมกับวัยผู้บริโภค
5.การใช้สีมากเกินไปไม่เกิดผลดีกับงานออกแบบอย่างแท้จริง เพราะสีในหลายๆสีอาจทำให้ลดความเด่นชัดของงานและเนื้อหาที่ต้องการนำเสนอ
6.เมื่อใช้สีสด เข้มจัด คู่กับสีอ่อนมากๆ จะทำให้ดูเด่นชัดและมีชีวิตชีวาน่าสนใจ
7.การใช้สีพื้นในงานออกแบบสิ่งพิมพ์ที่มีพื้นที่ว่างมากๆ ไม่ทำให้เกิดผลในการเร้าใจเท่าที่ควรจึงควรหลีกเลี่ยง
8.ข้อพิจารณาสำหรับการใช้สีบนตัวอักษร ข้อความ คือ จะต้องให้ชัดเจน อ่านง่าย ควรงดเว้นการใช้สีตรงข้ามในปริมาณที่เท่าๆกัน บนพื้นที่เดียวกันหรือใกล้เคียง เพราะจะทำให้ผู้ดูต้องแพ่งมองอย่างมาก ทำให้เกิดภาพซ้อนพร่ามัว โดยเฉพาะอย่างยิ่งส่วนที่เป็นเนื้อหาสาระ เช่น ตัวอักษรสีแดงบนพื้นสีเขียว ความเด่นชัดของข้อความที่ต้องการเน้นด้วยความแตกต่างกันของสี ก็จะลดความเด่นชัดลงอีกด้วย

วันศุกร์ที่ 1 ตุลาคม พ.ศ. 2553

วิเคราะห์หน้า WebPage

1.ลักษณะโครงสร้างหน้าเว็บ >>> เป็น WebPage แบบแนวตั้ง

2.ขนาดของหน้าจอเว็บ >>> ขนาด 1024x768 Pixels

3.การจัดวางตำแหน่งมี 3 ส่วนคือ >>> Logo / เนื้อหา / ภาพ
3.1 ส่วนบน (ส่วนหัว) > มีโลโก้ คือ tEENEE >> ชื่อเว็บ
www.teenee.com >>> มีเมนูต่าง ๆ เช่น
บอร์ดข่าว,เรื่องความรัก,คอมพิวเตอร์,ดารา ฯลฯ
3.2 ส่วนกลาง (ส่วนเนื้อหา) > มีข่าวที่กำลังเป็นประเด็นฮอตตอนนี้เรื่องฟิล์มกับแอนนี่,พาดหัวข่าวว่า"เปิด
ใจแอนนี่" และจะมีโฆษณาอยู่แถบข้าง ๆ ขวาของเว็บ
3.3 ส่วนล่าง (ส่วนท้าย)>>>มีหัวข้อข่าวอื่น ๆ , ลิงค์ต่าง ๆ , และดูดวงรวมถึงการบอกขนาดของเว็บด้วย


4. เมนู>>> ใช้เมนูแบบที่เป็นตัวหนังสือบอกแล้วก็กดคลิกพร้อมกับลิงค์ไปหน้านั้นเลยโดยจะอยู่แถบบนหัวเว็บ

5. การแบ่งหมวดหมู่ >>> แบ่งหมวดหมู่เป็น ดารา, การเมือง,กีฬา,และสุขภาพ โดยจะแบ่งหมวดหมู่ด้วยการจัดโซนด้านเนื้อหาเป็นล็อก ๆ เช่น โซนแรกเป็นเรื่องข่าวร้อน >>โซนที่สองเป็นดารา >>> โซนที่สามเป็นข่าวการเมือง>>>> โซนที่สี่เป็นกีฬา >>>>> โซนที่ห้าเป็นเรื่องสุขภาพและติดต่อ

รูปแบบและโครงสร้างของหน้าเว็บไซต์


WebPage แบบเต็มหน้าจอขนาด 1024x768 Pixels

รูปแบบและโครงสร้างของหน้าเว็บไซต์

WebPage แบบแนวนอนขนาด 1024x768 Pixels