วันพฤหัสบดีที่ 27 กันยายน พ.ศ. 2550
แนวคิดการออกแบบสื่อมัลติมีเดีย
สื่อที่สร้างสรรค์จะต้องดึงดูดความสนใจทั้งทางด้านเนื้อหาและรูปแบบซึ่งกราฟิกจะเป็น
องค์ประกอบที่สำคัญในการแสดงออกถึงสิ่งที่คุณตั้งใจ ในบางครั้งรูปเพียงรูปเดียวก็สามารถสามารถสื่อความหมายที่เราต้องการ
ได้โดยไม่จำเป็นต้องใช้คำบรรยายใดๆ ดังนั้นสิ่งสำคัญก็คือการเลือกรูปแบบกราฟิกที่เหมาะสมกับความหมายที่ต้องการสื่อสาร ในการออกแบบไม่ควรยึดติดกับรูปแบบเดิมๆ ของเว็บไซท์ทั่วไป สังเกตุและศึกษาเทคนิคการออกแบบโดยเฉพาะทางกราฟิกดีไซน์จากสื่อต่างๆ ไม่ว่าจะเป็นหนังสือ,แมกกาซีน,โปสเตอร์,ทีวีและที่สำคัญที่สุดคือจากเว็บไซท์อื่นๆ
การออกแบบมัลติมีเดียปฏิสัมพันธ์ อย่างมีประสิทธิภาพ มีแนวทางแนะนำ 5 แนวทางได้แก่
1. กำหนดเป้าหมาย (Goal) การกำหนดเป้าหมายจะช่วยให้สามารถสร้างสื่อฯ
ได้ตรงกับความต้องการมากที่สุด โดยสามารถจำแนกเป้าหมายได้ดังนี้
- เพื่อถ่ายทอดความรู้
- เพื่อสร้างทักษะ
- เพื่อสนับสนุนการทำงาน
2. ศึกษาพฤติกรรมของผู้เรียน โดยจะต้องศึกษาว่าผู้เรียนคิดอย่างไร
ยอมรับนวัตกรรมใหม่รูปแบบนี้หรือไม่ ผู้เรียนเรียนรู้จาก Concept
หรือศึกษากระบวนการก่อนนำไปพัฒนาความเข้าใจในเนื้อหา
3. พิจารณาถึงประสบการณ์ที่ดีที่สุดของผู้เรียน เพื่อให้ผู้เรียนรู้สึกมีส่วนร่วมกับสื่อฯ
4. ศึกษาความคงทนของเนื้อหา พิจารณาว่าเนื้อหามีความคงทนนำไปใช้งานได้นานแค่ไหน
มีการเปลี่ยนแปลงบ่อยครั้งหรือไม่ อย่างไร
5. ใช้เทคนิคของทีม นำผู้เชี่ยวชาญหลายๆ ท่านนำเสนอความรู้
ผสมผสานกับผู้เรียนออกความเห็นของสื่อ
การออกแบบสื่อมัลติมีเดีย
1. การเลือกใช้สี ในการออกแบบจะเลือกใช้สีวรรณะเย็น (cool tone)
ประกอบด้วย สีเหลือง สีเขียว สีน้ำเงิน สีม่วง สีเหล่านี้ดู เย็นตา ให้ความรู้สึก สงบ สดชื่น ซึ่งในที่นี้จะเลือกใช้สีเขียว และการใช้สีแต่ละครั้งควรใช้สีวรรณะเดียวในภาพทั้งหมด เพราะจะทำให้ภาพความเป็นอันหนึ่งอันเดียวกัน (เอกภาพ) กลมกลืน
มีแรงจูงใจให้คล้อยตามได้มาก แนวทางปฏิบัติในการใช้พื้นหลัง และสีตัวอักษรมีดังนี้
- ถ้าเลือกใช้พื้นหลังสีเข้ม ให้เลือกสีตัวหนังสือสีอ่อน
หรือถ้าเลือกพื้นหลังสีอ่อนให้เลือกสีตัวหนังสือสีเข้ม
- ให้ระมัดระวังเมื่อใช้พื้นหลังที่มีลาย ข้อความหรือกราฟิกบนพื้นลวดลายมักจะทำให้อ่านได้ลำบาก
ถ้าต้องใช้พื้นหลังที่มีลาย ให้ใช้สีพื้นเรียบเป็นพื้นรองรับส่วนที่เป็นข้อความและกราฟิกนั้นอีกครั้ง
2. รูปภาพ (Graphic or Photo) การใช้รูปภาพมีอยู่ 2 จุดประสงค์ คือ เพื่อเพิ่มความสวยงามและดึงดูดความสนใจในการเข้าชมเพื่อแสดงข้อมูล และรายละเอียดเรื่องของสื่อต่างๆ ทั้งนี้รูปภาพดังกล่าวจะมีทั้งรูปที่เป็นภาพจริง (Photo) และภาพที่วาดขึ้นโดยใช้เทคนิคต่าง ๆ (Graphic) โดยรูปภาพดังกล่าวจะสามารถใช้เป็นจุดเชื่อมโยงได้อีกด้วย
โดยที่สามารถทำการสร้างจุดเชื่อมโยงได้หลายจุดในภาพ 1 ภาพ
(เรียกว่า Image map) หรือการแม็ปภาพ
3. ภาพยนตร์และเสียงประกอบ (Movie and Sound) การเพิ่มภาพยนตร์และเสียงประกอบจะทำให้สื่ออิเล็กทรอนิกส์
มีความน่าสนใจและดึงดูดใจผู้เข้าชมมากขึ้น นอกจากเพิ่มความสวยงาม
และความสมจริงของข้อมูลแล้ว ยังเป็นการง่ายต่อผู้ใช้ที่จะรับรู้ข้อมูลข่าวสารต่าง ๆ ด้วยหรืออาจจะทำการแสดงเฉพาะเสียงประกอบเพียงอย่างเดียวก็ได้ เช่น เสียงเพลงประกอบตลอดเวลาที่ผู้ใช้เปิดเข้าชม
4. กรอบ (Frame) เพื่อความสวยงามและความสะดวกในการใช้งาน สามารถทำการแบ่งจอภาพออกเป็นหลายๆส่วน ในกรณีที่มี Link หลายๆชุดต่อกันออกไปทำให้การที่จะกลับมาที่จุเริ่มต้นสามารถทำได้โดยง่าย หรือการที่ต้องการข้อมูลบางอย่างแสดงผลภาพบางอย่างอยู่ตลอดเวลา
การทำเฟรม (Frame) การจัดทำเฟรมเป็นการคำนึงถึงผู้ใช้ จึงออกแบบ
ให้เกิดการใช้งานได้สะดวกยิ่งขึ้นคือ
- สร้างการคลิกเลื่อนจอภาพ (Scrolling) เพื่ออ่านข้อมูลยาวๆ ในหน้าจอได้
- จัดแบ่งพื้นที่บนจอให้เกิดระเบียบสวยงามน่าใช้และเป็นสัดส่วนอิสระจากกัน
5. การใช้ข้อความ
5.1 ไม่ควรบรรจุข้อความเต็มหน้าจอ เพราะทำให้ยากต่อการอ่าน
ทำให้รู้สึกน่าเบื่ออาจลดการเรียนรู้ลงได้ ควรใช้การเขียนเป็นแบบโครงร่างรายการแทน อาจใช้วิธีวางรูปประกอบไว้ด้านข้างของข้อความ หรือแบ่งเนื้อหาออกเป็นส่วนย่อย สิ่งสำคัญของการออกแบบหน้าจอให้มีประสิทธิผล คือ การทำให้หน้าจอนั้นดูธรรมดา และใช้ลักษณะตัวอักษร หัวข้อหลักและหัวข้อย่อยในแต่ละหน้าอย่างคงเส้นคงวาแสดงการจัดข้อความให้อ่านง่าย
5.2 การใช้ข้อความ เกี่ยวข้องกับการจัดรูปแบบการพิมพ์ที่เหมาะสม กล่าวคือ
เลือกลักษณะของตัวอักษร และจัดแถววางแนวของอักษรในแต่ละหน้า
โดยมีข้อควรพิจารณาดังนี้ คือ ขนาดของตัวอักษรมีความคงเส้นคงวา
ไม่ควรใช้ตัวอักษรเกินกว่า 2 รูปแบบในภาวะปกติ ไม่เจตนาเน้นคำจนเกินควร จัดข้อความให้อยู่ในรูปแบบที่อ่านง่าย และกำหนดช่องว่าง หรือช่องไฟให้เหมาะสม
5.3 ใช้ข้อความเป็นส่วนเชื่อมโยงเพื่อกำหนดทิศทาง การใช้ในลักษณะนี้ เป็นการใช้ที่คุ้นเคยกัน ข้อความที่เป็นไฮเปอร์ลิงค์ อาจจะมีเส้นขีดใต้ข้อความควบคู่กับการใช้ภาพกราฟิกเป็นส่วนกำหนดทิศทาง
ข้อดีของการใช้ข้อความเป็นส่วนเชื่อมโยงคือ ความสามารถในการเข้าถึงข้อมูลเร็ว
6. โครงสร้างหน้าจอ ใช้แบบพอดีกับหน้าจอหรืออยู่ตรงกลางหน้าจอ แบบนี้เหมาะกับการนำเสนอข้อมูลที่มีไม่มาก ข้อดีคือการนำเสนอที่ไม่ซับซ้อนและสะดวกต่อการใช้งานเพราะผู้ใช้
จะมองเห็นข้อมูลทุกส่วนของหน้าได้พร้อมกันตลอดเวลา
ความหมายของมัลติมีเดีย
มัลติมีเดีย (multimedia) หรือ สื่อประสม หรือ สื่อหลายแบบ เป็นการใช้สื่อในหลายรูปแบบไม่ว่าจะเป็น ข้อความ เสียง รูปภาพ หรือ ภาพเคลื่อนไหว สำหรับให้ข้อมูลความรู้หรือให้ความสำราญต่อผู้ชม
ปัจจุบันความก้าวหน้า ของเทคโนโลยีคอมพิวเตอร์เอื้อให้นักออกแบบสื่อ มัลติมีเดีย สามารถประยุกต์สื่อต่างๆ ให้มารวมกันบนระบบคอมพิวเตอร์ ผู้ใช้ สามารถโต้ตอบกับระบบคอมพิวเตอร์ในรูปแบบต่างๆ กันได้ เทคโนโลยีเหล่านี้ ได้พัฒนาขึ้นพร้อมกับการพัฒนาฮาร์ดแวร์ เช่น การพัฒนาอุปกรณ์ที่ใช้อ่านและ บันทึกข้อมูล การพัฒนาหน่วยความจำให้มีขนาดที่เล็กลงแต่มีความจุมากขึ้น นอกจากนี้ ยังมีการพัฒนาเทคโนโลยีด้านอุปกรณ์ต่อพ่วงสำคัญต่างๆ เพื่อ ให้ติดต่อสื่อสารกับผู้ใช้งาน
...........................................................................................................................................................................
วันอังคารที่ 25 กันยายน พ.ศ. 2550
เทคนิคการสร้างรูปหัวใจแบบง่าย
ขั้นตอนที่1.
ให้ทำการสร้างไฟล์ใหม่ขนาดใดก็ได้ตามที่เราต้องการ โดยมาที่คำสั่ง File --> New
ขั้นตอนที่2.
จากนั้นให้ทำการสร้าง Layer ใหม่ขึ้นมาโดยคลิ๊กไอค่อนรูปกระดาษตรง Layer แล้วทำการเลือก Foreground & Background color ปรับระดับ สีแบบโทนๆ เดียวต่างน้ำหนัก
ขั้นตอนที่3.
ให้ทำการใช้อุปกรณ์ Custom Shape tool ลักษณะรูปหัวใจ แล้วทำการ แดรกเม้าส์โดยทำการกด Shift แล้วกางออก ก็จะได้ Shape รูปหัวใจดังภาพ Layer ก็จะมี Paths เกิดขึ้นดังภาพ.
ขั้นตอนที่4.
ให้ทำการ Load Selection Layer Shape รูปหัวใจโดยกดปุ่ม Ctrl แล้วคลิ๊กเม้าส์ ก็จะเกิดเส้น Selections ขึ้นมา จากนั้นให้ทำการปิดตา Layer Shape เสียแล้วทำการสร้าง Layer ใหม่แล้วทำการไล่เฉดสีสองสี โดยใช้อุปกรณ์ Gradient tool แบบ Foreground to Background color ในลักษณะเฉียง ก็จะได้ รูปหัวใจที่มีมิติเฉดสีสองสีดังภาพ.
ขั้นตอนที่5.
หลังจากนั้นให้ทำการหด Selection โดยมาที่คำสั่ง Select --> Modify --> Contract = 1 Pixels แล้วให้ทำการ สร้าง Layer ใหม่ให้อยู่บนสุด แล้วทำการเปลี่ยน Foreground ให้เป็นสีขาว จากนั้นให้ไล่เฉดแบบ Foreground to Transparent ในลักษณะ ลงล่างครึ่งหนึ่ง จากนั้นให้ทำการยกเลิก Selection โดยมาที่ Select -->Desselect ก็จะได้ดั่งภาพตัวอย่าง.
ขั้นตอนที่6.
หลังจากนั้นให้ทำการ Perspective Layer ไล่เฉดสีขาวแบบโปร่ง (Layer2) โดยมาที่คำสั่ง Edit ---> transform --> Perspective แล้วทำการหดเข้าดังภาพ จากนั้นให้ทำการลดค่า Opacity Layer = 50% ก็จะได้หัวใจใสๆ ดังภาพสำเร็จ.
เป็นไงขอรับ ขั้นตอนง่ายๆ หลักการที่แท้จริงคือ ถ้าเกิด Selection ขึ้นมาได้เราก็จะทำให้เกิด Effects มิติอยู่ที่สีสองสี เข้มจางผสมกัน แล้วแสงก็คือสีขาวมาทำเกิดค่าความต่างของแสงในสี ทำให้ดูใสๆ