ก่อนจะเป็นเว็บ OliangTheGoodBoy

ก่อนจะเป็น OliangTheGoodBoy: เว็บของเด็กดำที่แม่ค่อย ๆ สร้างแบบไม่รู้ตัว

ถ้าถามว่า OliangTheGoodBoy เริ่มมาจากไหน แม่ตอบยากเหมือนกันนะ

เพราะมันไม่ได้เริ่มจากวันที่แม่นั่งลงแล้วประกาศว่า “วันนี้ฉันจะสร้างเว็บไซต์!” แบบจริงจังขนาดนั้น แต่มันค่อย ๆ มาจากของหลายอย่างที่แม่อยากทำ อยากเก็บ และอยากแบ่งปันเกี่ยวกับพี่โอเลี้ยง

ช่วงหนึ่งแม่ทำ Operation Good Boy — ทีมกู้ภัยวัยโฮ่ง เป็นเกมการ์ดต้นแบบที่เอาเรื่องสัญญาณความเครียดของสุนัขกับการเลือกวิธีรับมือที่ปลอดภัย มาลองทำเป็นเกมให้เรียนรู้ร่วมกันได้

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

ไม่เป็นไรค่ะ ชีวิตจริงมันไม่ได้สวย ๆ เหมือนใน presentation เนอะ เอาใหม่ 5555

พอดีช่วงเดือน กค. 69 มีโอกาสไปเรียนเรื่อง Agent AI แล้วมันมี Concept ว่าสิ่งที่ควรมีในองค์กรที่อยากสร้าง Agent มาใช้ คือการให้ความสำคัญกับการสร้าง “ห้องสมุดรวมความรู้ขึ้นก่อน” เฮ้ยยย แม่ Love ไอเดียนี้มากกกเลยเป็นที่มาว่าวันหนึ่งแม่บอก ChatGPT ว่า อยากทำเว็บไซต์ OliangTheGoodboy เพื่อเก็บสิ่งที่แม่สะสมไว้ หาใหม่เพิ่มแล้ว แบ่งปันเรื่องของพี่ เกม ไอเดีย ตัวอย่างการฝึก ตารางสำหรับ download และความรู้ที่แม่คิดว่าน่าเชื่อถือ เผื่ออนาคตอาจต่อยอดทำอะไรได้อีก

ตอนนั้นฟังดูเหมือนแค่ “อยากมีเว็บ”

แต่พอลงมือทำจริง มันค่อย ๆ กลายเป็นเรื่องใหญ่กว่านั้นค่ะ

จากเว็บที่อยากใส่ทุกอย่าง สู่เว็บเล็กที่เปิดใช้ได้จริง

ตอนแรกแม่อยากใส่ทุกอย่างลงเว็บเลยค่ะ

มีทั้ง Story, Learn, Train, Play, Behind Oliang, About และ How We Research

ถ้ารอให้ทุกห้องมีเนื้อหาครบ รอให้ความรู้ทุกเรื่องพร้อม รอให้เกมเสร็จ และรอให้แม่อ่านทุกอย่างที่อยากอ่านก่อน…

น่าจะไม่ได้เปิดเว็บกันพอดี อิอิ

เราเลยเปลี่ยนโจทย์จาก “ทำเว็บไซต์ให้ครบ” มาเป็น Minimum Useful Website แบบที่เรียกหรูๆว่า MVP หรือเว็บเล็ก ๆ ที่มีประโยชน์จริงได้ก่อน แล้วค่อยเติมให้โตไปพร้อมกับสิ่งที่แม่เรียนรู้

เลยจบด้วย web ง่ายๆที่มี หน้า Home จึงไม่ได้พยายามเล่าทุกอย่าง แต่ทำหน้าที่พาคนไปยังทางหลัก ๆ อย่าง Story, Learn และ Play กับบทความง่ายๆ 2 บทความในส่วนเนื้อหา ซึ่งกะๆเอาไว้ว่าไม่ทำเป็น blog ที่เรียงตามวันที่อย่างเดียว เพราะแม่อยากให้วันหนึ่งคนเข้ามาหาคำตอบตามคำถามหรือหัวข้อที่เขาสนใจได้ด้วย

นี่เป็นบทเรียนแรกของแม่เลยค่ะ

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

Wix กลายเป็นโต๊ะทำงานของแม่ 👩🏻‍🦱👓💻

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

สิ่งที่แม่อยากเรียนอยากฝึกไม่ใช่แค่วิธีทำให้หน้าเว็บ “ขึ้นได้” แต่คือภาพรวมทั้งหมดว่า เว็บไซต์ที่ดีต้องคิดอะไรบ้าง ตั้งแต่โครงสร้างเนื้อหา CMS การแสดงผลบน desktop/mobile ไปจนถึง SEO, AEO และ UX/UI

