วันอาทิตย์ที่ 13 ธันวาคม พ.ศ. 2552

Learning Log Week6 (14 Dec09)

สิ่งที่ได้เรียนรู้: วันนี้เพื่อนๆแต่ละคู่ Present Web Quest ของแต่ละคนทำให้ได้มองเห็นความก้าวหน้า ความคิดสร้างสรรค์ของเพื่อนๆ รวมถึงข้อบกพร่องของแต่ละกลุ่มที่จกต้องนำไปปรับปรุง



จากคอมเม้นท์ที่ได้รับก็คือ ต้องแก้ไขเรื่อง

1.ขนาดของตาราง ให้แก้ทุกตารางในหน้า Template เป้น 100 เปอร์เซ็นต์

2.Rubric แก้เรื่องเกณฑ์การให้คะแนน

3.หน้า Resource หา icon มาใส่

4.ให้ Credit

5.ตั้งชื่อ Title ข้างบน



สิ่งที่ต้องเตรียมมา: ทำ WebQuest ให้เสร็จ



ข้อเสนอแนะ: ดีคะ ได้ฟังคอมเม้นท์ ทำให้ได้เห็นข้อบกพร่องที่ตัวเราเองมองไม่เห็น

วันอาทิตย์ที่ 29 พฤศจิกายน พ.ศ. 2552

Learning Log Week5 (30NOV09)

สิ่งที่ได้เรียนรู้: วันนี้ได้เรียนรู้การใช้โปรแกรม Macromedia Dreamweaver ค่ะ


  • การตั้งค่า Site:
1.เปิดโปรแกรม Macromedia Dreamweaver 8

2.เลือก เมนู site> Manage Sites> New> Sites

3.ระบุชื่อ Site ที่ต้องการ > Next> เลือก No> Next

4. ระบุที่จะเก็บไฟล์ต่างๆของ Site > Next

5. ตั้งค่า Remote Server ให้เลือก None> Next

6.Done

7.จะกลับมายังหน้า Manage Site> เลือก Site ที่เราสร้างไว้> Done

**โดยSite ที่เราสร้างไว้ จะถูกเก็บไว้ในโฟลเดอร์ที่เราเลือกไว้ในตอนแรก **


  • การตั้งค่าภาษา:

1. คลิก Page Properties

2. เลือก Title/ Encoding > Ecoding> Unicode (UTF8)



  • การตั้งค่าเว็บเพจเบื้องต้น:

1. คลิกปุ่ม Page Properties:

- Apperance: จะเป็นการกำหนดค่าแสดงผลทั่วไปของเว็บเพจ เช่น กำหนดชุด Fonts มาตรฐานที่จะใช้ ขนาดและสีตัวอักษร, ภาพพื้นหลัง เป็นต้น

-Link : เป็นการกำหนดลักษณะของตัวเชื่อมโยงภายในเว็บเพจ เช่นตัวอักษร และสี เป็นต้น

- Heading: เป็นการรูปแบบหัวข้อที่จะใช้ในเว็บเพจ

- Title/Encoding : เป็นการตั้งชื่อให้หัวของเว็บเพจที่อยู่บนเว็บเบราเซอร์

- Tracing Image: เป็นการนำเอาภาพมาวางบนหน้าเว็บไซต์ โดยที่ภาพดังกล่าวจะเหมือนแผ่นใส คือจะไม่ปรากฎอยู่จริงในเว็บเบราเซอร์

** เมื่อปรับค่าตามต้องการแล้ว คลิก OK **

** อย่างไรก็ตามสามารถเปลี่ยนหัวข้อของเว็บเพจได้ที่ Tab Title



  • การสร้างตาราง:
1.เลือก Menu Insert > Table หรือ จะคลิก icon Table บน แถบเครื่องมือ Common ก็ได้
2.สร้างตาราง ( 2แถว 2 คอลัมน์) ปรับค่าความกว้างของตารางตามขนาดของเว็บเพจ, กำหนดเส้นขอบของตาราง (กำหนดเป็น0) เพื่อที่จะได้ไม่แสดงผล > OK
3. คลิกตารางด้านล่างซ้าย> แทรกตารางขนาด 1 คอลัมน์ 6 แถว ซ้อนขึ้นมา เพื่อจัดรูปแบบเมนู
4. ย่อความกว้างตารางให้เล็กลง ทั้งตารางย่อยและตารางหลัก

5. คลิก แถบ Table อันที่2 ปรับ Align เพื่อให้ตารางมาอยู่ตรงกลาง(Center)

  • การใช้ตารางเพื่อสร้างองค์ประกอบเว็บเพจ:
1.ใช้ตารางที่สร้างไว้จากบทเรียนที่แล่ว
2. เลือกเมนู insert > Image หรือจะคลิกที่ icon บทแถบเครื่องมือ common ได้เหมือนกัน หรืออีกทางเลือกนึงคือดึงจาก File จากหน้าต่างด้านข้างขวาได้เลย โดยจะมีหน้าต่างขึ้นให้ระบุข้อความกำกับภาพ > OK
3. หากภาพมีขนาดใหญ่ตารางให้ Merge cell มารวมกันได้ โดย กด Shift เพื่อเลือกตารางทั้งสอง คลิกขวา เลือก Table> Merge Cell ถ้าตารางยังมีขนาดไม่พอดีกับที่ตั้งไว้ สามารถคลิก ตัวเลขที่ด้านล่าง เลือก Make All Widths Consistent เพื่อทำให้ตารางมีขนาดเท่ากับภาพได้
4.นำไฟล์รูปภาพเมนูที่สร้างไว้ มาใส่ด้านซ้ายของตาราง หากจำนวนตารางไม่พอ ให้คลิก แถบ Table ของตารางที่สอง แล้วแก้จำนวนแถวที่หน้าต่าง Properties ด้านล่าง โดยแถวของตารางก็จะเพิ่มขึ้นมา ที่นี่ก็สามารถนำภาพมาใส่ห้ครบได้เลยค่ะ
** ในแต่ละช่องของตาราง เราสามารถจะปรับสีได้ตามความพอใจ**
5. ลองเลือกช่องตารางด้านขวาที่ว่าง คลิกปุ่ม Background color (ด้านล่าง) เลือกสีที่ต้องการ นอกจากนี้ยังสามรถใส่รูปภาพให้เป็นพื้นหลังได้เช่นกัน


  • การสร้าง Template: จะช่วยให้เราสามารถนำ Template ไปใช้ได้กับทุกเว็บเพจในเว็บไซต์โดยที่ไม่ต้องคัดลอกลงไปใหม่ และยังป้องกันการแก้ไขไปยังในส่วนที่ไม่ต้องการอีกด้วย

