slide – iT Blog

#เล่าสู่กันฟัง 63-056 เขียน markdown เป็น pptxเล่าสู่กันฟัง 63-056 เขียน markdown เป็น pptx

เคยอ่านบล็อก อ.สมเกียรติ ปุ๋ยสูงเนิน somkiat.cc เรื่อง “มาทำ slide และ live code ใน VS Code ดีกว่า” ท่านใช้ markdown ในมุมมองใหม่ได้อย่างน่าสนใจ

ซึ่งผมก็เห็นว่าเป็นภาษาหลักสำหรับการเล่าเรื่องใน github.com สำหรับใครที่ไม่ต้องการเพิ่มขั้นตอนด้วยการไปเขียนใน github.io ที่รองรับ html ก็จะเขียนด้วย markdown ในแฟ้ม README.md แล้วแสดงผลหน้าแรกของ repo

ภาษา markdown เขียนง่ายกว่า html มาก และน่าจะง่ายที่สุดสำหรับการสร้างข้อความหลายมิติ (hypertext) และใน blog ของท่านพูดถึงการเขียนใน vs code แล้วส่งออกเป็น slide บน powerpoint หรือ pdf

ช่วงนี้ (มี.ค.63) มี covid-19 ระบาดหนัก เริ่มเปลี่ยนการศึกษาจาก #ระบบใส่ใจ คือ สอนกันแบบถึงเนื้อถึงตัว มาเป็น #ระบบใส่แมส คือ มี social distancing ใส่เครื่องป้องกัน สอนออนไลน์ สอนแล้วมาเรียนในยามที่สะดวก เรียนได้หลายครั้ง และเรียนได้มาก แบบ mooc ถ้าคุณครูเปิดให้เรียนซ้ำ ๆ ก็จะพัฒนาไปได้ไกล และกว้าง แบบ mass media

เมื่อวางแผนการสอน แล้วก็จะเริ่มสอน การสอนแบบเห็นหน้าครูเป็นชั่วโมง นั่งพูด ยืนพูด แบบ TED คงใช้ไม่ได้กับทุกวิชา

ดังนั้น powerpoint กับ camtasia จึงเป็นตัวเลือกที่น่าสนใจ ในการจัดทำสื่อการสอน การเปิดให้ส่งงาน ผ่านกลุ่มเฟส และทำข้อสอบผ่าน google form ก็พูดถึงกันมาก

กลับมาที่ markdown พบว่าเป็นภาษาที่เขียนง่าย นำหัวข้อมาเรียงแยกบรรทัดใน word หรือ notepad แล้วใช้ marp แปลงเป็น pdf, png, pptx หรือ html ก็ได้ slide สำหรับเตรียมพูดหลายชั่วโมงแบบมี navigation นำทาง

ผมลองใช้ marp-cli บน command line พิมพ์คำสั่งบรรทัดเดียว ก็แปลงแฟ้ม README.md เป็น myslide.pptx พร้อมสอนได้ทันที แก้ไขก็เพียงย้อนกลับมาแก้ข้อความใน README.md หรือไปแก้ที่ myslide.pptx ก็สะดวก แล้วยังจัดการ tempate ผ่าน gaia.scss ได้ตามชอบ คนที่พัฒนา marp เค้าว่าเป็น license : mit น่าติดตาม และนำไปใช้

ปล. เมื่อคืนนอนดึกหน่อย เกือบเช้า
เพราะติดพัน กับลูกเล่น css คุม markdown
http://www.thaiall.com/markdown

แจกลิงค์สไลด์หนังสือด้านคอมพิวเตอร์ 13 บท แบบ PPS

รวมสไลด์ประกอบหนังสือ โดย วิโรจน์ ชัยมูล และสุพรรษา ยวงทอง
บริษัท โปรวิชั่น จำกัด, กรุงเทพฯ, 2558.
“ความรู้เบื้องต้นเกี่ยวกับคอมพิวเตอร์และเทคโนโลยีสารสนเทศ”
ISBN: 978-616-204-532-5

1. ความรู้เบื้องต้นเกี่ยวกับคอมพิวเตอร์และเทคโนโลยี
http://goo.gl/KptNHX
2. องค์ประกอบของระบบคอมพิวเตอร์
http://goo.gl/WWl2bf
3. ซอฟต์แวร์
http://goo.gl/fA9qz2
4. ฮาร์ดแวร์
http://goo.gl/eBGs3m
5. ระบบปฏิบัติการและหลักการทำงาน
http://goo.gl/3LoYfR
6. ข้อมูลและการจัดการข้อมูล
http://goo.gl/y5bXBT
7. การวิเคราะห์และการพัฒนาระบบ
http://goo.gl/g7JNTL
8. การเขียนผังงาน
http://goo.gl/IYxSb8
9. ระบบเครือข่ายคอมพิวเตอร์
http://goo.gl/FgaQN6
10. อินเทอร์เน็ต
http://goo.gl/IgBokw
11. ข้อมูลและสารสนเทศ
http://goo.gl/IQ9e5V
12. พาณิชย์อิเล็กทรอนิกส์
http://goo.gl/guQDfm
13. จริยธรรมและความปลอดภัย
http://goo.gl/lGwat3

