ภาพรวม
เว็บไซต์พอร์ตโฟลิโอสไตล์ Cinematic เน้นภาพที่ตระการตา สำหรับผู้จัดคอนเสิร์ตชาวไทยชั้นนำที่ดำเนินงานในยุโรป ใช้แสดงไทม์ไลน์งานอีเวนต์ แกลเลอรีภาพถ่าย และรองรับเนื้อหาหลายภาษา
ความท้าทาย
- •การสร้างดีไซน์แนว Cinematic ที่เน้นความอลังการทางภาพให้สามารถแสดงผลได้ราบรื่นบนมือถือ
- •การบริหารจัดการเนื้อหาเว็บไซต์ที่รองรับหลายภาษาอย่างมีประสิทธิภาพ (ไทย, อังกฤษ, เยอรมัน)
- •การสร้างไทม์ไลน์เหตุการณ์ที่เป็นภาพเคลื่อนไหวโต้ตอบได้สำหรับงานที่ผ่านไปแล้วและงานในอนาคต
การดำเนินการ
- •ใช้เทคนิค Glassmorphism CSS และปรับแต่งวิดีโอ/ภาพพื้นหลังเพื่อให้ดูพรีเมียม แต่โหลดเร็ว
- •เชื่อมต่อกับไลบรารี next-intl เพื่อการแปลภาษาทั้งบน Server-side และ Client-side อย่างราบรื่น
- •ใช้งาน GSAP และ Framer Motion ในการจัดการแอนิเมชันที่ตอบสนองเมื่อเลื่อนหน้าจอ (Scroll-triggered)
ผลลัพธ์
- •ประสบความสำเร็จในการยกระดับภาพลักษณ์แบรนด์ของผู้จัดงานในตลาดยุโรป
- •เพิ่มเวลาที่ผู้ใช้งานใช้บนเว็บไซต์ด้วยองค์ประกอบลูกเล่นและการออกแบบที่น่าสนใจ
- •มีระบบรากฐานที่รองรับการเพิ่มโปรเจกต์คอนเสิร์ตใหม่ๆ ในอนาคตได้อย่างง่ายดาย
เทคโนโลยีที่ใช้
Next.jsGlassmorphismi18nGSAP/Framer