1. เมนู File > Save as Template > ตั้งชื่อ Template > Save > Yes

2. เลือกข่องตารางทางขวา ปรับตำแหน่งข้อความให้ไปอยู่ด้านบน โดยเลือก Top ที่ช่อง Vertical

3. สร้างตารางขนาด 1*1 ลงไป

4. เมนู Inset > Template Object> Editable Region > ตั้งชื่อ พื้นที่ > OK

5. บันทึกเว็บเพจให้เรียบร้อย > File > Save

6. สร้างเว็บเพจใหม่ขึ้นมา เพื่อทดสอบ Templateโดย คลิก File > New

7.เลือก Modify> Template>Apply Template to pages> เลือก Template ที่ต้องการ คลิก Select

  • เทคนิคการสร้าง Rollover button:

1. Downlaod และแตก File ที่เตรียมไว้ให้ ใน Folder Image

2. เปิดไฟล์ Index.html ที่เคยสร้างไว้

3. เลือกพื้นที่สำหรับใส่วัตถุ > ปรับตำแหน่งการจัดวางเป็นจัดกึ่งกลาง

4. คลิกที่ลูกศรข้างๆ icon รูปภาพ > Rollover Image > ระบุภาพที่จะแสดงเริ่มต้น....> OK

5. บันทึก File ก่อน Preview


สิ่งที่ต้องเตรียมมา: ทำโปรเจคงานคู่ให้เสร็จ ^^


ข้อเสนอแนะ: สนุกดีค่ะ ได้เรียนรู้และลองทำในสิ่งที่ไม่เคยทำ อย่างโปรแกรม Dreamweaver แต่บางทีก็ยังงง งง เพราะบางทีคนสาธิตเองก็ยังงงงง ทำให้หนูยิ่ง งง งง ค่ะ >_______<

วันจันทร์ที่ 23 พฤศจิกายน พ.ศ. 2552

Learning Log Week4 (23Nov09)

สิ่งที่ได้เรียนรู้: - วันนี้ได้เห็นการออกแบบ Web Quest ของเพื่อนค่ะ ทำให้เห็นความคิดสร้างสรรค์ของเพื่อนหลายๆคน ทั้งข้อดี ข้อเสีย ทำให้เราสามารถนำประโยชน์เหล่านี้ไปประยุกต์ใช้กับชิ้นงานของเราได้ เช่น การใช้สี การออกแบบภาระงานของเราค่ะ

- การสร้าง Animation อย่างง่าย
- เปิดโปรแกรม > เลือก File > Import> Folder as frames
- ที่หน้าต่าง Browse for folder>เลือกFolder ที่เก็บภาพไว้ > OK
- ภาพทั้งหมดจะปรากฎขึ้นมา
- โดยสามารถเลือกปรับความเร็วของการเคลื่อนไหลได้ตามที่เราต้องการ
- * ถ้าต้องการปรับภาพหลายภาพพร้อมกันให้ กด shift สำหรับเลือกภาพอย่างต่อเนื่อง และ ctrl สำหรับภาพที่ไม่ต่อเนื่อง
- บันทึกภาพ เลือก Menu File> Save Optimize as..
- เลือก save ประเภท Image Only .gif > Save



- การใช้ slice ในการสร้างงานเว็บ
- เปิดโปรแกรม > เปิด File รูปที่เตรียมไว้
- เมนู View > Rulers จะปรากฎไม้บรรทัดขึ้นมา
- ดึงเส้น ไกด์อกมาจากไม้บรรทัด โดยใช้เครื่องมือ Move tool
- เลือกเครื่องมือ slice tool เพื่อทำการ slice
- slice ภาพเป็นส่วนๆตามความต้องการ
- File > Save as บันทึกเป็น นามสกุล PSD เพื่อที่จะกลับมาแก้ไขงานได้
* ถ้าหากจะซ่อนเส้นไกด์ ให้คลิกที่ View > Show > Guides โดยถ้าต้องการให้เส้นไกด์กลับมาใหม่ก็ใช้คำสั่งเดิม

- วิธีการกำหนดการเชื่อมโยงให้กับ Slice
- คลิกขวาที่สไลด์ที่ต้องการการเชื่อมโยง
- เลือกคำสั่ง Edit Slice Option
- ระบุที่อยู่เว็บที่ต้องการเชื่อมโยงที่ช่อง URL
- ระบุรูปแบบการเชื่อมโยงที่ช่อง Target
- ระบุข้อความที่แสดงเมื่อเม้าส์อยู่เหนือ ที่ช่อง Message Text
- ระบุข้อความกำกับภาพในช่อง Alt Tag
- เมื่อเสร็จสิ้น คลิกปุ่ม OK

