Tất cả dự án web của tôi

Landing page cho bảo tàng lịch sử tự nhiên với large-format SVG logo (NHM letter blocks animated via motion stagger), HLS background video reveal, sand-dissolve image transition (SVG filter chain: feTurbulence → feDisplacementMap → feOffset → feGaussianBlur → feColorMatrix), auto-cycling chapter gallery, dark ancient collection section với pterodactyl float.

• ✦Large NHM SVG logo với từng polygon block animate vào bằng motion stagger (ease [0.16, 1, 0.3, 1])
• ✦Sand-dissolve image transition: SVG filter chain feTurbulence + feDisplacementMap animated via RAF 900ms
• ✦usePresence() hook để detect AnimatePresence exit, quartic ease-out khi enter / cubic ease-in khi exit
• ✦Background video (Cloudinary) reveal sau 2800ms, chapter gallery auto-cycle mỗi 3500ms
• ✦Tailwind CSS 4 với @theme block, @tailwindcss/vite plugin, không cần postcss.config.js

Landing page cho design agency với animated WebGL shader background (Swirl + ChromaFlow + FlutedGlass + FilmGrain), pill navbar với live London clock, text-roll hover animations, mobile bottom sheet menu, bento case study grid với expand hover buttons.

• ✦WebGL shader stack: Swirl + ChromaFlow + FlutedGlass + FilmGrain composited via `shaders/react`
• ✦Pill navbar với live London timezone clock (updates mỗi giây)
• ✦Text-roll hover animation trên tất cả CTA buttons — cubic-bezier(0.25,0.1,0.25,1)
• ✦Mobile bottom sheet menu slides up — cubic-bezier(0.32,0.72,0,1)
• ✦Case study cards với expand hover pill button (circle → pill width)

Single-page dark portfolio landing page với loading screen, HLS video background, GSAP scroll animations và Framer Motion interactions. Thiết kế minimalist tông đen trắng, typography Instrument Serif italic, bento grid works section và GSAP marquee footer.

• ✦Loading screen với requestAnimationFrame counter 0→100 và word cycling (Design/Create/Inspire)
• ✦HLS video background via Mux stream — dynamic import hls.js với native fallback
• ✦GSAP entrance animation: ms-name (opacity+y) + ms-blur (stagger filter blur 10px→0)
• ✦Role cycling every 2s: Creative / Fullstack / Founder / Scholar với CSS fade-up keyframe
• ✦12-column bento grid works section với Framer Motion whileHover blur overlay
• ✦GSAP marquee footer: 'BUILDING THE FUTURE •' repeat(-1), HLS video flipped scaleY(-1)

Full-screen hero landing page cho nền tảng thiết kế hoa & thực vật bằng AI. Thiết kế Liquid Glass Morphism với video background loop từ CloudFront, two-panel split layout, gradient border effects bằng mask-composite technique. Typography kết hợp Poppins + Source Serif 4 italic.

• ✦Liquid Glass Morphism — hai tier: light (blur 4px) và strong (blur 50px), gradient border via mask-composite: exclude
• ✦Two-panel split: left glass overlay với hero + CTA + pills, right panel với social bar, community card, feature cards
• ✦Video loop background CloudFront + Poppins/Source Serif 4 mixed typography, strict grayscale palette

Website thương hiệu Nhà Kim Cương — đơn vị tư vấn, phân phối và phát triển bất động sản khu vực Nam & Trung Việt Nam. Tagline: "Một chữ tín vạn niềm tin". Phân phối các dự án lớn như Vinhomes Hải Vân Bay, Izumi City, CaraWorld Cam Ranh, Monrei Sài Gòn.

• ✦Đơn vị tư vấn – phân phối – phát triển BĐS khu vực Nam & Trung Việt Nam
• ✦Phân phối dự án: Vinhomes Hải Vân Bay, Izumi City, CaraWorld Cam Ranh, Monrei Sài Gòn
• ✦Trụ sở: 78 Nguyễn Văn Kỉnh, Cát Lái, TP.HCM — hotline 090 309 68 18

Trải nghiệm 3D cinematic scroll-driven được xây dựng với Three.js, GSAP ScrollTrigger và Lenis. Người dùng cuộn trang để 'rơi vào quỹ đạo' Trái Đất — globe 3D phản hồi scroll với animation mượt mà, ánh sáng cinematic và typography đẳng cấp.