Official site
http://www.provision.co.th/index.php?page=shop.product_details&product_id=555&flypage=flypage.tpl&pop=0&option=com_virtuemart&Itemid=31
—
ภาพปกที่ผมมี 1 เล่ม
https://www.facebook.com/thaiall/photos/a.10152593764617272.1073741865.350024507271/10153653486702272/

—

Google.com บริการหลายอย่าง บริการหนึ่งคือ URL Shortener
คือ การย่อ URL (Uniform Resource Locator) ให้สั้นลง
จะได้ใช้วางในสื่อสังคมได้ประหยัดพื้นที่
+ https://goo.gl
+ http://www.thaiall.com/google

background sound สำหรับ powerpoint

เราสามารถใช้ powerpoint สร้างคลิ๊ปวีดีโอง่าย ๆ แบบ stop motion ได้
โดยการนำภาพนิ่งไปวางเป็นแต่ละ slide แล้วก็ใส่ sound เป็น background sound
ซึ่งใช้งานใน powerpoint 2010 ได้ เพราะสามารถ save as เป็น .wmv
แต่ใน powerpoint 2007 ยังไม่สนับสนุนการ save as เป็นคลิ๊ปวีดีโอ
และตัวเลือกในการทำให้ “เล่นในภาพนิ่งทั้งหมด” ของ 2007 กับ 2010 ก็มีการปรับเปลี่ยนตำแหน่ง
สรุปว่า powerpoint 2010
ช่วยให้การจัดทำคลิ๊ปวีดีโออย่างง่าย ทำได้ง่ายขึ้นมาก เสร็จในเวลาไม่กี่นาที
โดยไม่ต้องติดตั้งโปรแกรมพิเศษอีก

http://www.thaiall.com/blogacla/burin/4036/
แบบของ stop motion

https://dl.dropboxusercontent.com/u/50010673/stopmotion_slide57.rar
9 MB ตัวอย่าง slide

https://dl.dropboxusercontent.com/u/50010673/burin_blue.rar
32 MB ภาพใช้ประกอบการเรียน

https://dl.dropboxusercontent.com/u/50010673/song/yesisher.mp3

https://dl.dropboxusercontent.com/u/50010673/song/flower.mp3

การทำให้ background sound ทีเดียว สำหรับทุกสไลด์

วันนี้น.ส.ดวงพร ที่เรียนวิชาสื่อฯ ถามเรื่องทำให้ sound เล่นไปทั้งสไลด์
ซึ่งเทอมก่อน ๆ เคยสอนไป แต่เทอมนี้ได้ลดทอนบทเรียนนี้ไป
จึงทำ capture slide สาธิตใน windows 8.1 ที่มี office 2013
โดยผมใส่เสียง background ที่สไลด์ 1 แล้วให้เล่นยาวไปบนทุกสไลด์
ไม่ได้ใช้การบันทึกเสียง หรือเสียงออนไลน์ แต่ใช้แฟ้มเสียงใน pc
พบว่าการ config ไม่ต่างกับรุ่นก่อนหน้านี้
1. เข้า insert, เสียง, เสียงบนพีซีของฉัน

2. เลือกเสียงได้แล้ว, พบ icon บน slide คลิ๊กแล้วจะพบ menu เพิ่มบน ribbon menu แล้วเลือก การเล่น

3. ในตัวเลือกเริ่ม ให้เปลี่ยนจาก เมื่อคลิ๊กเป็นอัตโนมัติ แล้วเลือก checkbox หน้า “เล่นในสไลด์ทั้งหมด”

—
วิธีนี้ไม่ได้เข้าไปที่ transition หรือ animation
เพราะทำที่ icon ของ sound อย่างเดียวก็สำเร็จตามวัตถุประสงค์แล้ว

มอง slide ในอดีต

22 พ.ค.54 เมื่อ 5 ปีก่อน มีใช้ slide นี้ อบรมเกี่ยวกับการนำเสนอข้อมูลผ่านอินเทอร์เน็ต ที่สำนักงานสาธารณสุขประจำจังหวัด หลังผ่านไปหลายปี แนวโน้มการเผยแพร่ข้อมูลจากองค์กรทั้งภาครัฐ และเอกชนของโลก ก็ยังไม่ก้าวหน้าเท่าที่ควร เพราะการเปิดเผยข้อมูล กับความปิดเป็นความลับ ยังอยู่กันคนละฟากฝั่ง ที่สิ่งผุดขึ้นมาอย่างเห็นได้ชัด คือ mobile device ที่สนับสนุน wifi หรือ 3G และการเข้ามาของ iphone และ ipad ส่วนประเด็นการออกแบบเว็บไซต์ในทุกระดับยังเป็นแบบ header , footer , column และ rows ส่วนเทคนิคในเว็บไซต์มีการใช้ .css และ web 2.0 อย่างเด่นชัดขึ้น โดยเฉพาะ Facebook.com และ Twitter.com กลายเป็นอีกเครื่องมือหนึ่งของเว็บไซต์ต่าง ๆ ในการประชาสัมพันธ์ข้อมูลข่าวสารขององค์กร
http://www.thaiall.com/html/website49.ppt
http://www.thaiall.com/html/indexo.html