- การบันทึก Slice เป็นเว็บเพจ
- เลือก เมนู File > Save for web
- เลือก Save> เลือกรูปแบบการบันทึกเป็น HTML and Images
- จะได้เป็น File . Html
- ตรวจสอบผลลัพธ์ที่เกิดขึ้น คลิก Minimize button
- ลองเปิดโฟลเดอร์ขึ้นมาดู จะพบว่าชิ้นงานของเราจะถูกตัดออกเป็นส่วนๆ แต่เมื่อดูผลลัพธ์ในเว็บ Browser จะพบว่าภาพจะเป็นภาพเดียวกันก่อนืที่จะถูกตัดแบ่ง แต่บริเวณที่กำหนดการเชื่อมโยงไว้จะสมารถคลิกเพื่อไปยังหน้าเพจที่เราต้องการได้


- Tips การ Save คลิปจาก Youtube โดยไม่ต้องลง โปรแกรมใดๆเพิ่มเติม
- เปิดคลิปที่เราต้องการ
- ตรง url เปลี่ยนจาก www เป็น Kick > Enter
- เลือกนามสกุลไฟล์ที่ต้องการ > คลิก GO
- คำว่า GO จะเปลี่ยนเป็น Down ให้คลิกขวา คำว่า Down
- เลือก Save Target as



สิ่งที่ต้องเตรียมมา: เตรียมทำ แผน Project Study Web Quest แบบงานคู่ ส่งภายในวันอาทิตย์ 6 โมงเย็น


ข้อเสนอแนะ: การเรียนการแบบวันนี้ก็ ค่อนข้างดีคะ ใช้เวลาได้เต็มเปี่ยมเลยค่ะ ^^ ทั้งได้ฟังเพื่อนพรีเซนต์ แล้วยังได้ลงมือปฏิบัติจริงในห้อง Lab

วันอาทิตย์ที่ 15 พฤศจิกายน พ.ศ. 2552

Learning Log Week3 (16Nov09)

สิ่งที่ได้เรียนรู้: วันนี้ได้เรียนรู้เรื่อง ADDIE & Gagne

A: Analysis : 1) Goal วิเคราห์วัตถุประสงค์ , วิเคราะห์เนื้อหา

2) Audience กลุ่มเป้าหมายคือใคร

3) Environment สภาพแวดล้อง บริบทต่างๆ



D: Design : 1) Site Structure โครงสร้างเว็บไซต์

2) Storyboard ออกแบบแต่ละหน้าเพจให้สอดคล้องกับวัตถุประสงค์

3) Interfate Design "Rapid Prototype ภาพออกแบบคร่าวๆ"



D: Development : 1) Tool ซอฟแวร์ต่างๆ เช่น Photoshop, Dreamwaever

2) Team ทีมในการออกแบบเว็บ ทีม กราฟฟิค ทีมรวบรวมจัดเรียง เนื้อหา ทีมตัดต่อวิดีโอ ทีมพัฒนาเว็บ "Rapid Prototype"



I: Implement: 1) Pilot การนำไปทดลองใช้ > ปรับแก้ตามข้อบกพร่อง หรือข้อเสนอแนะ

2) Rollout Plan



* อาจจะมีการทดลองใช้กับผู้สอนด้วย และต้องตรวจสอบอุปกรณ์ต่างๆในโรงเรียนด้วยว่ามีความพร้อมหรือไม่*



E: Evaluation: 1) SMEs

2) Audience

การวัดประเมินผลต้องทำอย่างเป็นระบบและมีคุณภาพ เพื่อเป็นการเปิดโอกาสรับฟังความเห็นกับผู้ใช้งานจริง 1) ประเมินผลระหว่างการพัฒนา

2) ประเมินผลเมื่อพัฒนาบทเรียนจบแล้ว



Gagne:
1. Gain Attention : การเรียกความสนใจจากผู้เรียน เช่น การนำคลิปวิดีโอมาให้ผู้เรียนชม

2. Inforn Learner Objective :แจ้งผู้เรียนให้ทราบถึงวัตถุประสงค์ของบทเรียนนั้นๆ ของ bloom จะชัดเจนที่สุด คือมี 3 ด้าน พุทธพิสัย, จิตพิสัย,ทักษะพิสัย

3.Stimulate Recall of Prior Learning: การกระตุ้นความรู้เดิมเพื่อให้เกิดการเชื่อมโยงกับความรู้ใหม่ เช่น Pre-test หรือจะใช้ถามตอบ แบบ Real time โดยใช้ chat room หรือแบบไม่ประสานเวลา โดยการโพสท์คำถามไว้ให้ผู้เรียนมาตอบ

4.Present the content: การนำเสนอเนื้อหา อาจจะเป็นสรุป หรือจะเป็นเนื้อหาแบบมีปฏิสัมพันธ์ โดยเนื้อหาอาจจะอยู่ในรูปแบบของพาวเวอร์พ้อยท์, PDF , Flash movie, E-book, CAI เป็นต้น

5.Provide Learning Guidence: การให้คำแนะนำระหว่างการเรียน การให้แนะนำบนบท อาจจะมีหน้า FAQ คำถามที่พบเจอบ่อยๆ หรืออาจจะมีปุ่ม Help แบบ realtime หรือ ไม่ Realtime

6.Elicit Perfomance: การตรวจสอบว่าผู้เรียนเกิดการเรียนรู้หรือไม่ โดยอาจจะมี แบบฝึกหัดต่างๆ โดยอาจจะมี Discussion Board หรือมอบหมายงานต่างๆเป็นกลุ่มได้ โดยส่งผ่าน Communication Tool ต่างๆได้

7.Provide Feedback: การให้ข้อเสนอแนะกับผู้เรียน อาจจะผ่านทาง Announcement, Chat room, E-mail ต่างๆ