• ✦Globe 3D GLB model render real-time bằng Three.js WebGL với ACES Filmic tone mapping
• ✦GSAP ScrollTrigger điều khiển camera orbit, tilt và zoom theo scroll position
• ✦Lenis smooth scrolling + preloader animation + reveal-on-scroll typography

Landing page dự án Noble Palace Tây Thăng Long tại KĐT Ciputra, Tân Lập, Đan Phượng, Hà Nội — CĐT Noble. Quy mô 76,98ha với 2,448 sản phẩm gồm Grand Shophouse 5 tầng (952 căn, 211–562m²) và Elegant Shophouse 4 tầng (1,496 căn, 145–372m²). Giá từ 11 tỷ/căn.

• ✦CĐT Noble tại KĐT Ciputra Đan Phượng HN — 76,98ha, mật độ xây dựng 30%
• ✦2,448 sản phẩm: Grand Shophouse 5T (952 căn, 211–562m²) + Elegant Shophouse 4T (1,496 căn, 145–372m²)
• ✦Giá từ 11 tỷ/căn — phân phối bởi Tân Long Land (0916 85 00 55)

Landing page phân khu Izumi Canaria tại Izumi City, phường Long Hưng, TP.Biên Hòa, Đồng Nai — CĐT Nam Long Group. Giai đoạn 1 đã hoàn thiện 275 sản phẩm nhà phố/biệt thự song lập; giai đoạn 2 Canaria gồm shophouse, nhà phố, biệt thự với ưu đãi lên đến 17%.

• ✦CĐT Nam Long Group — phân khu Izumi Canaria, TP.Biên Hòa, Đồng Nai
• ✦Giai đoạn 1 hoàn thiện 275 căn nhà phố/biệt thự song lập, bàn giao ngay
• ✦Giai đoạn 2 Canaria: shophouse, nhà phố, biệt thự — ưu đãi 17%, phân phối bởi Nhà Kim Cương

Landing page dự án Sunwah Pearl tại 90 Nguyễn Hữu Cảnh, Phường 22, Quận Bình Thạnh, TP.HCM — CĐT Sunwah Group (Hồng Kông). Dự án đã hoàn thiện, nhận nhà ngay, gồm căn hộ cao cấp, shophouse thương mại, văn phòng và penthouse. Giá từ $6,000/m².

• ✦CĐT Sunwah Group (Hồng Kông) — 90 Nguyễn Hữu Cảnh, Quận Bình Thạnh, TP.HCM
• ✦Đã hoàn thiện, nhận nhà ngay — chỉ 30% nhận nhà ở ngay
• ✦Căn hộ cao cấp, shophouse, penthouse — từ $6,000/m², phân phối bởi Naman Realty (093 333 5856)

Landing page dự án TBS Green Skyline tại mặt tiền GS1 và Đại Lộ 1K, Dĩ An, TP.HCM — CĐT TBS Land (TBS Group). Quy mô 4 tòa tháp cao 28–40 tầng, 1,296 căn hộ 1PN–3PN, 68 tiện ích riêng biệt trải dài 4 tầng đế, bàn giao full nội thất cao cấp.

• ✦CĐT TBS Land — 4 tháp 28–40 tầng, 1,296 căn hộ 1PN–3PN, mặt tiền Đại Lộ 1K Dĩ An
• ✦68 tiện ích riêng biệt trải dài 4 tầng đế: hồ bơi vô cực, công viên, gym
• ✦Bàn giao full nội thất cao cấp — phân phối bởi Aureal (0936 606 363)

Landing page dự án Setia Edenia tại Quốc Lộ 13, Tp.Thuận An, Bình Dương — CĐT Setia SP (SP Setia Group, Malaysia). Quy mô 1.2ha, 3 tháp, pháp lý sổ hồng lâu dài, dự kiến bàn giao Q4/2027. Sản phẩm 1PN–2PN từ 48 triệu/m².

• ✦CĐT SP Setia Group (Malaysia) — pháp lý GPXD 3570/GPXD (26/06/2025), sổ hồng lâu dài
• ✦1.2ha, 3 tháp tại Quốc Lộ 13 Thuận An Bình Dương — 1PN (50.7m²), 2PN (73–74m²)
• ✦Từ 48 triệu/m², bàn giao Q4/2027 — phân phối bởi Aureal

