Fluke Thammasat Portfolio

พอร์ตโฟลิโอที่เลื่อนดูผลงานเหมือนสายน้ำ พร้อม CMS ของตัวเอง บน Worker เดียว

แบรนด์BrandWebsite · Motion · CMS · Brand site2026

เว็บไซต์พอร์ตโฟลิโอของ Fluke บนแล็ปท็อปและโทรศัพท์ บนโต๊ะทำงานที่มีแสงแดด หน้าจอเปิดสายน้ำผลงานที่มี Art Buri อยู่ตรงกลาง

โจทย์

Fluke ทำงาน UX/UI มากว่า 9 ปี ในฟินเทค ประกัน และระบบองค์กร ทุกวันนี้สร้างโปรดักต์ครบทั้งเส้นด้วย AI ตั้งแต่สเปก งานออกแบบ ไปจนถึงโค้ดที่ขึ้นใช้งานจริง โจทย์คือพอร์ตโฟลิโอที่พิสูจน์ข้อนั้นได้ด้วยตัวเอง ผลงานต้องเด่นกว่าตัวเว็บ อ่านบนโทรศัพท์ได้ดีเท่าจอใหญ่ และเพิ่มงานใหม่ได้เองโดยไม่ต้องแตะโค้ด

แนวทาง

หน้าแรกเป็นสายน้ำของผลงาน เลื่อนหรือปัดเพื่อไหลผ่านทีละโปรเจกต์ และสลับเป็นมุมมอง Index ได้ในคลิกเดียว หน้า About มีหัวที่คลิกแล้วเปิดออก ส่วน Playground รวมการทดลองด้าน motion และ interaction ไว้ intro และตัวละครทำใน Rive ทั้งหมดอยู่ใน Cloudflare Worker ตัวเดียว React Router ทำหน้าเว็บฝั่งเซิร์ฟเวอร์ ข้อมูลอยู่ใน D1 ภาพและวิดีโออยู่ใน R2 ผ่าน edge cache ส่วน CMS ที่ /admin จัดการได้ทุกอย่าง ตั้งแต่ลำดับผลงาน สี และภาพ ไปจนถึงการ์ดในหัว ภาพแชร์ของทุกหน้าวาดจากเนื้อหาจริง

หน้าแรก หน้า About และ case study ของพอร์ตโฟลิโอ บนโทรศัพท์สามเครื่อง

หน้า About: หัวการ์ตูนที่คลิกแล้วเปิดออก ข้างข้อความแนะนำตัว

หน้า Playground: การทดลอง 13 ชิ้นเรียงเป็นคอลัมน์

มุมมอง Index ของผลงาน: ชื่อโปรเจกต์ ลูกค้า บทบาท และปี

case study ของ SIAHRA: ภัยพิบัติของไทยบนแผนที่ภูมิประเทศสามมิติ

ผลลัพธ์

เว็บไซต์เปิดใช้งานแล้วที่ fluke-thammasat.dev มี case study 6 งาน และการทดลอง 13 ชิ้นใน Playground ทุกอย่างอัปเดตผ่าน CMS ของตัวเอง ทั้งเว็บและ CMS ทำงานบน Worker เดียว

โปรเจกต์ถัดไปNext project

Riverside Museum

ติดต่อContact

อยากได้เว็บไซต์แบบนี้บ้าง

เล่าโจทย์ให้เราฟัง แล้วเราจะตอบกลับพร้อมขอบเขตงานและแพ็กเกจที่เหมาะกับคุณ

เริ่มโปรเจกต์Start a project ดูผลงานอื่นSee more work