8.Assess Performance: การประเมินผลว่าผู้เรียนได้เรียนรู้ตามจุดประสงค์ที่เราระบุไว้มั้ย > ควรมีความหลากหลาย อาจจะใช้โดยการเช็คว่าผู้เรียนได้เข้าร่วมกิจกรรมต่างๆในเว็บที่เรากำหนดไว้บ่อยแค่ไหน และดูขั้นกระบวนการและขั้นชิ้นงาน การใช้ Rubric เพื่อประเมินผลตามสภาพความเป็นจริง

9.Enhance Retention & Transfer to the job: การเพิ่มให้แน่ใจว่าผู้เรียนได้รับความรู้ เช่น การทบทวนและการเสนอแนะนำไปใช้ในเนื้อหาบทต่อไป พร้อมทั้งมีการเชื่อมโยงให้ผู้เรียนเห็นเป็นรูปธรรม หรือ การตั้งโจทย์ที่ท้าทายให้ผู้เรียนร่วมกันอภิปรายผ่าน Discussion board



WBI Design: หลักในการออกแบบ - เนื้อหา

- กิจกรรม

1. เนื้อหา: กำหนดวัตถุประสงค์การใช้บทเรียนอย่างชัดเจน , ใช้สีอย่างเหมาะสม, การใช้หัวข้อใหญ่-ย่อย, การใช้ถ้อยคำสะน กระทัดรัด, การนำสื่อประสมมาใช้, การใช้ตาราง ทำให้เกิดความชัดเจนมากยิ่งขึ้น

2.กิจกรรม: เน้นกิจกรรมส่งเสริมการเรียนการสอนให้มีประสิทธภาพมากยิ่งขึ้น

-ประสานเวลา: ผ่าน chat / viideo conference

-ไม่ประสานเวลา : E-mail

-แบบร่วมมือ : เป็นการเรียนการสอนแบบผสมผสานระหว่าง synchonous และ asynchonous ซึ่งจะพิจารณาตามความเหมาะสมของเนื้อหาและกิจกรรม



บทสรุป: ในการออกแบบบทเรียน จะมี2หลักการใหญ่คือ เป็นระบบ ADDIE MODEL และ Gagne การออกแบบบทเรียนแบบเป็นขั้นเป็นตอน ซึ่งถ้าพิจารณาดีๆแล้วจะเหมือนกับการเขียนแผนการสอน คือมี 3 ขั้นตอนใหญ่ๆ คือ ขั้นนำ ขั้นสอน และขั้นสรุป นอกจากนี้ยังมีทริปต่างๆ เช่น การใช้สี การติดต่อสือสาร การใช้ตางราง หรือการนำสื่อประสมเข้ามาให้บทเรียนมีความน่าสนใจมากยิ่งขึ้น


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

การออกแบบตามแบบ Lint& Horton เสนอไว้ว่าการออกแบบ Site structure มีอยู่ 3 รูปแบบคือ
1)Sequence: แบบเรียงลำดับ คือการออกแบบเว็บไซต์ไปทีละหน้า เหมาะกับเว็บๆซต์ที่มีจำนวนเว็บเพจไม่มาก
2) Hierarchy : ออกแบบเป็นแบบระดับชั้น เหมาะสำหรับเว็บไซต์ที่มีเว็บเพจมาก เป็นแบบที่นิยม เห็นได้ทั่วไป
3) Combination : เหมาะกับเว็บไซต์ที่มีความซับซ้อน คือนำข้อดีของสองรูปแบบข้างต้นมาผสมกัน


สรุป: การออกแบบ site structure มีอยู่หลายรูปแบบด้วยกัน เราสามารนำมาผสมผสานเพื่อให้เหมาะสมกับเว็บไซต์ของเรา เพื่อให้เกิดประสิทธภาพอย่างสูงสุด

นอกจากนี้ยังได้เรื่อง Page Design

ในเวบเพจหน้าหนึ่งจะมี 4 องค์ประกอบด้วยกันคือ

1.Page Header: มักจะใส่ชื่อผู้จัดทำไว้ เพราะเป็นส่วนแรกที่ผู้เข้าชมมอง มุมบนซ้าย

2.Navigation Bar : เชื่อมโยงไปยังส่วนต่างๆของเว็บไซต์

Body: ตัวเนื้อหา อาจจะมีตัวนำทาง ซึ่งมักจอยู่ด้านขวาของเนื้อหา

3. Page footer : อาจจะใส่ Text Link ต่างๆไว้ นิยมใส่ชื่อของหน่วยงาน หรือแบนเนอร์ของผู้ให้การสนับสนุน

โดยปกติแล้ว องค์ประกอบ 4 อย่างนี้จะเป็นรุปแบบที่คงที่เหมือนกันหมด Template อาจเปลี่ยนบ้างในส่วนของ Body

หลักการออกแบบหน้าเว็บเพจ:

1. Simplysity คือ การจัดแต่เฉพาะองค์ประกอบหลักๆ ควรเลือกให้พอเหมาะ มีรูปแบบที่เรียบง่าย สีของตัวอักษรก็ไม่ควรมากมายจนเกินไป

2.Consistensy : ความสม่ำเสมอ คือ การสร้างความสม่ำเสมอให้เกิดขึ้นทั้งเว็บไซต์ เพื่อไม่ให้ผู้ใช้งานเกิดความเหมาะสม

3.Warm tone colour : การเลือกใช้สี ควรให้เหมาะสม, สีจะมีอิทธิพลในเรื่องของอารมณ์ด้วย เช่น สีโทนเย็น จะให้ความรู้สึกสงบ สีโทนร้อนจะให้ความรู้สึกที่ตื่นเต้น รุนแรง เพราะฉะนั้นเรีอง สีก็เป็นปัจจัยสำคัญ

