แค่ขีดเขียนบนกระดาษ ก็ออกมาเป็นหน้าเว็บได้ ด้วยเครื่องมือฟรีใหม่ของไมโครซอฟต์

เครื่องมือใหม่ "Sketch2Code" ( สเกตช์ทูโค้ด ) ใช้ฟรีๆ โดยผู้ใช้งานแค่ใช้ปากกาหรือดินสอร่างวาดรูปหน้าเว็บที่ต้องการบนกระดาษ แล้วสแกนหรือถ่ายรูปส่งขึ้นไป แล้วผลลัพธ์ก็จะออกมาเป็นโค้ด HTML ตรงหรือใกล้เคียงกับที่ร่างไว้

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

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

ซึ่งบางครั้งเมื่อทำออกมา ก็อาจจะคลาดเคลื่อนไปจากที่ตั้งใจไว้  และที่สำคัญคือก็มีค่าใช้จ่ายเพิ่มขึ้นในกรณีที่จ้างคนนอก

 

ล่าสุดไมโครซอฟต์จึงออกเครื่องมือใหม่ “Sketch2Code” ( สเกตช์ทูโค้ด ) ในเว็บ  sketch2code.azurewebsites.net  ให้ใช้ฟรีๆ โดยผู้ใช้งานแค่ใช้ปากกาหรือดินสอร่างวาดรูปหน้าเว็บที่ต้องการบนกระดาษ  แล้วสแกนหรือถ่ายรูปส่งขึ้นไป  แล้วผลลัพธ์ก็จะออกมาเป็นโค้ด HTML ตรงหรือใกล้เคียงกับที่ร่างไว้

เบื้องหลังการทำงานของระบบนี้เป็น AI ที่ทีมงานไมโครซอฟต์ “เทรน” ให้เรียนรู้การวาดลายเส้นของคนเฉพาะที่เป็นการวาดองค์ประกอบพื้นฐานในหน้าเว็บ

ตัวอย่างเช่น กรอบสำหรับรูป, หัวข้อ, ช่องคำบรรยาย,  และส่วนต่างๆในแบบฟอร์ม เช่น text box (ช่องข้อความ),  check box (ช่องติ๊กถูก), select (กล่องตัวเลือกดึงลง), option (จุดตัวเลือก), ฯลฯ

แล้วซอฟต์แวร์ AI ก็จะช่วยแปลงลายเส้นจากมือเราที่วาดสิ่งเหล่านี้  ให้กลายเป็นโค้ด HTML จริงๆ  ดดยเราไม่ต้องนั่งพิมพ์หรือใช้โปรแกรมใดๆสร้างขึ้นเองเลย

 

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

แต่ก็แน่นอนว่า หลังจากได้องค์ประกอบทั้งหมดนี้แล้ว ก็ถือว่างานก็ยังเพิ่งเริ่มต้นเท่านั้น  …เพราะก็ไม่พ้นยังต้องไปลงโลโก้, ออกแบบสีสัน, สร้างดีไซน์ของแบรนด์ที่อยู่รอบๆต่อไป …และที่สำคัญคือก็ยังต้องไปเขียนโค้ดโปรแกรมต่อ รวมถึงสร้างฐานข้อมูลมาทำงานรองรับกันต่อไปด้วย

 ข่าวจาก :

  azure.microsoft.com/en-us/blog/turn-your-whiteboard-sketches-to-working-code-in-seconds-with-sketch2code

 

  ailab.microsoft.com/experiments/30c61484-d081-4072-99d6-e132d362b99d

You may be interested in

Latest post from Facebook