Wix ทำให้แม่มองเห็นเรื่องเหล่านี้อยู่ในโต๊ะทำงานเดียวกัน แม่ลองจัดหน้า เชื่อมข้อมูล ดู preview และค่อย ๆ เข้าใจว่าแต่ละส่วนเกี่ยวกันอย่างไร เวลาติดเรื่อง UX/UI ก็ยังเอาภาพหน้าจอไปคุยกับ AI ให้ช่วยวิเคราะห์และเสนอแนวทาง แล้วแม่เป็นคนเลือกว่าจะใช้หรือไม่ใช้ค่ะ 🧐

ถ้าแม่เลือกเครื่องมือที่ต้องพึ่งการเขียนเว็บหรือ coding มากกว่านี้ ทั้งที่แม่เริ่มจากศูนย์ งานอาจกลายเป็นว่าแทนที่จะคุม concept ของ WebOliang แม่ต้องใช้เวลาไปฝึกเขียน code เพื่อให้เว็บทำงาน

แม่อยากเป็นคนคุมภาพรวมและตัดสินใจว่าเว็บควรเป็นอะไร ไม่ได้อยากเป็น programmer จำเป็นค่ะ 😆

เพราะฉะนั้น Wix จึงไม่ได้มีหน้าที่แค่ทำให้แม่สร้างหน้าเว็บได้ แต่มันกลายเป็นโต๊ะทดลองที่ทำให้แม่เรียนรู้ทั้ง content, system, SEO/AEO และประสบการณ์ของคนใช้ไปพร้อมกัน

ส่วน Automation จาก Notion ไป Wix เรายังไม่รีบทำ แม่อยากทำ manual workflow ให้เข้าใจก่อนว่า Collection, Item และ Dynamic Item Page เกี่ยวกันอย่างไร ข้อมูลหนึ่งชิ้นเดินทางไปขึ้นหน้าเว็บตรงไหน และเวลามันไม่แสดงผลควรกลับไปเช็กอะไร

ไม่อย่างนั้นถ้า automate ทั้งที่ยังไม่เข้าใจ workflow พอมันพังขึ้นมา แม่ก็คงได้แต่นั่งมองแล้วถาม AI ว่า

“ตกลงใครทำอะไรหายคะ?” 5555 🤣

ทำให้เว็บโตได้ โดยไม่ต้องสร้างใหม่ทุกครั้ง 🧩

หน้า Home และหน้ารวมแต่ละหมวด แม่ยังออกแบบได้อย่างอิสระ ส่วนบทความที่มีรูปแบบคล้ายกัน เราสร้างหน้าตาต้นแบบไว้ครั้งเดียว แล้วใช้ CMS ของ Wix เปลี่ยนเฉพาะข้อมูลของแต่ละเรื่อง

แปลแบบง่ายที่สุดคือ เวลาเพิ่มบทความ แม่เพิ่มเนื้อหา ไม่ต้องสร้างหน้าเว็บใหม่ตั้งแต่ต้นทุกครั้ง 😊 ข้อมูลต้นฉบับและฉบับที่อนุมัติเก็บไว้ใน Notion จากนั้นผ่าน Publishing Queue เพื่อเตรียมงาน ก่อนนำไปแสดงบน Wix

Notion = บ้านกลาง → Publishing Queue = จุดเตรียมงาน → Wix = หน้าบ้าน

ส่วนวิธีที่แม่ใช้ทีม AI ช่วยกันทำงาน เล่าไว้แล้วในบทความ แม่สร้างทีม AI เล็ก ๆ โดยไม่เขียนโค้ดได้อย่างไร บทความนี้จึงไม่เล่าซ้ำค่ะ

ทดลองเรื่องเดียวให้สำเร็จก่อน แล้วค่อยขยาย

เราเริ่มทดลองด้วยเรื่องแรก เมื่อแสดงผลได้แล้ว จึงลองเปลี่ยนเป็นเรื่องที่สองบนหน้าตาเดิม

ผลคือ…ได้ค่ะ! 🎉

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

รอบแรกมีทั้งภาพตัวอย่างที่ยังไม่เปลี่ยน และเนื้อหาที่ไม่แสดงตามที่คิด แต่ปัญหาเหล่านี้ทำให้เราได้เรียนรู้ระบบทีละจุด

บทเรียนสำคัญคือ ทำวงจรเล็ก ๆ ให้สำเร็จก่อน แล้วค่อยเพิ่มความซับซ้อน

อย่าเพิ่งสร้างบ้านสิบห้อง ถ้ายังเปิดไฟห้องแรกไม่ติดค่ะ 5555

โครงสร้างสำคัญที่ทำให้ WebOliang ไปต่อได้ 🧩

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

ถ้าใครอยากลองทำเว็บหรือ project ของตัวเอง แม่ว่าสิ่งที่ควรมีคือ

1. เริ่มจากของเล็กที่ใช้ได้จริง — ไม่ต้องรอให้ทุกอย่างครบ ค่อย ๆ เปิด Minimum Useful Version ก่อน

2. มีบ้านกลางหนึ่งที่ — เก็บข้อมูล ฉบับจริง และสถานะงานไว้ที่เดียว จะได้ไม่ต้องเดาว่าอันไหนล่าสุด

3. แยกเนื้อหาออกจากหน้าตาเว็บ — ใช้ CMS และ template ช่วยให้เพิ่มเรื่องใหม่ได้ โดยไม่ต้องสร้าง page ใหม่ทุกครั้ง