Warm tone colour: ทำให้หมดจากความเฉื่อยชา ทำให้มีชีวิตชีวา

4.Cool Colour : แสดงถึงความสุภาพ อ่อนโยน มีความเรียบร้อย สามาระโน้มน้ามในระยะไกลได้ "กลุ่มสีที่ปลอดภัย"

5.Neutral tone coulour: สีโทนกลาง ประกอบด้วย ขาว เทา ดำ น้ำตาล

**นอกจากนั้นสียังช่วยเสริมเอกลักษณ์ขององกรค์ได้อีกด้วย ***

โดยมีเว็บไซต์แนะนำในเรื่องของการใช้สีคือ adobe kuler , colourlovers

การออกแบบระบบนำทาง: องค์ประกอบคือ เมนูหลัก, เมนูเฉพาะกลุ่ม,เครื่องมือเสริม เช่น ช่องค้นหา

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

เทคนิค Text& Button, Drop down list, On mouse Over

สิ่งที่ต้องเตรียมมา: เตรียม พรีเซนต์โครงสร้าง เว็บเควสท์ของเรา



ความคิดเห็นอื่นๆ: วันนี้ งานเยอะที่สุดเลยค่ะ เหนื่อยๆๆๆ
ไม่ต้องVote ละคะ งานคู่ งานคู่ งานคู่ มติเป็นเอกฉันท์ชัวร์!!!!!

วันอาทิตย์ที่ 8 พฤศจิกายน พ.ศ. 2552

Learning Log Week2 (9Nov09)

สิ่งที่ได้เรียนรู้: Review บทเรียนของสัปดาห์ที่แล้ว โดยให้ ธนพจน์ออกมาทบทวนให้เพื่อนฟังว่าเรียนอะไรไปบ้าง เช่น วิวัฒนาการของอินเตอร์เน็ต ,WEB 2.0 , เนื้อหาที่อยู่ในรุปแบบสื่อผสม หรือ TEXT , ระบบบริหารการเรียน เช่น Blackboard เป็นต้น, การติดต่อส่อสาร แบบ Real Time และ Not Real time , การสอบ มีประเมินก่อนเรียน ระหว่างเรียน และ หลังเรียน

ศึกษาเรื่องการทำ Project ที่1 (งานเดี่ยว) :
เว็บ Quest คืออะไร: เป็นนวัตกรรมในการจักิจกรรมพที่ผู้เรียนไว้ใช้ในการเรียนออนไลน์ ในการเรียนรู้แบบสืบสอบ เน้น กิจกรรมที่ส่งเสริมทักษะ การคิดเวิเคราะห์ โดยมักมีอยู่ 5 ขั้นตอนใหญ่ๆ ได้แก่
1.การนำเข้าสู้บทเรียน
2.ภาระงาน
3.กระบวนการ
4.การประเมินผล
5.บทสรุป
เว็บเควสสมัยใหม่ ได้นำ WEB2.0 ได้นำเครื่องมือ WEB 2.0 เพื่อเพิ่มประสิทธิภาพของชื้นงานเรามากขึ้น

หัวใจที่สำคัญ คือ 1.ส่วนนำเข้า 2.การแปลงสาร 3. ส่วนนำออก
*** เน้นที่ผู้เรียนสร้างมันขึ้นมาเอง***
องค์ประกอบของ เว็บ Quest :
1. บทนำ : ผู้เรียนต้องชี้นำให้เห็นถึงที่มาของกิจกกรรมการเรียนรู้
2.ภาระงาน: บอกภาระของผู้เรียนว่าต้องทำอะไรบ้างในแต่ระภาระงานต่างๆ ซึ่งขึ้นอยู่กับผู้ออกแบบว่าจะให้ทำงานเดียว คู่ หรือกลุ่ม นอกจากนั้นก็ต้องบอกผลลัพท์ที่เราคาดหวังจากชิ้นงานแต่ละชิ้น
3.กระบวนการ : ต้องแจ้งให้นักเรียนทราบกระบวรนการหรือขึ้นตอนต่างๆเป็นข้อๆ
4.การประเมินผล : ต้องแจ้งให้ผู้เรียนทราบเกี่ยวกับเกณฑ์การให้คะแนน ใช้ Rubric
5.สรุป : ผู้พัฒนาต้องสรุปให้ผู้เรียนทราบเกี่ยวกับเนื้อหาเรื่องนั้นๆ
6.แหล่งอ้างอิง: ผู้พัฒนาจะต้องใส้แหล่งที่มาของข้อมูล รูปภาพต่างๆ
7.ครูผู้สอน : บางเว็บก็จะมี บางเว็บก็จะไม่มี จะเป็นส่วนที่ผู้พัฒนาแจ้งให้ครูผู้สอนที่สนใจใช้เว็บเควสท์นี้ มีองค์ประกอบอะไรบ้าง

"Web Quest is as scaffolded learning Structure"

ผลลัพท์ที่ดีกว่าการเรียนธรรมดาในชั้นเรียน คือ การใช้เว็บเควสท์ ข้อมูลอัพเดพมากยิ่งขึ้น มีความน่าสนใจมากกว่า

- อาจารย์ให้หาเว็บเควสท์ที่ชื่นชอบมากที่สุดตามสาขาวิชาเอกของตนเอง พร้อมทั้งบอกส่วนประกอบต่างๆ พร้อมทั้งจุดเด่น และข้อเสนอแนะเพิ่มเติม พร้อมทั้งให้เป็นคอมเม้นท์เว็บเควสท์ที่เพื่อนๆหามาให้ครบ 5 คน นับว่ากิจกรรมในห้องเรียนชิ้นนี้ ทำให้เราได้ประโยชน์ในการเห็นข้อเสีย ข้อดีของเว็บเควสท์หลายๆเว็บ เพื่อที่จะได้นำมาพัฒนาและปรัปปรุงในการทำเว็บเควสท์ของเราเองในอนาคตคะ

