จดจำใบหน้าคนด้วย JavaScript ที่ง่ายที่สุดดดด - Face Recognition
ฝัง
- เผยแพร่เมื่อ 22 ก.ย. 2024
- ทำระบบจดจำใบหน้า คัดแยกว่าคนนี้เป็นใคร คนนั้นเป็นใครได้ง่ายมากกกก ด้วย JavaScript ผ่าน WebBrowser ได้เลย เรียกได้ว่า ครบ จบในที่เดียว มีโค้ดตัวอย่างให้ดูอีกด้วยนะ
.
GitHub : FaceReg JS ที่เข้าใจง่ายสุดๆ
github.com/Bor...
.
🦖BorntoDev Channel คือ ช่องยูทูปที่เน้นสาระด้านเทคโนโลยี ไปพร้อมกับความสนุกสนาน และ รอยยิ้มเข้าไว้ด้วยกันทั้งในรูปแบบบทเรียน และ vlog
.
เพื่อการเปลี่ยนรูปแบบการเรียนรู้ด้านการพัฒนาโปรแกรม และ เทคโนโลยีแบบเดิม ๆ ที่เป็นเรื่องเฉพาะกลุ่มให้เข้าถึง เข้าใจได้ง่ายยิ่งขึ้น โดยพัฒนาเน้นไปที่รูปแบบการนำเสนอใหม่ ๆ ที่เป็นมิตรกับทุกคน
.
โดยมีผู้ดำเนินรายการหลัก 2 คนคือ
.
"เปรม BorntoDev" ผู้ชื่นชอบ และ หลงไหลด้านวิทยาศาสตร์ เทคโนโลยี รวมถึงการพัฒนาโปรแกรมเป็นชีวิตจิตใจ มีความสุขมากที่ได้ถ่ายทอด และ แลกเปลี่ยนความรู้ เพราะทำให้นึกถึงสมัยยังเป็นเด็กที่เริ่มต้นเขียนโปรแกรมแล้วได้รับการสนับสนุนจากผู้ใหญ่ใจดีในโลก Internet ที่ไม่เคยเห็นหน้าตากันมาก่อน แต่กลับยินดีแบ่งปันให้กัน
.
"ไกด์ BorntoDev" ชายผู้ที่บอกว่าเป็นพี่น้องกับคนข้างบนหรือเปล่า คำตอบคือไม่ใช่ แต่เขาสนใจด้านเทคโนโลยี การพัฒนาแอปพลิเคชัน ชอบความสนุก จัดกิจกรรม และ ที่ไม่พลาดคือการซื้อเกมมาดองแล้วไม่ได้เล่น เห็นหน้านิ่ง ๆ แบบนี้ดองเกมใน Steam เป็นแสน ๆ นะบอกเลย
.
▲ กิจกรรมใน Channel BorntoDev เป็นส่วนหนึ่งในการดำเนินงานของ บริษัท บอร์นทูเดฟ จำกัด ที่เปิดรับ Partners ที่สนใจร่วมเปลี่ยนแปลงให้สังคมไทยเป็นสังคมด้านวิทยาศาสตร์ และ เทคโนโลยีมากยิ่งขึ้น หากคุณสนใจสนับสนุน และ ก้าวไปพร้อมกัน สามารถติดต่อร่วมงานได้แล้ววันนี้
.
▲ ติดต่อโฆษณา สนับสนุน และ ร่วมงานได้ที่: borntodevth@gmail.com
หลักการใช้ OpenCV ให้แม่นยำเท่าที่ลองนะครับ กล้องที่ถ่ายภาพเก็บไว้ กับกล้องเชื่อมOpenCV ควรเป็นตัวเดียวกัน แบบนี้ใช้แค่ 1 ภาพ/คน ก็แม่นสุดๆ ผมลองกับนักเรียน 30 คน วิ่งเข้าวิ่งออกไม่มีผิดพลาด อ้อแล้วก็สอนให้ Open CV แสดงผลเป็นภาษาไทยได้ จะเป็นประโยชน์มากครับ
ลองดูแล้วครับ ไม่ขึ้นอะไรเลยครับ ขึ้น โหลดเสร็จแล้ว แต่ไม่มีรูปขึ้นมาครับ ใช้ Live Server ครับ
ขอบคุณมากครับ ความรู้ดีๆ
ถ้าเปลี่ยนจากใบหน้าเป็นสิ่งของได้ไหมคับ
สามารถเเก้โค้ดเป็นรูปคนอื่นได้ไหมคะ ทำไมเป็นทำเป็นรูปคนอื่นเเต่ยังขึ้นชื่อลิซ่าอยู่คะ พอจะมีวิธีเเก้ไหมคะ
ผมกำลังทำ face-detection ionic หรือ Angular มีตัวอย่างให้บ้างครับ ช่วยที่ครับ
สามารถเอาไปใส่กับwordpress ได้ไหมครับ
เรียกไฟล์จากในเครื่องยังไงครับ
อยากให้ทำแบบจักการเคลือนไหวอะคับ
เดี๋ยวลองดูให้นะคร้าบบ :D
คือ อยากให้อธิบายเรื่องนี้ครับบ แต่เป็นแบบไม่ใช้ Server แล้วเรียกไฟล์ให้มันจำหน้าจาก local file แทน อะครับ
ถ้าโปรแกรมคุณรันอยู่บน server ไฟล์ที่ user อัพโหลดเข้ามาใน server มันก็คือ local file ในโปรแกรมของคุณครับ ถ้าคุณเก็บภาพนั้นไว้ใน server ก็สามารถเข้าไปอ่านมาใช้ได้โดยตรงเลย
แต่ถ้าหมายถึงว่าอยากจะเขียนเป็นโปรแกรมรันในคอมทั่วไป ลองเปลี่ยนไปเขียนด้วย python ดูครับ เขียนง่ายกว่านี้อีก และมีคนทำไลบารี่เอาไว้ให้เยอะมาก ลองหาใน google ดูนะ
ขอเมลติดต่อ หรือเฟสบุ้คน่อยได้ไหมครับ
ทำไมทำแล้วมันไม่ขึ้นรูปเลยหรอครับ ตอนใส่รูป
ถ้าอยากเอารูปตัวเองมาทำ ล่ะครับ
ขออนุญาติ "ตำหนิ" หน่อยนะครับ
1. ผมเข้าใจแหละว่า คุณต้องการให้คนดูไม่ถอดใจก่อนเรียน ก็เลยใช้คำว่า "ง่ายที่สุด" หรือ "เสร็จในไม่กี่นาที" ซึ่งจริงๆ แล้วมันไม่ได้เป็นแบบนั้นเลย
คุณอาจจะเขียนโปรแกรมตัวอย่างนี้ให้ดูเสร็จภายในไม่กี่นาทีก็จริงแหละ แต่โปรแกรมนี้มันยังไม่ไกล้เคียงกับคำว่า "ใช้งานได้จริง" เลยครับ เพราะอะไร? ตามอ่านข้อต่อไปก็จะเข้าใจเองครับ
.
2. ความแม่นมันไม่ได้วัดแบบนั้น ไม่ใช่ว่าคุณเทรน 4 คนนี้ แล้วเอาภาพ 4 คนนี้มาทดสอบ ถ้าโปรแกรมบอกได้ถูกก็คือว่าแม่น ฟังดูเหมือนจะใช่ แต่ถ้าจะเอาไปใช้งานจริง "ความแม่น" มันไม่ได้วัดแบบนี้
วิธีการวัดก็คือ ไปเอารูปใครก็ได้หลายๆ คนมาสัก 100 รูป (รวมทั้งรูป 4 คนที่เทรนนี่ด้วย) แล้วค่อยทดสอบดูว่า จำนวนที่มันบอกถูกเท่าไร บอกผิดเท่าไร แล้วค่อยคิดออกมาเป็น % แบบนี้ถึงจะบอกได้ว่ามันแม่นยำแค่ไหน
.
3. ตอนที่คุณสรุปท้ายคลิป เรื่องวิธีการเพิ่มความแม่นยำ ผมว่าคุณพูดถูกแค่ครึ่งเดียวนะ คือการเพิ่มจำนวนภาพ อาจจะช่วยเพิ่มความแม่นยำได้ก็จริง แต่มันไม่ใช่ปัจจัยหลัก
ปัจจัยหลักคือ วิธีการที่ใช้ในการจดจำใบหน้าครับ หรือพูดง่ายๆ ก็คือ อัลกอริทึมของโปรแกรม ซึ่งมันมีอยู่เยอะมาก แล้วถ้าคุณใช้อัลกอริทึมที่ไม่ดี ต่อให้เพิ่มภาพเข้าไปมากแค่ไหน มันก็ไม่แม่นยำขึ้นหรอก
.
แล้วปัญหาจริงๆ ของการเขียนโปรแกรมจดจำใบหน้า อยู่ตรงไหนละ
ปัญหาหลักเลยก็คือ ความแม่นยำนั่นแหละครับ อย่างในวีดีโอนี้ ผมเห็นผลรันออกมา ตัวเลขความแม่นยำไม่ถึง 50% เลยด้วยซ้ำ ถ้าลองเอาไปใช้งานจริง คงไม่ต่างจากการสุ่มเดาคำตอบ
แล้วจะทำยังไงให้มันแม่นยำขึ้นละ นั่นแหละครับคือปัญหาและความยาก
- ถ้าเกิดคุณเพิ่มจำนวนรูปภาพแล้ว แต่มันยังไม่แม่นยำขึ้นละ จะทำยังไง เพิ่มต่อไปเรื่อยๆ เหรอ
- หรือจะเข้าไปดูการทำงานในฟังก์ชัน api ที่เขาให้มา เผื่อจะแก้ให้มันแม่นยำขึ้นได้ แต่มันไม่มีบอกหรอกนะว่าแก้ตรงไหนถึงจะแม่นยำขึ้น หรือบางทีต่อให้คุณแก้ทั้งหมดในนั้น มันก็ไม่แม่นยำขึ้นหรอก
- เปลี่ยนไปใช้วิธีใหม่ ก็เป็นอีกตัวเลือกหนึ่ง แต่จะหาเจอวิธีที่ใช้งานได้ไหม นั่นก็คือเรื่อง หรือแม้กระทั้งว่ามันจะมีวิธีที่ใช้งานได้จริงไหมรึเปล่าก็ยังไม่รู้
(งานวิจัยเรื่องจดจำใบหน้านี่เขาวิจัยกันมาเป็น 10-20 ปีแล้วครับ แต่จนถึงปัจจุบัน ก็ยังไม่มีวิธีไหนที่แม่นยำพอจะใช้ได้จริงเลย ไม่งั้น iphone ก็คงไม่หันไปใช้การจดจำใบหน้าแบบ 3 มิติแทนหรอก)
.
ดังนั้น ถ้าจะเขียนแค่ให้มันรันได้ มันก็ใช้เวลาไม่นานเหมือนที่คุณพูดในวีดีโอนี้นี่แหละ
แต่ถ้าอยากจะให้มันใช้งานได้จริง ต่อให้คุณใช้เวลาเพิ่มขึ้นอีกพันเท่า ก็ยังไม่รู้ว่าจะทำได้ไหม
จึงอยากให้สรุปให้ชัดเจนด้วยว่า "ง่ายที่สุด" นี่คือส่วนไหน แล้วส่วนที่ยากมันคือส่วนไหน ไม่งั้นจะกลายเป็นว่า...
"อ้อ...โปรแกรมจดจำใบหน้าเลย ง่ายๆ เองหนิ ใครๆ ก็เขียนได้" แต่ไม่มีใครทำออกมาใช้ได้จริงสักคน
ขอบคุณสำหรับความคิดเห็นนะครับ :) สำหรับจุดประสงค์ในวีดีโอตอนนี้ไม่ใช่เพื่อให้นำไปใช้ได้เลย หรือ Commercial Use นะครับ แต่เป็นเพื่อให้เห็นถึงภาพรวมว่า การทำโปรแกรมในลักษณะดังกล่าวมีขั้นตอนหลัก ๆ อะไรบ้าง ให้คนทั่วไปรู้ว่าต้องนำเข้าภาพตัวอย่างก่อนนะถึงสามารถพอที่จะแยกได้ และ ให้ได้แรงบันดาลใจในการศึกษาต่อครับ
ดังนั้นแล้วจากจุดประสงค์ข้างต้นเราเลยจึงเลือกใช้ Library / API สำหรับการประมวลผลรูปภาพด้วย JavaScript ที่มีอยู่แล้วเพื่อแสดงให้เห็นถึง 2 สาระสำคัญก็คือ
1. JavaScript ที่ก่อนหน้านี้ถูกใช้งานแค่การทำงานง่าย ๆ ฝั่ง Front-End ตอนนี้ไปถึงไหนแล้ว
2. ให้เข้าในถึงกระบวนการภาพรวมของการทำงาน Face Recognition ว่าจะต้องรวบรวม หรือ ติด Tag ข้อมูลแบบไหนให้คอมพิวเตอร์เขาพอจะเข้าใจได้ก่อน
เพราะอย่างที่คุณ Kritthanit ทราบดีว่าภายใน 10 - 20 นาทีเราไม่สามารถอธิบายทุกเรื่องใน Image Processing และ Image Recognition จนถึงสามารถเขียน Algorithm ด้วยตัวเองในเวลาเท่านี้ได้ครับ ทำให้เนื้อหาในคลิปนี้เน้นไปกรณีสรุป และ เปรียบเปรยมาเพื่อให้คนทั่วไปสามารถย่อยได้ง่ายเพื่อให้ผู้รับชมสามารถนำไปเป็นไอเดียในการต่อยอดของตัวเองได้ครับ :-)
เเล้วถ้าให้เปรียบเทียบว่า รูปสองรูป คนยืนท่าเดียวกันหรือไม่ จะต้องศึกษา machine learning ด้านไหนครับ
โจทย์นี้จะง่ายหรือยาก ขึ้นอยู่กับนิยามของคำว่า "ท่าเดียวกัน" ครับ คือแบบไหนที่เรียกว่าท่าเดียวกัน ต้องเหมือนกันเป๊ะๆ เลยไหม ต่างกันแค่ไหนถึงจะบอกว่าเป็นคนละท่า อันนี้คือแบบยาก
ถ้าแบบง่ายก็ กำหนดขอบเขตงานมาก่อนว่าคุณจะวิเคราะห์ท่าไหนบ้าง อย่างเช่นเอาแค่ 2 ท่า คือ ยืนกับนั่งก็พอ แล้วแยกแยะด้วยการวัดความสูงของ object
ตัว object detector ของคน มีคนทำไว้อยู่แล้วครับ หาโหลดมาใช้ได้เลย (ผมแนะนำของ CoCo นะ)
แต่ตัว detector ของคนนั่งนี่ไม่แน่ใจว่า ใช้ได้กันได้รึเปล่า ถ้าใช้ได้ก็จบ แต่ถ้าใช้ไม่ได้ก็ต้องทำเองครับ ก็จะยาวไปอีก ต้องไปศึกษาพวก Cascade object detection
ถ้าอยากให้แยกผลไม้บ้าง ต้องทำยังไงคะ
ถ้าให้สรุปสั้นๆ ก็คือ ต้องทำการ Classify ครับ (หรือพูดเป็นภาษาไทยก็คือ การแยกประเภทนั่นแหละ)
แต่มันไม่ได้ง่ายๆ สั้นๆ เหมือนในวีดีโอนี้หรอกนะครับ ในวีดีโอนี้เขาใช้ไฟล์ที่เทรนเสร็จแล้ว ฟังก์ชันที่มีคนทำเอาไว้แล้ว เอามาเขียนให้ดู มันก็เลยดูเหมือนง่าย ทำได้เร็ว
แต่ถ้าจะเอาไปแยกผลไม้ ก็ต้องเริ่มจากทำโปรแกรมตรวจจับผลไม้ก่อนว่าอยู่ตำแหน่งไหนในภาพ แล้วค่อยมาทำโปรแกรมแยกประเภท
สรุปคือ ยาวครับ ถ้าอยากทำเพื่อใช้งานจริงๆ ก็ inbox มาหาผมละกัน
ถ้าอยากลองใช้ JavaScript อยู่แนะนำให้ลองดู TensorFlow.js ได้ครับ ส่วน Data Set เกี่ยวกับผลไม้ แอดแนะนำ Fruits 360 ครับ
ตัวนี้จะมี ภาพทั้งหมด 90,483 ภาพ จากผลไม้ และ ผัก 131 ชนิดครับ ^^
ศึกษาเพิ่มเติมได้ที่นี่เลยนะครับ
hackernoon.com/tensorflow-js-real-time-object-detection-in-10-lines-of-code-baf15dfb95b2
ผมทำตามแล้วมัน เป้นหน้าว่างเปล่า เพราะอะไรครับ รบกวนแนะนะหน่อย
ลองใช้ผ่าน Live Server ดูนะครับ :)
@@borntodev ผมใช้ apserv รัน php ครับ แต่ไม่ได้ ลองลง server ในเวปจริงด้วย ก้อไม่ได้
โปรแกรมนี้ ดีสุดแล้วใช้มั้ยครับ
ยังห่างไกลครับ
สอนface reconizes pythone เถอะครับ
น่าสนใจครับ :)