ในช่วงเลือกตั้งสมาชิกสภาผู้แทนราษฎร พ.ศ. 2566 มีเว็บไซต์หลายแห่งทำหน้าที่รายงานผลการนับคะแนนเลือกตั้ง และได้รับความสนใจจากประชาชนจำนวนมาก
เว็บไซต์แห่งหนึ่งที่ได้รับเสียงชื่นชมอย่างมากคือ เว็บไซต์รายงานผลการเลือกตั้ง 66 ของ Thai PBS (election66.thaipbs.or.th) ทั้งเรื่องการออกแบบที่ใช้งานง่าย และสามารถรองรับปริมาณโหลดจำนวนมหาศาลในช่วงวันเลือกตั้ง เพื่อเป็นการเผยแพร่ความรู้ทางเทคนิคเบื้องหลังเว็บไซต์แห่งนี้ Blognone จึงขอสัมภาษณ์ทีมจากบริษัท INOX ผู้อยู่เบื้องหลังการพัฒนาเว็บไซต์นี้ร่วมกับ Thai PBS
ทีมจะดูมีหลายคนมากๆ แวะเวียนมาร่วมมือในส่วนที่ตัวเองเป็น specialist ครับ
เมื่อปี 2565 เราเคยร่วมงานกับ Thai PBS ทำเว็บไซต์รายงานผลเลือกตั้งผู้ว่ากรุงเทพ 65 ซึ่งได้ผลตอบรับค่อนข้างดี พอมาถึงการเลือกตั้งใหญ่ปี 66 เราเลยได้รับความไว้วางใจให้มาร่วมงานกันอีกครั้งครับ
ในช่วงแรก ทีมงานตีโจทย์การออกแบบเว็บรายงานผลการเลือกตั้งอย่างไร
เราพยายามจะถอดความสำเร็จจากงานเลือกตั้งผู้ว่าฯ แต่ก็พบว่าบริบททางการเมืองต่างกันมาก เอาแนวทางเดิมมาใช้ตรงๆ ไม่ได้ ดังนั้นทางเราและ Thai PBS จึงเริ่มจากทำเซอร์เวย์กันในวงเล็กๆ (ระบุกลุ่มเป้าหมาย) เพื่อสรุปเอาคำถามสำคัญที่กลุ่มเป้าหมายของเราอยากรู้
ผลการสำรวจความเห็นได้ข้อสรุปมา 3 ข้อ สิ่งที่คนอยากรู้คือ 1) เขตที่บ้านเรา ใครได้เป็น ส.ส. 2) พรรคไหนได้ ส.ส. จำนวนเท่าไร 3) แล้วใครจะได้เป็นนายกรัฐมนตรี
จากนั้นเราเอาประเด็นหลักนี้มาพัฒนาต่อให้สุดทาง ประเด็นแรกเรื่อง “เขตที่บ้านเรา ใครได้เป็น ส.ส.” นั้นเราดูจากการเลือกตั้งที่ผ่านมา ว่าผู้ใช้น่าจะต้องเข้ามาดูผลหลายๆ ครั้ง เพื่อดูคะแนนล่าสุด ดังนั้นถ้าออกแบบให้ผู้ใช้สามารถปักหมุดเขตที่บ้านไว้ได้เลย จะได้ไม่ต้องไปไล่กดแผนที่ซ้ำๆ ทำให้การใช้งานง่ายขึ้น
แต่ในประเด็นว่า “ใครจะได้เป็นนายก” เป็นส่วนที่ท้าทายที่สุด เพราะจากการเลือกตั้งฯ 62 แสดงให้เห็นว่าไม่ใช่ว่าพรรคที่ 1 จะได้เป็นรัฐบาลเสมอไป ดังนั้นการออกแบบที่ดึงภาพพรรคอันดับ 1 หรือพรรคอันดับ 1-3 ขึ้นมาเด่นที่สุด อาจจะไม่ใช่แนวทางที่เหมาะกับบริบททางการเมืองปัจจุบัน เราเลยเลือกนำเสนอในรูปของ “สูตรจับขั้วรัฐบาล” พร้อมบวกเลขที่นั่งของแต่ละสูตรมาให้เสร็จเลย เพื่อให้ผู้ชมเข้าใจว่า พรรคที่ 1 ไม่ได้แปลว่าจะได้เป็นรัฐบาล แต่ขึ้นอยู่กับสูตรการจับมือแบบไหน เป็นไปได้แค่ไหน
ประเด็นนี้อาจสุ่มเสี่ยงกับความเป็นกลางด้วย เราเลยต้องทำงานในส่วนนี้กับทาง Thai PBS (ซึ่งเป็นสื่อสาธารณะและต้องวางตัวเป็นกลาง) อย่างใกล้ชิด เพื่อให้การนำเสนอออกมาเป็นกลางที่สุด โดยเราเลือกนำเสนอสูตรตั้งต้น 5 สูตรตามการสรุปจากทีมข่าวการเมือง เป็นค่าตั้งต้นให้เห็นภาพความเป็นไปได้ แต่ก็ยังเปิดโอกาสให้ผู้ชมสามารถจัดสูตรรัฐบาลเองได้และแชร์ได้ด้วยตามคะแนนแบบเรียลไทม์ในตอนนั้น
เนื่องจากทาง Thai PBS มีกลุ่มผู้ชมหลากหลาย โดยเฉพาะฐานผู้ชมกลุ่มผู้สูงวัย มีเยอะพอสมควร ในกระบวนการคิดจึงต้องเลือก persona ของผู้ชมให้หลากหลาย เพื่อออกแบบและทดสอบให้ครอบคลุม ไม่ว่าจะเป็นกลุ่ม New Voter, Active Voter, กลุ่มผู้ใหญ่วัยเกษียณ เป็นต้น เพื่อให้เราสามารถเอาสิ่งที่พัฒนาไปทดสอบกับ user จริงๆ จนมั่นใจว่า UX/UI ที่ออกแบบมานั้น ไม่ซับซ้อนเกินไปสำหรับกลุ่มเป้าหมาย (ต้องขอบคุณคุณพ่อคุณแม่ทีมงานทุกคนที่ได้มาร่วมทดสอบกันด้วยครับ)
จะเห็นว่ามีหลายๆ จุดที่พยายามทำให้ดูง่าย ลดความซับซ้อน เช่น หลีกเลี่ยงการใช้ฟอนต์เล็ก หรือตัดความสามารถในการซูมแผนที่ออกไปเลยเพื่อกันงง แล้วดันให้ไปใช้ฟิลเตอร์แยกเฉพาะภูมิภาคช่วยให้เห็นแผนที่ขนาดใหญ่ขึ้นได้ หรือให้พิมพ์ชื่อจังหวัดเพื่อค้นหาแทน
ในงานนี้เราเลือกใช้ NextJS เพื่อให้ได้ใช้ React และสามารถ custom HTML response เพื่อให้มีภาพสำหรับแชร์และ Title แตกต่างกันในแต่ละหน้าเมื่อมีการแชร์ได้
ในงานนี้เรา build โปรเจกต์เป็น Docker image เพื่อเอาไปใช้บน Kubernetes เองเลยครับ
จริงๆ ตัว NextJS เองไม่ได้รับโหลดได้สูงมากนัก แต่เนื่องจากมี caching ทำให้เหลือโหลดเข้ามาถึงระบบจริงๆ ไม่เยอะ ถึงจะเตรียม autoscale ไว้แต่ก็ใช้จริงประมาณ 4-5 pod เท่านั้น ที่เหลือก็สามารถรับโหลดได้ตามขีดความสามารถของ CDN เลย
ส่วนการรับมือ spike load ควรตรวจสอบให้แน่ใจว่างานส่วนใดควรทำที่ฝั่งไคลเอนต์หรือเซิร์ฟเวอร์, วางแผนทำ caching ถูกต้องเหมาะสม และทางทีม DevOps ยังช่วยทดสอบยิงแอป เพื่อใช้ประเมินสถานการณ์ไปด้วยอีกทางหนึ่ง อีกส่วนที่สำคัญคือระบบอื่นๆ ข้างเคียง เช่น เว็บไซต์หลัก (ซึ่งอาจเป็นทางเข้าของผู้ใช้บางกลุ่ม) ก็ต้องเตรียมพร้อมรับมือไปด้วยกัน
ทีมมองว่าเกิดจาก 2 ปัจจัยหลัก
งานนี้ใช้เวลาในการออกแบบระบบและพัฒนาประมาณ 1 เดือนครึ่ง ฟีเจอร์ทั่วไปใช้งานได้สมบูรณ์ในช่วง 1 สัปดาห์ก่อนเลือกตั้ง แต่ยังมีการปรับจูน ปรับแต่ง แก้ไขจนถึงวันเลือกตั้งจริง และแม้แต่ตอนเริ่มประกาศผลไปแล้ว ก็ยังมีการแก้ไขปรับปรุง โดยทาง Thai PBS กับเราประสานกันเพื่อแก้ไข ตาม feedback ของผู้ชม
ช่วงประมาณ 2 ทุ่มกว่า มีอยู่จังหวะหนึ่งที่ข้อมูลคะแนนจากต้นทาง ส่งมาเป็น 0 เกือบทุกเขต และเนื่องจากเราดึงข้อมูลและสรุปเร็วมาก ทำให้ผู้ชมเห็นคะแนนลดวูบไป (ดูเหตุการณ์จริงจาก รมต. DE ได้) แต่เนื่องจากเราแยกเก็บ data source คะแนนจากสื่อไว้อีกชุดหนึ่ง จึงสามารถสลับโหมดมาใช้คะแนนจากสื่อชั่วคราวได้ (แต่ก็ทดไว้ในใจว่าคราวหน้า คงต้องทำ Snapshot ไว้ย้อนเวลาได้ด้วยเพื่อป้องกันกรณีนี้)
ขอขอบคุณทางทีมสำนักสื่อดิจิทัล ทีมข่าว และรวมไปถึงทุกๆฝ่ายของทาง Thai PBS ที่ได้ให้โอกาสทางทีมงานบริษัท INOX ในการทำโครงการดีๆเช่นนี้ รวมไปถึงการสนับสนุนทางด้าน ข้อมูล และแนวคิดต่างๆอันมีคุณค่ายิ่งแก่ทีมงานของเราครับ
ผลการเลือกตั้ง เป็นแค่จุดเริ่มต้นครับ อย่างที่เราพยายามเสนอใน UI ยังต้องติดตาม รวมถึงส่งเสียงสะท้อนจากภาคประชาชนกันต่อไป