** เว็บเควสท์ของต่างประเทศจะมีการใส่ Task และมีกระบวนการน่าสนใจกว่าของประเทศไทย แต่ประเทศไทยจะเน้น Design ที่สวยงาม แต่กระบวนการบางอย่างยังไม่ค่อยดึงดูดใจเท่าไรนัก


WEB2.0 Tool: Web Application Tools เครื่องมือในการสนับสนุนการทำงานบนเว็บ
- Blog
- Social Bookmarking
- RSS Feed
- Widgets
- Mashup

Communication Tool เครื่องมือสำหรับติดต่อสื่อสาร
- Chat
- Instant Messenging
- Skype
-Podcast
- Audio Graphic

Community Tools เครื่องมือส่งเสริมการเป็นชุมชนออนไลน์
- Webboard
- Wiki
- Social Networking
- Second Life

File Sharing เครื่องมือที่ช่วยในการแบ่งปันข้อมูล
- Photo sharing
- Music sharing
- Video Sharing
- Document sharing
- File Sharing

จากการที่ข้าพเจ้าได้ศึกษารายละเอียดต่างๆเกี่ยวกับ WEB 2.0 Tool เพื่อที่จะมาดีไซน์รูปแบบเว็บเควสท์ของข้าพเจ้า (วิชาภาษาอังกฤษ)

ชื่อเรื่อง: "เลิกปวดหัวกับTense Tense Tense!!"

กลุ่มเป้าหมาย : นักเรียนระดับชั้น มัธยมศึกษาตอนต้น หรือ ผู้ที่สนใจจะศึกษาเรื่อง Tense

วัตถุประสงค์ของบทเรียน: เพื่อให้นักเรียน หรือผู้ที่มีปัญหางุนงงกับการทำความเข้าใจเรื่อง Tense ได้มีความรู้ความเข้าใจเรื่อง Tense มากยิ่งขึ้น

Design: Introduction: ก่อนอื่นก็จะเร้าความสนใจ และกระตุ้นความอยากเรียนของผู้เรียนด้วยภาษาสนทนาก่อน โดยจะเสริมคลิปวิดีโอที่เป็นเพลง หรือ การ์ตูนที่เกี่ยวกับ Tense เข้าไปในหน้า Introduction เพื่อต้องการแสดงให้ผู้เรียนเห็นว่า Tense ง่ายกว่าที่เราคิดเยอะ

Task: 1. จะให้ผู้เรียนทำแบบทดสอบก่อนเรียน
2. ให้ผู้เรียนทำงานเดี่ยวคือ สรุปเรื่อง Tense ที่ตนเองสนใจ โดยจะพรีเซนต์โดย ใส่ Blogspotของตนเอง และไปคอมเม้นท์ของเพื่อนๆอย่างน้อย 3 คน ที่ทำเรื่อง Tense ที่แตกต่างกับเรา
3. ให้นักเรียนจับกลุ่มกัน กลุ่มละ 4-5 คน มาพรีเซนต์เรื่อง Tense ที่ตนเองได้รับมอบหมาย โดยเเต่ละกลุ่มจะถือเป็นผู้เชี่ยวชาญ SME ทำเอกสารแจกเพื่อนๆ โดยการพรีเซนต์หน้าห้องนั้นจะไม่ Fix ว่าจะต้องพรีเซนต์แบบใด อาจจะทำเป็นเกมส์ หรือ แสดงบทบาทสมมุติ หรืออะไรก็ได้ ตามความสนใจ
4. ให้ผู้เรียนทำแบบทดสอบหลังเรียน

Process: 1. ผู้เรียนทำแบบทดสอบก่อนเรียน
2.มอบหมายให้ผู้เรียนศึกษาเรื่อง Tense ซึ่งอาจจะมีไฟล์เอกสารแนบไปให้ หรืออาจจะมี Link ที่เป็นเว็บเพื่อเข้าไปทำการศึกษา หรืออาจจะเป็นไฟล์วิดีโอที่เกี่ยวข้องกับเรื่อง Tense
3.ให้นักเรียนไปสรุป Tense ที่ตนเองสนใจอย่างน้อย 1 Tense บนblog ของตนเอง และต้องไปอ่านและคอมเม้นท์สรุปของเพื่อนๆ อย่างน้อย 3คน ที่ทำเรื่องที่แตกต่างกับตนเอง
4. อาจารย์ผู้สอนให้นักเรียนจับกลุ่มกันและ จับฉลากหัวข้อ SME ที่แต่ละกลุ่มจะได้รับมอบหมาย
5. นักเรียนแต่ละกลุ่มก่อนนำเสนอให้มาปรึกษาอาจารย์ก่อนว่าจะพรีเซนต์ในรูปแบบไหน เพื่อที่อาจารย์จะได้ให้คำแนะนำเพิ่มเติม

Evaluation: ใส่เกณฑ์การประเมินแต่ละภาระงานไว้ โดยใช่ Rubrics

Conclusion: สรุปเป็นภาษาสนทนาเพื่อให้กำลังใจผู้เรียนในครั้งต่อๆไป

Reference: ใส่ที่มาของแหล่งข้อมูล รูปภาพ ไฟล์ต่างๆ เพื่อให้เกียรติแก่เจ้าของข้อมูล