Landing page dự án Imperia Holiday tại mặt tiền Hoàng Quốc Việt, phường Bãi Cháy, TP.Hạ Long — CĐT MIK Group, kiến trúc NIKKEN. Quy mô 1,994 căn hộ Resort-Living Studio–2PN, 76 shophouse khối đế với tầm nhìn toàn cảnh Vịnh Hạ Long.

• ✦1,994 căn hộ Resort-Living (Studio–2PN) + 76 shophouse — CĐT MIK Group, kiến trúc NIKKEN
• ✦Mặt tiền Hoàng Quốc Việt, Bãi Cháy, Hạ Long — tầm nhìn toàn cảnh Vịnh Hạ Long
• ✦3 tầng hầm, 5 tầng khối đế — tiện ích đảo cảnh quan, hồ bơi, gym, vườn BBQ

Landing page dự án Aria Bay tại bán đảo 3, KĐT Halong Marina, TP Hạ Long — CĐT BIM Land. Quy mô 2.2ha, 2,100 căn hộ cao 40 tầng, 5 Retail Pods, pháp lý sở hữu lâu dài. Sản phẩm: Studio, 1PN, 2PN, 3PN và Sky Villa, giá từ 2.x tỷ/căn.

• ✦2,100 căn hộ 40 tầng tại bán đảo 3 Halong Marina — CĐT BIM Land, sở hữu lâu dài
• ✦Đa dạng sản phẩm: Studio–1PN (30–47m²), 2PN, 3PN, Sky Villa — từ 2.x tỷ/căn
• ✦5 Retail Pods thương mại dịch vụ, tiện ích resort 5 sao ngay vịnh Hạ Long

Landing page dự án Vinhomes Hai Van Bay (Làng Vân) tại Liên Chiểu, Đà Nẵng — 512.2ha chân Đèo Hải Vân, 3 mặt giáp biển, CĐT Vingroup. 5,928 căn thấp tầng: liền kề, biệt thự, shophouse, khách sạn, sở hữu lâu dài.

• ✦Siêu dự án 512.2ha chân Đèo Hải Vân — CĐT Vingroup, tọa sơn hướng thủy
• ✦4 phân khu phong cách quốc tế: Bạch Vân, Vịnh Mây, Đảo Ngọc, Tinh Vân
• ✦5,928 căn thấp tầng: Liền kề, Biệt thự, Shophouse, Khách sạn — sở hữu lâu dài

Landing page cho AI agency với dark luxury aesthetic, hero section animated, how-it-works flow, features grid, stats section, testimonials và footer CTA. Xây dựng hoàn toàn bằng Next.js và Framer Motion.

• ✦Dark luxury UI với BlurText animation và staggered reveal
• ✦Features chess layout, stats counter và testimonials carousel
• ✦Fullpage responsive với Navbar, CTA section và smooth scroll

Landing page dự án Charmora City tại Nha Trang — đảo đô thị 220ha 3 mặt giáp sông, CĐT Sun Group. Sponge City đầu tiên tại Việt Nam với mật độ xây dựng 16%, mảng xanh 84%. Loại hình: Liền kề, Shophouse, Biệt thự Song lập & Đơn lập, Căn hộ.

• ✦Đảo đô thị 220ha 3 mặt giáp sông tại Nha Trang — CĐT Sun Group
• ✦Sponge City đầu tiên tại Việt Nam — mật độ xây dựng 16%, mảng xanh 84%
• ✦Đa dạng loại hình: Liền kề, Shophouse, Biệt thự Song lập & Đơn lập, Căn hộ

Landing page dự án Vinhomes Hạ Long Xanh (Global Gate) tại Phường Tuần Châu & Đông Mai, Quảng Ninh — quy mô 4,610ha, 18 tỷ USD, CĐT Vingroup. Ultra Luxury với 41.2km bờ biển, 680ha Lagoon và 12 sân golf.

• ✦Siêu dự án 4,610ha — lớn nhất Vingroup tại Quảng Ninh
• ✦41.2km đường bờ biển, 680ha Lagoon, 12 sân golf đẳng cấp quốc tế
• ✦Form đăng ký tư vấn và live chat chốt booking

