AWE · Apexv4 · louder + combos
7 + 8 combo · mesh ⇄ particle supernova

AWE APEX

v4 — แต่ละหัวข้อมีตัวอย่าง "ตะโกน" เพิ่ม, 7 และ 8 อัปเลเวล, และคอมโบข้ามข้อ. Hero นี้คือคอมโบ 7+8: mesh สลายเป็นอนุภาคแล้วประกอบกลับ.

เลื่อนเมาส์เพื่อสร้างแรง · คลิกเพื่อจุดระเบิด
Part I · Topic, Amplified

แต่ละหัวข้อ แบบตะโกน

ตัวอย่างที่ดันหัวข้อนั้นจนสุด — ให้เห็นพลังของเทคนิคแบบไม่ต้องตีความ

01

Scroll · Kinetic Depth

parallax Z

เลื่อนผ่าน — คำพุ่งเข้าหาเราในแกน Z หลายชั้นความลึกพร้อมกัน เป็น scroll ที่ "มีมิติ".

Live · scroll-scrubbed Z parallax
02

Text · Kinetic Typography

3D char

ตัวอักษรยักษ์หมุนเข้ามาในสามมิติทีละตัว แล้ว settle — typography ที่เคลื่อนไหวเป็นพระเอก.

AWE

Live
03

Micro · Liquid Magnetic Button

SVG goo

ปุ่มที่ผิวเป็นของเหลวกระเพื่อม + ดูดเข้าหาเคอร์เซอร์ + ripple ตอนกด — micro-interaction ที่รู้สึกได้.

Live · hover + click
04

Transition · Curtain Wipe

multi-panel

คลิก — แผ่นสีสามชั้นกวาดขึ้นไล่กันเผยเนื้อหาใหม่ เหมือน page transition ของเว็บ portfolio.

คลิกเพื่อเปลี่ยนฉาก
NEXT
Live · คลิกที่ stage
05

Easing · Throw & Spring

physics

ลากลูกบอลแล้วปล่อย — มันสะบัดตาม momentum แล้ว settle ด้วย elastic ease เห็น "feel" ของ ease แบบจับต้องได้.

ลาก แล้วปล่อย
Live · drag & release
06

Mask · Cursor Spotlight

radial mask

เนื้อหาซ่อนในความมืด — เคอร์เซอร์คือไฟฉาย ส่องถึงไหนเผยถึงนั่น ผ่าน radial mask ตามเมาส์.

REVEAL
ขยับเมาส์ส่องหา
Live · move to reveal
Part II · 7 & 8, Leveled Up

ดัน 3D และ WebGL ให้สุด

กระป๋องสะท้อนแสงจริงด้วย environment map + เงากระจก · และ particle ที่ขยับบน GPU ล้วนๆ

07

3D · Reflective Product

envMap · mirror

กระป๋องโลหะสะท้อน environment (cube map 6 หน้า) + เงากระจกใต้พื้น + rim glow · ลากหมุน, scroll พลิก. ระดับ studio render.

Live · drag หมุน · scroll พลิก
08

WebGL · GPU Particle Flow

vertex shader

หมื่นอนุภาคขยับด้วย vertex shader บน GPU (curl-ish flow) ผลักหนีเมาส์ และไล่สีตามความเร็ว — ลื่นแม้จำนวนเยอะ.

Live · move mouse to disturb
Part III · Combos

จับคู่ให้เกิด AWE

คอมโบเรือธง 7+8 + การจับคู่ข้ามข้อแบบสุ่มที่ส่งเสริมกัน

7+8

Combo · Supernova Detonator

flagship

รวมร่าง 3D mesh + WebGL particles: คลิกเพื่อ "จุดระเบิด" ให้วัตถุสลายเป็นอนุภาคเรืองแสง แล้วดูดกลับมาประกอบใหม่ · ลากเพื่อหมุน.

Live · คลิก detonate · drag rotate
2+6

Combo · Masked Kinetic Headline

text × mask

Text-splitting พบ mask: บรรทัดเลื่อนขึ้นจากใต้เส้น พร้อม gradient clip วิ่งผ่านคำ — สอง technique เสริมกันเป็น headline เดียว.

WE DON'T COPY

WE ENGINEER AWE

Live
1+5

Combo · Elastic Scroll Gallery

scroll × easing

Scroll ขับ easing: เลื่อนผ่าน การ์ดวิ่งเข้าด้วย ease ต่างกันทีละใบ overshoot แบบ elastic/back — จังหวะการมาถึงคือพระเอก.

Live · scroll-triggered staggered eases
AICE Hub🔎 ตรวจ AI ฟรี