คลังผลงาน
2026 · May·demo·website·live

References

คอลเล็กชันโชว์เคสของเว็บไซต์แบรนด์เชิงบรรณาธิการ สร้างขึ้นเพื่อแสดงความหลากหลาย ทั้งงานตัวอักษร โมชัน และระบบดีไซน์ข้ามหลายอัตลักษณ์ ตั้งแต่งานภาพถ่ายจนถึงงานบริการ

ผลกระทบ

เดโมเดียวที่พิสูจน์ความหลากหลายของงานดีไซน์และการพัฒนา แต่ละไซต์ตัวอย่างมีงานตัวอักษร ภาษาโมชัน และ design tokens ของตัวเอง ไม่มีอันไหนเป็นเทมเพลต

เทคโนโลยี
Next.jsReactTypeScriptTailwindSanityGSAPVercel
ไซต์ตัวอย่างเชิงบรรณาธิการของ References
ตัวอย่างเชิงบรรณาธิการ
อัตลักษณ์แบรนด์ของ References
อัตลักษณ์แบรนด์

References คือโชว์เคส รวมเว็บไซต์แบรนด์เชิงบรรณาธิการหลายไซต์ แต่ละไซต์มีอัตลักษณ์ของตัวเอง สร้างขึ้นเพื่อแสดงความหลากหลายของงานดีไซน์และฝั่งหน้าบ้าน ไม่ใช่งานให้ลูกค้ารายเดียว

ภาพรวม

พอร์ตโฟลิโอส่วนใหญ่โชว์ลุคเดียวซ้ำไปมา อันนี้ทำตรงข้าม คือชุดไซต์ตัวอย่างที่แตกต่างกัน แต่ละไซต์มีงานตัวอักษร สี และโมชันของตัวเอง แบ่งปันกันเพียงพื้นฐานที่มีรสนิยม ทั้งหมดเป็นการสาธิต ไม่ใช่งานลูกค้าที่ดำเนินอยู่จริง

ทำอะไรได้บ้าง

  • เว็บไซต์แบรนด์อิสระหลายไซต์ ครอบคลุมงานภาพถ่าย งานบริการ และไลฟ์สไตล์
  • ระบบ design token เฉพาะตัวต่อหนึ่งอัตลักษณ์
  • โมชันด้วย GSAP และการเลื่อนที่ลื่นไหล พร้อม view transitions ระหว่างหน้า
  • รายละเอียดเชิงบรรณาธิการ: เกรน เคอร์เซอร์เฉพาะตัว และงานตัวอักษรที่ตั้งใจ

จุดเด่น

  • หลากหลายมากกว่าการทำซ้ำ: ทุกตัวอย่างมีน้ำเสียงต่างกัน ไม่ใช่ธีมเดียวเปลี่ยนสี
  • โมชันอย่างมีเจตนา: การเลื่อนและการเปลี่ยนหน้าที่ส่งเสริมเนื้อหา
  • สร้างอย่างระดับโปรดักชัน: แพ็กเกจร่วมสำหรับฟอนต์ โมชัน และ UI primitives
  • เป็นจุดเริ่มบทสนทนา: ลิงก์สดที่โชว์ความกว้างได้ในไม่กี่วินาที

อยากให้สร้างคล้ายๆ กัน?

ผลงานที่เกี่ยวข้อง

mazzotta.dev cover
InternalLive
2026

mazzotta.dev

เว็บ portfolio และ lead-gen ที่คุณกำลังอ่านอยู่นี้ case study หลายภาษา archive ฟอร์มติดต่อแข็งแกร่ง บนชั้นเนื้อหา type-safe เดียว

Next.jsTypeScriptTailwindVeliteMDX
Joleen Güntlisberger cover
ClientLive
2026

Joleen Güntlisberger

เว็บไซต์หาเสียงของ Joleen Güntlisberger ผู้สมัครรุ่นใหม่จากพรรค SVP สำหรับสภาแคว้นซุก ทั้งประวัติ จุดยืน ข่าว และกิจกรรม แก้ไขได้ทั้งหมดผ่าน CMS

Next.jsReactTypeScriptTailwindSanity+1
Claude Daily Summary cover
OSS · CommunityLive
2026

Claude Daily Summary

บรีฟประจำวันที่คัดสรรด้วย AI ครอบคลุมระบบนิเวศ Anthropic Claude ทั้งหมด แหล่งข้อมูลสิบห้าแหล่ง ไปป์ไลน์สามโมเดล (Haiku, Sonnet, Opus) จดหมายข่าว RSS และคลังเก็บ ผลิตภัณฑ์ฟรี ทำงานเป็น Lead Funnel ในตัว

Next.jsTypeScriptAnthropicPostgresTailwind