UI.Vision RPA – Robotic Process Automation
เจ้า UI.Vision มันทำหน้าที่เหมือนเป็น BOT ตัวนึงที่จะทำงานซ้ำๆ ให้เรา ตามที่เราต้องการ เช่นการลงงาน nft ที่เป็นงานแบบ Generate มีหลายร้อยหลายพันรายการ ตัว UI Vision มันสามารถทำงานให้เราแบบ Automation ได้ครับ ทุ่นแรงและเวลาไปได้เยอะเลย การออกแบบคำสั่ง หรือขั้นตอนที่จะบอกให้มันทำตามก็ไม่ได้ยาก และไม่จำเป็นต้องมีความรู้เรื่องการเขียนโปรแกรม หรือ coding ใดๆ แค่รู้ว่าต้องจัดการอะไร ตรงไหนบ้าง เราก็สามารถสร้าง BOT ขึ้นมาใช้งานได้แล้ว ที่สำคัญคือมันทำงานบนเครื่อง Mac OS ได้เป็นอย่างดีเลย การทำงานของมันก็อย่างที่ได้รับชมไปในคลิปวีดีโอที่หัวเรื่องนั่นแหละครับ
โดยปกติแล้วเจ้า UI.Vision เนี่ยสามารถที่จะใช้งานได้ฟรีครับ แต่การใช้งานในรูปแบบของเรามันจำเป็นที่จะต้องใช้ Feather หรือ function ที่ต้องเสียเงิน เพราะตัวที่เค้าปล่อยให้เราใช้ฟรีมันจะสามารถใช้งานคำสั่งพิเศษได้แค่วันละ 25 คำสั่งเท่านั้น อย่างตัวอย่างที่ผมให้ดูในคลิปนั้น แค่รัน 1 process หรือลงงาน 1 ชิ้นใน Paras.id เราก็จะใช้คำสั่งพิเศษนี้ไปแล้ว 8 ครั้งด้วยกัน นั่นหมายความว่าเราจะลงงานได้ประมาณ 3 ชิ้นงาน ต่อวันเท่านั้นเอง
ดังนั้นเรามีความจำเป็นต้อง upgrade ตัว Modules ที่ทางเว็บเรียกว่า XModules ซึ่งเป็นเหมือน plugin เพิ่มความสามารถให้กับ UI.Vision มีความสามารถมากขึ้นจากเดิม ตัวที่เราจ่ายเงินเราจะได้ตัว XModules Pro มานะครับ จ่ายครั้งเดียวในราคา $89 หรือคิดเป็นเงินไทยประมาณ 3,000 บาท ซึ่งก็แพงเอาเรื่องเหมือนกัน ยังไงก็ลองตัดสินใจกันดูนะครับว่ามันคุ้มกับการลงทุนไหม
ส่วนตัวผมใช้งานมา 3 ปีแล้ว มันสามารถทำงานซ้ำๆ ไม่ว่าจะเป็นการลงรายการสินค้า บันทึกหน้าจอ เก็บข้อมูลที่เราต้องการ งานที่ต้องทำซ้ำๆ ทีละเยอะๆ ช่วยประหยัดเวลาได้เยอะเลยหละครับ พลิกแพลงได้หลายกระบวนท่า และก่อนหน้านี้ผมก็ใช้งาน UI.Vision RPA ในการลงรายการงาน NFT บน Opensea ด้วยเหมือนกัน
เรามาเริ่มขั้นตอนการทำงานของตัว UI.Vision RPA กันหน่อยดีกว่าครับ
1. การติดตั้ง UI.Vision RPA
เริ่มต้นติดตั้ง UI.Vision RPA ซึ่งจะเป็น Extension ที่ติดตั้งบน Chrome หรือ Firefox ส่วนตัวผมใช้ Chrome นะครับ และในตัวอย่างวันนี้ก็จะเป็นการทำงานจาก google chrome เริ่มการติดตั้งจากเว็บไซต์นี้ได้เลย https://ui.vision
หลังจากนั้นก็ทำการติดตั้ง Plugin ตัว XModules โดยการดาวน์โหลดมาไว้ในเครื่องแล้วคลิ๊กเพื่อติดตั้งนะครับ https://ui.vision/rpa/x
**สำหรับการใช้งานบน Mac อย่าลืมกด permission ให้กับ UI Vision ของเราก่อนด้วยนะครับ
2. เริ่มต้น Record คำสั่งการทำงาน
เริ่มใช้งานครั้งแรก ให้เราคลิกเปิด UI.Vision RPA จาก icon สีฟ้า ในส่วนของ Extension Chrome จะได้หน้าต่างโปรแกรมหน้าตาตามรูปครับ
จากนั้นก็คลิกสร้างไฟล์ใหม่ของเราขึ้นมาก่อนนะครับที่ปุ่ม +Macro ด้านซ้ายบน จัดการตั้งชื่อให้เรียบร้อย ไฟล์ใหม่เราจะไปแสดงอยู่ที่ด้านซ้ายมือ
ทีนี้เราจะทำการ Record หรือบันทึกสิ่งที่เราต้องการให้ Bot ทำให้เราก่อนนะครับ เหมือนเป็นการสร้างเส้นทางตัวอย่างให้ Bot ของเราเดินตาม โดยการที่กด Record ที่หน้าต่าง UI.Vision จากนั้นเราก็จะมาที่หน้าต่าง Chrome ที่เปิดหน้าเว็บ Paras.id อยู่และคลิ๊กไปตามสิ่งที่เราอยากให้มันทำ อย่างที่เรากำลังทำอยู่เป็นการลงงาน nft เราก็จะทำการคลิก add card จากนั้นก็เลือก Collection ตามด้วยเลือกรูปงานเราในเครื่อง และทำเป็นขั้นตอนต่อไปเรื่อยๆ เพื่อให้ Bot สร้างเป็นคำสั่งเอาไว้ใช้ในขั้นตอนต่อไป พอทำครบขั้นตอนที่ต้องการแล้วให้เราไปกด stop เพื่อหยุดการ Record และเราจะได้คำสั่งมาชุดนึง
สำหรับใครที่เข้ามาอ่านอยากใช้งาน UI.Vision สำหรับทำ automation กับเว็บอื่นๆ ก็สามารถทำขั้นตอนแบบเดียวกันนี้ได้เหมือนกันนะครับ
หลังจาก Record เสร็จ เราจะทำการปรับแต่ง คำสั่งหรือ Command บางรายการ ให้สามารถกรอกข้อมูลที่เราต้องการจากฐานข้อมูลที่เรามี เพราะแต่ละรายการของงาน Nft ของเราจะมีข้อมูลที่ไม่เหมือนกัน เช่น ชื่อชิ้นงาน รายละเอียด และ Attributes ต่างๆ ซึ่งข้อมูลพวกนี้เราสามารถใส่เอาไว้ในรูปแบบของไฟล์ CSV ซึ่งจะพูดถึงกันในหัวข้อต่อไป และอีกเรื่องคือการใช้งาน xmodules สำหรับคำสั่งพิเศษเช่นการ browse ไฟล์รูปที่อยู่ในเครื่อง และการสั่งกด enter เพื่อเป็นการเลือก หรือยืนยัน ในบางหน้าต่าง ซึ่งเราจะต้องปรับตรงนี้เอง เดี๋ยวค่อยๆ ดูไปทีละอย่างนะครับ ไม่ยากๆ
3. การสร้างไฟล์ข้อมูล csv
ง่ายสุดคือการสร้างจาก Google Sheet เปิด google sheet ขึ้นมาและใส่ข้อมูลของชิ้นงาน nft ของเรา 1 แถว คือ 1 รายการ จะมีข้อมูลอะไรบ้างก็ใส่ไปได้เลยไล่เรียงไปทีละ column จากซ้ายไปขวา เรียงตามข้อมูลที่เราต้องกรอก จากนั้นทำการ export ออกมาเป็น csv (File > Download > Commo Separated Values (.csv) ) เก็บเอาไว้ในเครื่องก่อน
จากนั้นกลับมาที่ Command คำสั่งของเรา ให้เราเพิ่มคำสั่งในบรรทัดแรกโดยการกด + และเลือก command เป็น csvRead ส่วนช่องที่สองใส่ชือไฟล์ csv ของเราที่โหลดมาไว้ในเครื่องในขั้นตอนก่อนหน้านี้
จากนั้นไปที่ Tab CSV ข้างล่าง กด Import CSV และเลือกไฟล์ csv ของเราใส่เข้าไป
ทีนี้เราก็จะมาใส่ Token หรือตัวแปรที่จะเป็นตัวกลางในการอ้างอิงข้อมูลในไฟล์ csv เข้าไป ลักษณะ Token จะเป็นรูปแบบนี้ครับ
${!COL1} ซึ่งหมายความว่า เป็นการดึงข้อมูลจาก column 1 ในไฟล์ข้อมูล CSV ที่เราทำเอาไว้ ถ้าเป็น
${!COL2} ก็หมายความว่า ให้ดึงข้อมูลจาก column ที่ 2 มาใส่
${!COL3} ก็หมายความว่า ให้ดึงข้อมูลจาก column ที่ 3 มาใส่
มีข้อมูลกี่ตัวก็ไล่เรียงไปตามนั้นเลยครับ ก็จะเป็น ${!COL4}, ${!COL5} ….. ไปเรื่อยๆ
เอาตัวแปรหรือ Token มาใส่แทนข้อมูลที่เราต้องการจะเปลี่ยนในแต่ละ command สำหรับตัวอย่างในรูปข้างล่าง เป็นการกรอกข้อมูล Title ให้กับงาน nft เรา ผมก็จะเอาตัวแปร ${!COL1} ไปใส่ไว้ที่ Value แทนค่าเดิมที่เรา Record มาตอนแรก
4. การปรับแต่งและแก้ไข Command หรือคำสั่ง Bot
สำหรับการแก้ไขคำสั่งหลังจากที่เราได้ทำการสร้าง Record หน้าเว็บมาแล้ว เราจะแก้ไขในบาง command นะครับ ไม่ได้แก้ทั้งหมด หลักๆ คือการแทนค่าจากไฟล์ข้อมูล csv ของเราให้สามารถแทนค่าเข้ามาใน Bot ได้ และการเปลี่ยนคำสั่งบางจุดให้เป็นคำสั่งแบบ XModules เพราะมีการเปิดหน้าต่าง Browse file รูปในเครื่อง และคำสั่งกด Enter เพื่อยืนยันการทำงาน จากตัวอย่างของเราวันนี้ในการลงงาน NFT ใน Paras.id จะมีที่ต้องแก้ไขตามรูปนี้ครับ
การใช้งาน XModules
การใช้งาน xmodules ส่วนใหญ่จะมีหลักๆ 2 คำสั่งนะครับ (คือผมใช้เท่านี้ก็จะขอแชร์ในส่วนที่ผมรู้เท่านั้นนะครับ) นั่นคือ xclick, xtype ตรงนี้ให้คิดแบบนี้นะครับว่า จุดไหนที่ต้องเปิดหน้าต่างมาทำงาน เช่นการ browse file หารูป เราจะต้องใช้คำสั่ง xclick และตรงไหนที่เป็นหน้าต่างแล้วเราต้องกรอกข้อมูลลงไป หรือต้องใช้ keyboard เช่นสั่งกด Enter เราจะต้องใช้คำสั่ง xtype ดูตัวอย่างประกอบนะครับ
นอกจากนั้น xclick เรายังใช้กับเรื่องนี้ด้วยครับ คือหลายๆ ครั้งที่เรา record คำสั่งเนี่ย ปุ่มบางปุ่มในเว็บมันอ้างอิงไม่ได้ คือมันมีแต่ command แต่ไม่มี Target ติดมาด้วย ตัวอย่างเช่นปุ่ม + ใน paras.id ที่เราต้องกดมันเพื่อเพิ่ม Attributes งานนี่แหละครับ ตอนเรา record มาเนี่ยช่อง target มันว่างเลย นั่นหมายความว่า command นี้ไม่สมบูรณ์ตอนที่เรารันให้มันทำงาน มันจะทำงานคำสั่งนี้ไม่ได้ครับ เราจะใช้ xclick แล้วกดเลือกรูปตา select เพื่อทำการ capture พื้นที่ที่เราต้องการให้มันคลิกได้เลย ประมาณว่าบอกให้มันรู้เป็นรูปภาพไปเลยครับว่าจะให้มันคลิกตรงไหน โคตรเจ็งเลยฟังชั่นนี้
จากภาพบน ตอนที่เรา Record จะเห็นว่าตรงปุ่ม + ที่จะเพิ่ม Attributes ใน Paras.id ตรง Target ไม่สามารถ Track ได้ซึ่งเราจะเห็นได้ว่ามันโล่งอยู่ในตัวอย่างบรรทัดที่ 14 เราต้องใช้ Xmodules เข้ามาช่วย โดยการเปลี่ยนคำสั่งหรือ Command จาก Click เป็น XClick จากนั้นไปคลิ๊กที่ Select เพื่อเลือก capture พื้นที่ที่เราต้องการให้เม้าส์ไปคลิ๊ก ดูภาพประกอบนะครับ
คำสั่งพิเศษที่ควรเพิ่มเข้าไปเพื่อให้การทำงานลื่นไหลไม่หลุด
คำสั่งที่ผมจะบอกต่อไปนี้ก็คือคำสั่งที่เกี่ยวกับการหน่วงเวลาครับ เวลาที่เว็บทำงานบางทีมันก็จะช้าจะเร็วในแต่ละช่วงเวลาแตกต่างกัน บางทีเว็บช้าบ้าง โหลดไฟล์ช้าบ้าง Bot เรามันก็ทำงานข้ามขั้นไปก่อนอะไรแบบนี้ ทำให้ loop ของเราพัง ต้องมานั่งตามแก้ไข เราสามารถป้องกันปัญหานี้ได้โดยการหน่วงเวลาเอาไว้ในขั้นตอนที่เราคิดว่าต้องให้เวลากับมันสักหน่อย เป็นคำสั่งง่ายๆ สั้นๆ ครับ “Pause”
สำหรับคำสั่ง Pause จะมี 2 แบบ แบบแรกคือถ้าเราใส่ pause ไปเฉยๆ ไม่ระบุ target เนี่ยมันคือการสั่งให้หยุดทำงาน แต่ยังอยู่ใน loop ทำงานนะครับ เหมือนเรากด pause ตอนดูซีรี่ย์นั่นแหละครับ เราต้องไปกด Resume มันก็จะทำงานในขั้นตอนต่อไปตาม loop ที่เหลือ ส่วนแบบที่สองคือระบุ target เป็นตัวเลข เช่น 1000,3000,5000 ซึ่งก็หมายถึงการหน่วงเวลา 1 วินาที, 2 วินาที, 5 วินาที ตามลำดับ พอ loop มาถึงคำสั่งนี้ มันจะหน่วงเวลาเอาไว้ตามที่เราระบุครับ แล้วพอครบตามเวลามันก็จะทำงานในคำสั่งต่อไปตาม loop
สำหรับตัวอย่างที่เราทำอยู่นี้ผมจะใส่เพิ่มเข้าไปตามนี้ครับ
5. ทดลอง Run คำสั่งที่เราสร้าง
ก่อนที่เราจะทดสอบ Run คำสั่ง ให้เรากด icon เครื่องหมาย // ที่บรรทัดสุดท้าย หรือคำสั่งยืนยันการเพิ่มรายการ nft ก่อนนะครับ สำหรับตัว // เนี่ยก็คือการที่เราบอกคำสั่งในบรรทัดนั้นๆว่าไม่ต้องทำงานให้ข้ามไปได้เลยอะไรแบบนี้ ที่ต้องทำแบบนี้เพราะเผื่อเอาไว้ก่อนว่าการ Run ครั้งแรกของเราอาจจะมีอะไรที่ไม่สมบูรณ์ เราจะได้แก้ไขได้ทัน อีกอย่างคือเว็บ Paras.id ถ้าเรากดยืนยันไปแล้วมีอะไรไม่ถูกต้องบางทีเราจะกลับไปแก้ไขลำบากหรือแก้ไม่ได้นะครับ..
ทีนี้เราก็พร้อมที่จะทดสอบ Run การทำงานแล้วครับ คลิ๊กที่ปุ่ม Play Macro ได้เลย
สามารถ Copy Code ของผมไปลองใช้งานได้
ถ้ายังงงๆ สามารถดาวน์โหลด code UI.Vision ของผมไปลองใช้งานได้นะครับ ผมทำ comment กำกับบอกเอาไว้ในแต่ละคำสั่งด้วยจะได้ดูง่ายๆ ว่าเป็นคำสั่งอะไร
หลังจากดาวน์โหลด Code มาแล้วให้ไปสร้างไฟล์ใหม่ก่อนที่ icon +Macro จะได้ไฟล์ว่างๆ มา 1 อัน จากนั้นให้ไปที่ tab Source View (JASON) แล้วทำการ copy code จากไฟล์ที่ผมให้ดาวน์โหลดมาแปะ หรือ paste ไว้ในช่องนี้ได้เลยครับ จากนั้นพอเรากด tab กลับมาที่ Table View เราจะได้คำสั่งต่างๆ มาเรียบร้อย หลังจากนั้นก็แก้ไขตาม comment ที่ผมกำกับไว้ให้ได้เลยครับ ดาวโหลด code ที่นี่
เป็นยังไงบ้างครับ งงกันไหม ต้องบอกว่าการเขียนอธิบายการทำงานโปรแกรมเป็นอะไรที่ค่อนข้างยากสำหรับผมเอาเรื่องเลย จริงๆ ผมน่าจะทำเป็นคลิป VDO ไปซะแต่แรก น่าจะง่ายกว่า ถ้าอ่านแล้ว ทำตามแล้วยังงง หรือติดอะไรตรงไหนก็คอมเมนต์สอบถามกันมาได้นะครับ คิดว่าคงจะมีเป็นคลิปสอนให้ดูได้เร็วๆ นี้ .. 😊