4. มีทางตรวจและคนตัดสินใจ — AI ช่วยคิด ช่วยทำ และช่วยตรวจเบื้องต้นได้ แต่คนต้องเป็นผู้อนุมัติ

5. ขึ้นเว็บแล้วต้องกลับมาตรวจอีกครั้ง — เช็กหน้า live, link, mobile และ update สิ่งที่เปลี่ยนกลับเข้าบ้านกลาง

ทางเดินแบบง่าย ๆ จึงเหลือประมาณนี้ค่ะ

คิดและวางแผน → เตรียมเนื้อหา → ใส่ CMS → ดู Preview → คนตรวจ → Publish → กลับมาเช็กและปรับ

ไม่ต้องมีชื่อเรียกหรู ๆ ก็ได้ ขอให้ทุกคนรู้ว่า งานอยู่ตรงไหน ใครต้องทำต่อ และเมื่อไรถือว่าเสร็จจริง 😊

เปิดเว็บแล้ว ไม่ได้แปลว่างานจบ

หลังเปิดเว็บ แม่เจอทันทีว่า ของจริงกับสิ่งที่คิดไว้ไม่เหมือนกันทุกอย่างค่ะ 5555

ครั้งหนึ่งแม่แก้ข้อความตรงใน Wix แต่ไม่ได้แก้กลับใน Notion ถ้าเผลอเอาฉบับเก่าไปทับ ข้อความใหม่ก็อาจหายหมด

เราเลยได้กติกาว่า

ถ้าแก้ตรง Wix ต้อง sync กลับ Notion ในรอบเดียวกัน และหลัง Publish ต้อง update ทั้ง Status กับ live URL

พอทำเรื่องที่สอง ระบบเดิมใช้ซ้ำได้ แปลว่า CMS กับ template เริ่มทำหน้าที่ของมันจริง

พอทำเรื่องที่สาม ก็เจอปัญหาใหม่อีก ทั้ง slug ที่ยาว อ่านยาก และสถานะหลังบ้านที่อาจไม่ตรงกับหน้า live

สุดท้ายเราเปลี่ยนมาใช้ English slug ที่อ่านง่าย และเพิ่มการตรวจ link กับสถานะหลัง Publish

เว็บจึงไม่ได้ดีขึ้นเพราะเราวางแผนถูกทั้งหมดตั้งแต่แรก แต่มันดีขึ้นเพราะทุกครั้งที่เจอปัญหา เรากลับมาแก้กติกาของรอบต่อไปค่ะ 🔧

สุดท้าย AI เก่งแค่ไหน คนก็ยังสำคัญที่สุด ❤️

ถ้าจะสรุปวิธีสร้าง WebOliang ให้สั้นที่สุด แม่ว่าน่าจะคล้ายวงจร Plan → Do → Check → Act

• Plan — คิดว่าเรากำลังทำอะไร เพื่อใคร และอะไรคือของชิ้นเล็กที่ควรเริ่ม

• Do — ลงมือทำจริง อย่ารอให้ทุกอย่างพร้อมจนไม่ได้เริ่ม

• Check — ตรวจทั้งข้อมูล การทำงานของระบบ และสิ่งที่คนเห็นบนหน้าเว็บ

• Act — แก้สิ่งที่พลาด แล้วเอาบทเรียนไปปรับ workflow รอบถัดไป

จากนั้นก็วนใหม่ค่ะ ไม่ใช่ทำครั้งเดียวแล้วจบ 🔄

AI ช่วยแม่ได้เยอะมาก ทั้งช่วยคิดโครงสร้าง อธิบายเรื่องเทคนิค ร่างเนื้อหา วิเคราะห์ UX/UI และช่วยตรวจความสอดคล้อง

แต่ AI ไม่ได้ถูกต้องตลอดเวลานะจ๊ะ บางครั้งจำผิด เข้าใจผิด ทำเกินหน้าที่ หรือทำงานได้แต่ไม่ใช่แบบที่แม่ต้องการ

Automation ก็เหมือนกันค่ะ ถ้า workflow ยังผิด มันไม่ได้ช่วยให้ถูกขึ้นนะ มันอาจช่วยทำสิ่งที่ผิดให้เร็วและเยอะขึ้นด้วย 5555

เพราะฉะนั้น ไม่ว่าจะใช้ AI หรือ Automation มากแค่ไหน ต้องมี Human Check และ Human Decision อยู่เสมอ

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

AI เป็นผู้ช่วย ระบบเป็นทางเดิน แต่คนยังเป็นผู้รับผิดชอบการตัดสินใจสุดท้ายเสมอ 👩🏻‍🦱👓🐶

WebOliang จึงไม่ได้เกิดจากแผนที่สมบูรณ์ตั้งแต่วันแรก

มันเกิดจากการคิด ลงมือ ตรวจ พบว่าพลาด แก้ แล้วเริ่มรอบใหม่

และนี่แหละค่ะ…ก่อนจะเป็น OliangTheGoodBoy ของเด็กดำ🐶