Drag Drop Room

Let's find our application
















Objective



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





Design & Methods





แบ่งเป็น 3 ส่วน

  • User Interface (UI)
    เป็นส่วนที่แสดงให้ผู้ใช้เห็น และสามารถเลือกจัดวางเฟอร์นิเจอร์ต่าง ๆ ตามต้องการโดยใช้มือทำท่าต่าง ๆ ตามที่กำหนดไว้ แล้วกล้องจะประมวลผลผ่านกระบวนการ Computer Vision และ Application แล้วแสดงออกทาง User Interface

  • Hand Detection
    เป็นส่วนที่ทำการตรวจว่ามืออยู่ตำแหน่งไหน โดยรบ input เป็น ภาพ ผ่านทางกล้อง แล้วใช้ Background Subtraction ตัดพื้น และใช้ YCbCr จับมือด้วยสี นำมารวมกันจนสามารถ track มือได้ เพื่อใช้หาตำแหน่งของมือผ่านกล้อง

  • Hand Gesture
    เป็นส่วนที่ใช้ประมวลผลว่ามือที่อยู่ในรูปเป็นท่าอะไร โดยใช้ตำแหน่งของนิ้วมือวัดว่าอยู่ในท่าไหน โดยมีอยู่ 3 ท่า คือ ท่ากำมือ ท่าแบมือ และท่าหยิบ สามารถหาได้จากการหาจุดปลายนิ้ว แล้วนำมา threshold ให้ได้นิ้วที่ไม่ได้กำ (ตัดนิ้วที่กำออกไป) จะสามารถรู้ได้ว่าเป็นท่าไหน





  • Theories & Tecnhiques



    Hand Detection
  • ใช้ background subtraction ในการแยกพื้นหลังกับวัตถุเก็บในภาพแรก
  • จากนั้นทำการ Segment ภาพด้วยสี ระบบ YCbCr ที่ปรับเฉลี่ยความเข้มแสง ได้ output เป็นภาพขาวดำเก็บในภาพอีกหนึ่งภาพ
  • ลบ noise ของภาพทั้งสองด้วยวิธี Gaussian blur , Median blur และ Morphology ตามลำดับ
  • นำ ภาพทั้งสองมา combine กันด้วย operation &
  • ใช้ function findContour เพื่อให้ได้ shape ของมือออกมา
  • หา biggest connected component ได้เป็นมือ
  • หา distance transform ของมือ เพื่อหาจุดศูนย์กลางของมือ
  • ใช้ convex hull จะได้เป็น array of points
  • ใช้ convexity defect เพื่อหาจุดที่อยู่ระหว่างร่องนิ้ว
  • ลบจุดที่ไม่ได้ใช้ออกมา โดยเช็คระยะว่าเกิน Threshold ที่กำหนดหรือเปล่า ถ้าเกินก็ลบทิ้งไป (ได้จำนวนนิ้วที่ชู)



  • Hand Gesture



  • รับ input เข้ามาเป็น จุดศูนย์กลางมือ และอาเรย์ของจุดนิ้วมือ
  • เช็คระยะห่างระหว่างแต่ละจุดนิ้วกับจุดศูนย์กลาง ดูว่าเกินค่า threshold หรือไม่ (เส้นสีม่วงในภาพ) โดยข้อมูลจาก ((finger[i].x - center.x)^2+(finger[i].y-center.y)^2 > Threshold) ถ้าเกิน แสดงว่านิ้วที่ i ชู
  • นับจำนวนนิ้วที่ชูอยู่ 0 นิ้ว ถ้ากล้องจับได้
    0 นิ้ว จะคิดว่าเป็นท่าหยิบดว่าเป็นท่ากำมือ
    1-3 นิ้ว ถ้ากล้องจับได้ 1-3 นิ้ว จะคิดว่าเป็นท่าหยิบ
    3-5 นิ้ว ถ้ากล้องจับได้ 3-5 นิ้ว จะคิดว่าเป็นท่าแบมือ
    ซึ่งหากนิ้วที่นับได้มี 3 นิ้ว จะเป็นไปได้ทั้งทำท่าหยิบและแบมือ จึงต้องทำการเช็คอีกครั้ง ในกรณีที่นับได้ 3 นิ้ว
  • เก็บสถิติล่าสุดของท่า gesture ของ 20 frame ล่าสุดว่าเป็นใดบ้าง แล้วดูว่าใน 20 frame นั้นเป็นท่าใดมากที่สุด ก็ถือว่าปัจจุบันกำลังทำมือท่านั้นอยู่


  • วิธีในการวัด การหมุน



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


    วิธีการใช้งาน Drag Drop Room

    หน้าแรก (menu)



    ประกอบด้วยปุ่ม 2 ปุ่ม คือ ปุ่ม Start และ ปุ่ม Exit
  • Start เป็นปุ่ม link ไปแสดงผลหน้าจอหลักของการทำงานโปรแกรม
  • Exit เป็นปุ่มแสดงผลให้จบการทำงานของโปรแกรม

  • หน้าหลัก (หน้าสำหรับออกแบบห้อง)



    หน้าจอแบ่งเป็น 2 ส่วน คือ
  • ส่วนพื้นที่ห้อง เป็นส่วนที่ใช้ออกแบบ จัดการเคลื่อนย้ายเฟอร์นิเจอร์ให้อยู่ตามรูปแบบที่เราต้องการ
  • ส่วนเสริม เป็นพื้นที่แถบด้านขวามือโดยจะมีเฟอร์นิเจอร์ต่าง ๆ ให้เราสามารถหยิบมาตกแต่งห้องตามที่ต้องการ และฟังก์ชันต่าง ๆ ฟังก์ชัน
         - แถบฝั่งขวาเป็นโซนทิ้งเฟอร์นิเจอร์
         - ล่างขวาเป็นปุ่ม Exit ใช้ออกจากโปรแกรม


  • วิธีการควบคุม (control)
               ใช้มือในการควบคุมแทนเมาท์ โดยการแบมือแล้วเคลื่อนที่แทนการลากเมาท์ไปยังวัตถุหรือตำแหน่งที่ต้องการ และการกำมือแทนการคลิกเมาส์เพื่อลากวัตถุไปในตำแหน่องที่ต้องการจะว่าง แล้วแบมืออีกทีเพื่อวางวัตถุ โดยการควบคุมประกอบด้วยการทำท่ามือดังนี้

    ท่าทางมือ (Gesture)
    ประกอบไปด้วยท่า 3 แบบ

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

    ตัวอย่างวิธีการควบคุมในสถานะการต่าง ๆ (Scenario)

    หยิบเฟอร์นิเจอร์มาตกแต่งเพิ่ม
  • แบมือให้กล้องจับไปที่มือ
  • เลื่อนมือให้จุดบนหน้าจอไปหยุดที่เฟอร์นิเจอร์
  • กำมือค้างไว้เพื่อหยิบเฟอร์นิเจอร์

  • เลื่อนเฟอร์นิเจอร์
  • หลังจากกำมือเพื่อหยิบเฟอร์นิเจอร์แล้ว
  • ให้กำมือค้างไว้แล้วเลื่อนไปตำแหน่งที่ต้องการได้เลย
  • แบมือเพื่อยกเลิกการหยิบเฟอร์นิเจอร์ที่เลือกไว้

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

  • หมุนเฟอร์นิเจอร์
  • ทำมือท่าหยิบค้างไว้ให้กล้อง focus ตรงเฟอร์นิเจอร์ที่ต้องการปรับขนาด
  • พอกล้อง focus แล้ว ให้หมุนมือโดยทำท่าเดิมค้างไว้เพื่อหมุนเฟอร์นิเจอร์ที่เลือกไว้
  • พอเสร็จแล้วให้ค้างทิ้งไว้ 3 วินาที เพื่อแสดงว่าทำเสร็จแล้ว






  • Demo








    Members



    นายชลกานต์ กิจศิริกุล
    5630118321
    นางสาวกรชนก จิรเวศยกุล
    5631001721
    นายธีรัช รักษ์เถา
    5631052721
    นายเวศวรุศ งามดำรงเกียรติ
    5631086021