Boyy
Custom Shopify ThemeLuxury Fashion2023
Boyy is a luxury handbag brand renowned for their distinctive sculptural designs and premium Italian craftsmanship. Founded in Bangkok with a global presence, the brand required an e-commerce experience that matched the sophistication of their products. I developed their Shopify theme from scratch — engineering a high-performance storefront with modern minimalist aesthetics, leveraging cutting-edge browser APIs that would later become industry standards.
Luxury brands demand seamless experiences. Traditional full-page navigations felt jarring against the brand's refined aesthetic. I pioneered the View Transition API in its cross-document mode on Shopify — enabling fluid, app-like animations between separate HTML documents without a single-page application architecture. Combined with the Speculation Rules API for intelligent background prerendering, pages load instantly before the user even clicks. This implementation preceded Shopify's platform-wide adoption of these APIs, establishing best practices for resolving conflicts between dynamic content sections and speculative loading.
Performance was non-negotiable. Rather than relying on heavyweight libraries like Swiper or Flickity, I engineered a custom CSS Scroll Snap-based carousel from scratch. The implementation leverages native Intersection Observer API for lazy loading, CSS will-change for GPU-accelerated animations, and Touch Events for mobile gestures — all without external dependencies. The result: buttery-smooth 60fps scrolling with a minimal JavaScript footprint.
Zero-dependency Carousel
60fps GPU Acceleration
Collection pages implement advanced Ajax-powered dynamic loading without full page refreshes. As users scroll, new products load seamlessly via the Fetch API, while the History API updates the browser URL to maintain deep-linkable, SEO-friendly pagination. Each paginated state is fully crawlable by search engines, following Google's e-commerce pagination guidelines. This hybrid approach delivers the fluid experience of infinite scroll while preserving the discoverability that traditional pagination provides.
The cart experience required special consideration when working with Speculation Rules. Prerendered pages can become stale if cart state changes, so I implemented a minimalist Ajax Cart API-driven drawer that excludes itself from speculative preloading. The component uses DOM fragments for efficient updates and CSS transitions for smooth open/close animations. The design follows modern drawer patterns: slide-in overlay, quantity adjusters, and persistent visibility without disrupting the shopping flow.
Cart Drawer Features
Speculation-aware Updates
Minimalist Modern Design
Slide-in Drawer Pattern
The marketing and SEO teams were losing hours to repetitive CMS tasks: manually updating image alt-text, product descriptions, and category assignments. I built a custom Shopify Admin App using Polaris and Remix. To handle bulk operations across thousands of products, I integrated Upstash Redis for queue management and Node.js cron jobs for scheduled automation. A real-time progress viewer in the admin UI lets the team track job status. The app listens to webhooks, generates SEO-optimized metadata, applies smart collection rules, and sorts featured products based on sales data from the Admin GraphQL API.
- Conversion CRO improvement with Speculation Rules API +12%
- Efficiency Admin time saved weekly with automation app 8+ hours
- Pioneer First Shopify store with cross-document view transitions 2023