เทคนิคเพิ่มเติม : จะเพิ่มเว็บบอร์ดเข้าไปใน WebQuest นี้ เผื่อไว้ว่านักเรียนมีข้อสงสัย อาจจะตั้งกระทู้ร่วมกันอภิปราย นอกจากนั้นภายในเว็บบอ์ดก็จะมีกระทู้ที่ถูกปักหมุดไว้ โดยจะมีกระทู้ที่ข้าพเจ้าจะใส่ไว้พื่อเสริมความรู้รอบตัวในเรื่องต่างๆที่อยู่ในวงการภาษาอังกฤษ หรือถ้ามีนักเรียนคนใดอยากจะแชร์ข้อมูลที่น่าสนใจไว้ให้เพื่อนๆได้อ่าน ก็จะปักหมุดไว้ให้ค่ะ


******PS. ทั้งนี้อาจมีการเปลี่ยนแปลงได้ค่ะ ขึ้นอยู่กับความสามารถที่พัฒนามากยิ่งขึ้น*******


สิ่งที่จะต้องเตรียมมา: ออกแบบดว็บเควสท์ที่จะทำเป็น Final Project และหาเทคนิค Applicatiom ที่จะใส่ไปในเว็บเควสท์เพื่อดึงดูดความน่าสนใจให้มากยิ่งขึ้นค่ะ


ข้อคิดเห็น: การเรียนในครั้งนี้ไม่น่าเบื่อเลย อาจเพราะว่ามีคอมพิวเตอร์อยู่ตรงข้างหน้า ไม่ใช่ว่าหนูแอบเล่นเกมส์นะคะ แต่ว่า ตอนทำงาน หรือตอนเรียนหนูก็ตั้งใจทำงาน เพียงแต่เวลาที่งานเสร็จก่อนเพื่อนๆ ก็มีเกมส์ให้เล่น ทำให้ไม่น่าเบื่อเลยค่ะ ^_____^
การสอนในครั้งนี้มีกิจกรรมให้ตลอดเวลาด้วยทำให้ไม่น่าเบื่อเลย และก็ได้รับเนื้อหาที่ไม่เคยรู้ ได้รู้เพิ่มขึ้นอีกเยอะเลยค่ะ

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

วันจันทร์ที่ 2 พฤศจิกายน พ.ศ. 2552

Learning Log Week 1 02/10/09

สิ่งที่ได้เรียนรู้ ครั้งที่1 วันที่ 2/10/09


- Future of Internet : คือ ถ้าเทียบกับการใช้อินเตอร์เนตในยุคก่อนและยุคปัจจุบัน จากการที่ได้ชมคลิปวิดีโอวันนี้ทำให้เห็นวิวัฒนาการของอินเตอร์เน็ต ตั้งแต่การมีจำนวนใช้ที่เพิ่มมากขึ้น No barrier และมีความเป็นสากลมากขึ้น ข้อจำกัดของอินเตอร์เน็ตก็ลดน้อยลง เช่น แต่ก่อนเราต้องนั่งอยู่บ้านเล่นอินเตอร์เน็ตผ่านโมเดมที่เชื่อมต่อกับสายโทรศัพท์เท่านั้น แตสมัยนี้อินเตอร์เน็ตก็สามารถเข้าถึงได้ Anytime Anywhere จะเห็นได้ชัดจากปัจจุบันนี้ เราสามารถเล่นอินเน็ตบนมือถือผ่าน EDGE หรือ Wifi และที่มาใหม่ก็คือ 3G ได้แล้ว
สมัยก่อนผู้ที่สามารถปรับแต่งแก้ไขข้อมูลของเราบนอินเตอร์เน็ตมีแต่ Webmasterเท่านี้น แต่สมัยนี้เราสามารถเป็นผูเแก้ไขข้อมูลต่างๆได้ด้วยตัวของเราเอง สมัยนีัมีเพิ่มระบบความปลอดภัยของข้อมูลเรามากขึ้น เช่นกัน ความเร็วอินเตอร์เน็ตก็เร็วขึ้นกว่าสมัยก่อนมากทีเดียว สมัยนี้มี Hi speed Internet ซึ่งเร็วกว่าความเร็วอินเตอร์เน็ตสมัยก่อนอย่างมากเลยทีเดียว นับได้ว่าช่วงหลายปีที่ผ่านมานี้ อินเตอร์เน็ตมีความก้าวหน้าขึ้นมากและข้าพเจ้าก็เชื่อว่าวงการอินเตอร์เน็ตก็จะสามารถพัฒนาไปไกลได้อย่างไม่หยุดยั้ง


1.วิวัฒนาการของการเรียนทางไกล:

ยุคที่1 : การเรียนทางไปรษณีย์ นิยมใช้จดหมายเป็นสื่อ สื่อสารกันโดยการเขียนจดหมาย

ยุคที่ 2 : ยุคของมหาวิทยาลัยเปิด เรียนผ่านสื่อวิทยุและโทรทัศน์ เปิดให้ทุกคนลงทะเบียนได้ โดยไม่คำนึงถึงประสบการณ์ ไม่มีข้อจำกัดด้านเวลา

ยุคที่ 3 : เริ่ม พ.ศ.2523 วิดีโอเทป การกระจายเสียง ดาวเทียม และสายเคเบิ้ล เช่น การออนแอร์การเรียนการสอน ผ่านเครือข่ายดาวเทียม


ยุคที่ 4 : เรียนผ่านเว็บ หรืออินเตอร์เน็ต เป็นการให้ความรู้ผ่านเว็บไซต์ ทุกที่ ทุกเวลา สำหรับทุกคน


ยุคที่ 5 : ยุค E-Learning เทคโนโลยีหลายๆรูปแบบที่หลากหลาย มีอิทธิพลกับการเรียนการสอนมากขึ้น มีการติดต่อสื่อสารมากขึ้น ทั้งประสานเวลา และไม่ประสานเวลา เ