Landing page dự án khu đô thị phức hợp Vinhomes Saigon Park tại Xuân Thới Sơn, Hóc Môn, TP.HCM — quy mô 924ha, CĐT Berjaya VN. Showcase tiện ích, phân khu và form đăng ký tư vấn.

• ✦Landing page khu đô thị quy mô lớn 924ha tại TP.HCM
• ✦Showcase phân khu, tiện ích và mặt bằng dự án
• ✦Form đăng ký tư vấn và live chat hỗ trợ khách hàng

Landing page dự án căn hộ Ultra Luxury Orchard Collection tại Sycamore Bình Dương — liên danh CapitaLand & UOA Group. Showcase tầm nhìn panorama, tiện ích 5 sao và form đặt chỗ.

• ✦Ultra Luxury căn hộ CapitaLand & UOA Group tại Bình Dương
• ✦Gallery panorama, tiện ích 5 sao và mặt bằng chi tiết
• ✦Form đăng ký tư vấn và booking suất ưu tiên

Landing page khu đô thị Spring Ville 18.26ha tại Nhơn Trạch, Đồng Nai — CĐT Gamuda Land. Thiết kế Singapore, căn hộ liền kề và biệt thự phong cách resort ven sông.

• ✦Khu đô thị 18.26ha phong cách Singapore của Gamuda Land
• ✦Showcase biệt thự, căn hộ liền kề và tiện ích resort ven sông
• ✦Form đăng ký giữ chỗ và tư vấn dự án

Fullscreen hero landing page cho creative agency với video background, typewriter headline animation, service pills, và clean minimal UI phong cách tech studio.

• ✦Typewriter headline animation với cursor blink effect
• ✦Fullscreen background video với overlay gradient
• ✦Service pills layout cho danh mục dịch vụ

Landing page dự án căn hộ cao cấp Monrei Sài Gòn tại Bình Dương — liên danh Mitsubishi, Tokyu và Phát Đạt. Tư vấn thông tin, gallery, form đăng ký và live chat.

• ✦Full-page landing page bất động sản cao cấp chuẩn ladipage
• ✦Gallery dự án, mặt bằng căn hộ và thông tin tiện ích
• ✦Form đăng ký tư vấn tích hợp với live chat

Fullscreen hero landing page cho công ty năng lượng tái tạo với boomerang video background (frame-by-frame capture & reverse playback), staggered typography animation, và liquid glass UI.

• ✦Boomerang video effect qua Canvas frame capture & reverse rAF loop
• ✦Staggered character-by-character fade-in animation
• ✦Liquid glass CSS border effect với mask-composite

Fullscreen hero landing page cho creative agency với video background, Podium Sharp typography, staggered fade-up animations, responsive mobile menu overlay, và stats row.

• ✦Fullscreen looping video background với overlay
• ✦Staggered fade-up animation cho từng hero element
• ✦Mobile menu overlay với staggered slide-in effect

Landing page hiện đại cho AI SaaS startup với liquid glass UI, animated gradient backgrounds, và bảng pricing dynamic.

• ✦Liquid glass morphism UI components
• ✦Animated gradient hero với WebGL effects
• ✦Interactive pricing table với toggle animation

Portfolio cá nhân cho 3D creator với dark theme cinematic, hiệu ứng magnetic portrait, scroll-driven marquee GIF, sticky-stacking project cards, và character-by-character text animation.

• ✦Magnetic portrait theo chuột với Framer Motion
• ✦Scroll-driven marquee 21 GIF theo chiều cuộn trang
• ✦Sticky-stacking project cards với scale animation

Landing page sang trọng cho dịch vụ thuê máy bay tư nhân với dark luxury aesthetic, booking flow, và fleet showcase.

• ✦Dark luxury UI với high-end typography
• ✦Fleet showcase với interactive cards
• ✦Booking request flow cho private jets

Landing page cao chuyển đổi cho agency marketing bất động sản. Tích hợp booking 1:1, QR payment tự động, và admin CRM dashboard.

• ✦Booking flow tự động với QR payment SePay/ACB
• ✦Admin CRM dashboard quản lý lịch hẹn
• ✦Tích hợp Google Sheets làm database