สไลด์ภาพด้วย jquery

2 พ.ค.54 การทำสไลด์ภาพ (image slide) เริ่มมีให้เห็นในเว็บไซต์ต่าง ๆ เพิ่มขึ้น มีแบบ javascript และ flash ถ้าเป็น flash ก็จะดูน่าตื่นตาตื่นใจกว่าแบบ javascript อย่างเห็นได้ชัด แต่การใช้ javascript จะจัดการง่าย และไม่ต้องกังวลเรื่องการรองรับของ browser ในอุปกรณ์ของผู้ใช้ เพราะอุปกรณ์ส่วนใหญ่จะรองรับ javascript แต่มีน้อยลงที่รองรับ flash file

สำหรับ slide ของ jquery จะดูดีมาก และผมได้แก้ไข code บางส่วนให้นำมาใช้งานได้ง่าย ลอง download ไปทดสอบดูได้ครับ
http://www.thaiall.com/java/slidejquery/slide.htm
http://www.thaiall.com/java/slidejquery/slidejquery.zip
http://www.thaiall.com/blog/burin/2339/

ดำเนินการปรับ yoso (wordpress)

23 พ.ย.53 เนื่องจากเว็บของ yoso.yonok.ac.th เป็นระบบที่ outsource โดยใช้ code หลักของ wordpress และมี plug-in เสริมหลายตัว โดยใช้ theme ของ solostream/wp-clear ที่แบ่ง column ได้เป็นระเบียบ เมื่อมีข้อมูลเพิ่ม ก็จะต้องปรับข้อมูลและเขียนวิธีการ เพื่อให้ผู้เกี่ยวข้องได้ร่วมแลกเปลี่ยน ดังนี้ 1) หัวข้อที่หมดอายุ ผมเลือกสั่ง private แทน public ในการ edit post 2) ส่วนข่าวที่เพิ่มใหม่ ได้กำหนดกลุ่มเป็น news หรือห้องตามที่กำหนด และใช้ระบบ DM-Albums รู้สึกสะดวกมาก และสร้าง thumb nail อัตโนมัติด้วยการ upload ภาพเข้า post โดยตรง ซึ่งภาพแรกจะเป็น thumb nail 3) ส่วนข่าว camp ที่เขียนเป็น html ต่อท้ายสี่กลุ่มคอลัมในหน้าแรก ถ้าลบออกจะต้องเข้าไปแก้ไขแฟ้ม index.php ในห้อง themes/wp-clear 4) ส่วน slide มาจากระบบ gallery ของ DM-Albums การแก้ไขต้องเข้า Post, Categories, Gallery สามารถเลือก private ส่วนการจัดลำดับภาพใน Slide ใช้ PostMash เปลี่ยนตำแหน่งของหัวข้อใน Gallery ซึ่งระบบ Gallery ก็เพียงแต่ insert จาก DM-Albums เท่านั้น 5) กรณีของ ข่าว สะเปาลอยน้ำ ได้เพิ่มทั้ง news และ gallery สำหรับรูปที่ใช้กับ slide gallery ในหน้าแรก ต้องปรับขนาดให้ลงตัวกับการนำเสนอ
ผลการทำงานที่ http://yoso.yonok.ac.th/news/saplao53.html

contentslider javascript

16 ต.ค.53 คุณธรณินทร์ สุรินทร์ปันยศ ช่วยให้ผมได้ศึกษาเรื่องของ การใช้ javascript ทำ slide show เมื่อเปรียบเทียบแล้วพบว่า ใช้งานได้ดีกว่า dm-album ในกรณีนี้ ซึ่งปกติผมจะปิดกั้นตนเองไม่ศึกษาเรื่องแบบนี้ แต่ อ.ทันฉลอง รักษาการอธิการ มีนโยบายให้มีการปรับปรุงเว็บไซต์ทั้งระบบ ประกอบกับ code ชุดนี้ เคยถูกนำมาใช้งานโดย startupthailand.com เมื่อแกะโค้ด ก็พบว่ามีการ import แฟ้ม contentslider.js เพียงแฟ้มเดียว ซึ่งนำไปใช้ได้ง่าย แล้วเผยแพร่ใน thaiall.com/java หัวข้อ 2.18 เพื่อให้นักพัฒนาคัดลอก .zip ที่มีตัวอย่างและปรับ code เบื้องต้นแล้ว .. (ปัญหา สร้าง โอกาส)

ต.ย. http://www.thaiall.com/java/contentslider/contentslider.htm

และ http://www.thaiall.com/java/contentslider/contentslider.zip

http://www.thaiall.com/blog/burin/3205/