2.องค์ประกอบของ &Trend ของ WBI

1.เนื้อหา

2.การติดต่อสื่อสาร

3.ระบบบริหารการเรียน (ระบบสนับสนุนให้ผู้เรียน เรียนรู้ด้วยตนเอง แล้วคุณครูก็จะสามารถ

ได้รับรู้ความก้าวหน้าได้ เช่น Blackboard

4.การสอบวัดประเมินผล : ไม่ใช่ดูแต่ชิ้นงาน( Product) ให้ดูกระบวนการทำงาน(Process)ด้วย


Trend WBI : สมัยก่อนจะมีแต่ภาษา Html ต่อมามี Program application เพิ่มขึ้นเช่น Font Page >> Dreamever หรือมีอีกตัวนึงเช่น System Web "Joomla" คือมีทุกอย่างให้ เราแค่จับใส่อย่างเดียว จะทำให้การทำเว็บของเราง่ายและสะดวกมากขึ้นกว่าแต่ก่อน


แนวทางในการนำ WEB2.0 ไปใช้ในการเรียนการสอน


แนวทางในการนำ WEB2.0 ไปใช้ในการเรียนการสอนในอนาคตของข้าพเจ้า ข้าพเจ้าคิดว่าจากประสบการณ์ที่ได้เห็นในการเรียนการสอนจนถึงชั้นปีที่ 3 นี้ ข้าพเจ้าชอบการเรียนการสอนผ่าน Blog เพราะว่า คิดว่าเด็กๆส่วนใหญ่สมัยนี้น่าจะอยู่กับอินเตอร์เน็ตทั้งวัน บางคนก็มี Blog ส่วนตัวกันอยู่แล้ว การที่เราให้เด็กได้เรียน ได้ทำกิจกรรมต่างๆผ่าบเว็บทำให้เราได้เห็นพัฒนาการของเด็กๆไปด้วย โปรแกรมที่น่าสนใจก็ควรเลือกให้เหมาะสมกับรายวิชา เช่นวิชา Photo ก็เหมาะสมกับ Multiply เพราะเป็นเว็บที่ไว้ลงรูปต่างๆที่คนสาวนมากมักเลือกใช้กัน ทำให้เวลาผู้เรียนได้เรียนวิชานี้ ก็อาจจะได้เห็นตัวอย่างของภาพที่ผู้เชี่ยวชาญ หรือ เพื่อนๆ แม้กระทั่งบุคคลภายนอกได้ง่ายมากยิ่งขึ้น



วันอังคารที่ 27 ตุลาคม พ.ศ. 2552

Getting to Know






FangFang's Profile


ชือ นางสาว วรรณภัสสร นามสกุล กัลป์นันทกูลย์
ชื่อเล่น "ฟาง"
นิสิตสาขา วิชา มัธยศึกษา มนุษยศาสตร-สังคมศาสตร์ ชั้นปีที่ 3
เอก ภาษาอังกฤษ-เทคโนโลยีการศึกษา

สิ่งที่คาดหวังในรายวิชานี้: สิ่งที่หนูคาดหวังจากรายวิชานี้ก็คือ ความรู้และประสบการณ์ที่ได้จากการทำงาน ปฏิบัติกิจกรรมในห้องเรียน ไปประยุกต์ใช้กับการฝึกสอน หรือ การงานในอนาคต

ประสบการณ์ในการใช้คอมพิวเตอร์ : ประสบการณ์การใช้คอมพิวเตอร์ของหนู ถ้าจำไม่ผิดหนูเริ่มใช้คอมพิวเตอร์เมื่อตอนอยู่ชั้นประถมศึกษาปีที่ ถ้านับเวลาก็ประมาณ 12 ปี เริ่มแรกก็ใช้เพียงการ chat icq และห้องแชตตามเว็บต่างๆที่ฮิตกันเป็นอย่างมากในสมัยก่อน ต่อมาก็ใช้เพื่อการทำงาน คือ Micrsoft office ต่างๆ ต่อมาก็จะใช้เพราะความชอบ เริ่มศึกษาหาความรู้โปรแกรมที่สนใจด้วยตนเอง โดยซื้อหนังสือมาอ่านและลงมือทำตามขั้นตอนในหนังสือ คือโปรแกรม Adobe Photoshop และ Dreamweaver ส่วนปัจจุบัน ส่วนมากจะใช้คอมพิวเตอร์เพื่อการศึกษามากที่สุด

สิ่งที่สนใจ: สิ่งที่สนใจเป็นพิเศษในตอนนี้ คื สุนัข ตอนนี้กำลังจะได้ลูกหมาน้อยมาใหม่หนึ่งตัวค่ะ เป็นพันธุ์ Miniature Schnauzer เป็นสุนัขที่มาจากประเทศเยอรมัน และตอนนี้ก็กำลังเครียดกับการตั้งชื่อใหม่น้องหมาอยู่ค่ะ

และสิ่งที่หนูสนใจเป็นพิเศษในตอนนี้อีกอย่างหนึ่งก็คือ การหาธุรกิจ ช่องทางธุรกิจทำเมื่อรียนจบ ซึ่งตอนนี้ก็กำลังสนใจเรื่อง ธุรกิจด้านสุนัข กับธุรกิจของด้านเครืองดื่มค่ะ

แผนในอนาคต: แผนในอนาคตที่วางไว้ก็คือ เมื่อเรียนจบปริญญาตรี อาจจะเข้าศึกษาต่ปริญญาโทสาขา บริหารธการตลาด หรือไม่อาจจะเร่งเรียนภาษาที่ 3 ก่อน จากน้้นก็อยากจะค่อยๆศึกษาด้านการทำธุรกิจ อยากมีกิจการเป็นของตัวเอง :)