Learning Log Week 03

Learning Log Week 03 (16/11/09)

สิ่งที่ได้เรียนรู้

WBI : ADDIE & Gagne

ได้เรียนรู้ถึงการออกแบบบทเรียนผ่านเว็บว่าควรมีหลักการ ดังนี้

ADDIE MODEL
พื้นฐานในการออกแบบและพัฒนาสื่อให้มีประสิทธิภาพ มี 5 ขั้นตอน


ANALYZE : การวิเคราะห์

- GOAL วัตถุประสงค์ของบทเรียน
- AUDIENCE กลุ่มเป้าหมายคือใคร
- ENVIRONMENT สภาพแวดล้อม บริบทต่างๆ ในโรงเรียน

DESIGN : การออกแบบ

- SITE STRUCTURE กำหนดโครงสร้างเว็บไซท์ รายละเอียดต่างๆ
- STORYBOARD
- INTERFACE DESIGN การออกแบบหน้าเว็บเพจ

* RAPID PROTOTYPE การออกแบบภาพรวมคร่าวๆ ก่อนไปพัฒนาจริง
อยู่ในขั้น DESIGN+DEVELOP

DEVELOP : การพัฒนา

- TOOLS พัฒนา software ที่มี เช่น กราฟิก เสียง วิดีโอ เว็บ
- TEAM เช่น ทีมออกแบบเว็บ ทีมกราฟิก ทีมรวบรวมเนื้อหา ทีมจัดเรียงเนื้อหา ทีมตัดต่อวิดีโอ ทีมพัฒนาเว็บ โปรแกรมเมอร์

IMPLEMENT : การนำไปใช้

- PILOTS นำไปทดลองใช้กับกลุ่มเป้าหมาย หรือให้ผู้สอน/ผู้เชี่ยวชาญทดลองใช้ เพื่อนำ feedback มาปรับปรุง แก้ไขต่อไป
- ROLLOUT PLAN วางแผนในการนำไปใช้จริง

EVALUATE : การประเมินผล

- SMES = Subject Matter Experts ประเมินว่าเนื้อหาจัดอยู่ในกลุ่มสาระใด หรือให้ SMEs ด้านเว็บตรวจสอบ
- AUDIENCE ประเมินผลจากกลุ่มเป้าหมายว่าเข้าใจมั้ย


GAGNE’ INSTRUCTIONAL THEORY
การออกแบบบทเรียนอย่างเป็นระบบและเป็นขั้นตอน มี 9 ขั้นตอน

1. Gain attention :
เรียกความสนใจจากผู้เรียน เช่น ใช้ภาพ สี เสียง แอนนิเมชั่น วิดีโอ ในส่วน homepage

2. Inform learners Objectives :
ใช้ homepage หรือ announcement ในการบอกวัตถุประสงค์แก่ผู้เรียน และขั้นตอนกิจกรรมการเรียนรู้

3. Stimulate recall of prior learning :
กระตุ้นความรู้เดิม เพื่อให้เชื่อมโยงกับความรู้ใหม่ โดยใช้ Communication tools (แบบประสานเวลา-ไม่ประสานเวลา) เช่น discussion board, chat room ในการถามตอบ, video conference ใช้ Assessment tool เช่น survey, pre-test ก่อนเรียน

4. Present the content :
การนำเสนอเนื้อหา อาจอยู่ในรูปแบบ PPT slide, pdf file, e-book, flash movie, video clip, sound clip, CAI, website

5. Provide learning guidance :
การให้คำแนะนำระหว่างเรียน เช่น บอกถึงขั้นตอนการเข้าร่วมกิจกรรมการเรียนรู้อย่างละเอียดในหน้า homepage, announcement หรือ FAQs, Helps (แบบ real time / non-real time)

6. Elicit performance :
การตรวจสอบพฤติกรรมผู้เรียน เช่น แบบฝึกหัด (quiz ใน Assessment tool, discussion board, chat room ใน communication tools แทนการอภิปราย แลกเปลี่ยนความเห็นในชั้นเรียน ส่งงาน)

7. Provide feedback :
ให้ข้อเสนอแนะผู้เรียน โดยผ่านทาง Communication tools ต่างๆ เช่น discussion board, chat room, E-mail การให้ feedback ตอบกลับผู้เรียนผ่านทาง Assessment tools เช่น quiz, survey

8. Assess performance :
การประเมินผล เช่น ตรวจสอบการเข้าร่วมกิจกรรมต่างๆ ของผู้เรียน ระหว่างเรียน และการใช้ rubric ประเมินผลตามสภาพจริง

9. Enhance retention and transfer to the job :
มีการทบทวนและเสนอแนะการนำไปใช้ต่อไปทั้งเนื้อหาในบทต่อไปหรือวิชาอื่นๆ มีการเชื่อมโยงกับข้อมูล เพื่อให้ผู้เรียนเห็นตัวอย่างที่เป็นรูปธรรม เชื่อมโยงกับการตั้งโจทย์ที่ท้าทายผู้เรียน


หลักการออกแบบ WBI

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

ส่วนกิจกรรม : แบ่งได้เป็น 3 รูปแบบ
1. กิจกรรมแบบประสานเวลา เช่น chat room, voice/video conference
2. กิจกรรมแบบไม่ประสานเวลา เช่น e-mail, web board, blog, wiki
3. กิจกรรมแบบร่วมมือ (ผสมผสานระหว่าง 1+2 โดยพิจารณาจากความเหมาะสมของเนื้อหาและกิจกรรม)


WBI : Site Structure

แนวคิดการออกแบบ site structure ที่นิยม แบ่งเป็น 2 แบบ
- จัดตามกลุ่มเนื้อหา content structure
- จัดตามกลุ่มผู้ชม user-based structure

แนวคิดการออกแบบ site structure
1. Sequence แบบเรียงลำดับ การออกแบบเว็บไซต์ไปทีละหน้า เหมาะกับเว็บไซต์ที่มีจำนวนเว็บเพจไม่มากนัก
2. Hierarchy แบบลำดับชั้น เหมาะกับเว็บไซต์ที่มีจำนวนเว็บเพจมาก ทั่วไปนิยมใช้แบบนี้
3. Combination (ผสมระหว่าง Sequence+Hierarchy) เหมาะกับเว็บไซต์ที่ซับซ้อน นำข้อดีของแต่ละอันมาผสมผสานกัน


WBI : Page Design


ประกอบด้วย 4 องค์ประกอบใหญ่ๆ คือ

1. Page Header นิยมใส่ชื่อเว็บ หรือผู้ให้การสนับสนุน เพราะเป็นส่วนแรกที่ผู้เข้าชมมองเห็น
2. Navigation Bar ส่วนที่ใช้เชื่อมโยงไปยังส่วนต่างๆของเว็บไซต์
3. Page Body ส่วนที่ใช้สำหรับใส่เนื้อหาหลักของเว็บไซต์ อาจมีตัวนำทางย่อยๆ เพื่อเชื่อมโยงไปยังเนื้อหาที่เกี่ยวข้อง
4. Page Footer นิยมใส่ชื่อหน่วยงาน ผู้ทำเว็บไซต์ แบนเนอร์ผู้ให้การสนับสนุน แผนผังเว็บไซต์แบบ text link

หลักการออกแบบหน้าเว็บเพจ
- Simplicity ความเรียบง่าย : สีสัน ตัวอักษร ภาพเคลื่อนไหว ให้พอเหมาะ เรียบง่าย ไม่ซับซ้อน ชนิดและสีไม่มากจนเกินไป จะรบกวนสายตาได้
- Consistency ความสม่ำเสมอ : ใช้รูปแบบเดียวกันในเว็บไซต์ เพื่อป้องกันความสับสน
- Warm tone color สีโทนร้อน : ทำให้ดูมีชีวิตชีวา
- Cool tone color สีโทนเย็น : ความสุภาพ อ่อนโยน นิยมใช้กัน
- Neutral tone color สีโทนกลาง : สีขาว ดำ เทา น้ำตาล
- Color enhance corporate identity : สีช่วยเสริมเอกลักษณ์ขององค์กร

ระบบนำทาง (navigation)
เครื่องนำทาง
- เมนูหลัก ไปยังหัวข้อหลักเว็บไซต์ ปรากฏอยู่บนเว็บเพจทุกหน้า
- เมนูเฉพาะกลุ่ม
- เครื่องมือเสริม ช่องค้นหา, search box, site map

การออกแบบระบบนำทาง
- เข้าถึงง่าย
- สื่อความหมาย ชัดเจน เข้าใจง่าย
- สม่ำเสมอ
- ตอบสนองผู้ใช้
- มีจำนวนรายการพอเหมาะ
- มีทางเลือกหลากหลาย
- มีลิงค์กลับไปโฮมเพจได้

เทคนิค navigation
- Text & Button
- Drop Down List
- Dynamic Drop Down Menu
- On Mouse Over


สิ่งที่จะต้องค้นคว้าเพิ่มเติม/ต้องเตรียมมาครั้งหน้า

- ศึกษาการออกแบบ WebQuest เพิ่มเติม
- เตรียม PowerPoint มานำเสนอในสัปดาห์หน้า


ข้อคิดเห็นอื่นๆ

วันนี้เนื้อหาเยอะมากเลยค่ะอาจารย์ และอยากให้ WebQuest เป็นงานคู่ค่ะ หรือกลุ่มก็ยิ่งดีค่ะ ^^