Jewelry and gifting
ATHENAIE
ATHENAIE commerce centers on charm composition and gifting. Buyers need material, compatibility, size, meaning and packaging context rather than a single product image.
Visit the live project
Core implementation review
Three storefront journeys from model choice to purchase
ATHENAIE is merchandised as composition, not as a pile of silver SKUs. A base bracelet, a charm and a Murano bead have to become one gift. Size and metal stay on variants, finished looks stay related products, and the product page still has to prove the metal and glass. Seasonal copy can move without rebuilding the buy path.
Project context
Define how customers choose before defining the storefront
Shoppers enter through bracelets, charms, glass beads, pendants, rings or gifting occasions, select a base and size, then compose by colour, theme and meaning. Material assurance, gift box, reviews, worldwide shipping and returns build trust.
WESWOO turns individual jewellery into a composable gifting system, using compatibility and meaning to connect bases, charms, complete looks and content, improving selection rather than merely adding SKUs.
Sell bracelets, charms and beads as pieces that belong together
Shoppers lock a base and size, then add a compatible charm or Murano bead, instead of hunting a finished look inside a bloated option matrix.
- 01Enter a bracelet, charm or glass-bead collection
- 02Resolve a sellable variant by size or metal
- 03Keep the current product as styling context
- 04Surface related charms or complete looks
Implementation
- Size and metal live on variants; main-product.js owns the product form and the active variant state.
- Finished looks and gift boxes stay related or bundled products, not extra option values.
- The product page calls Product Recommendations from the current bracelet or charm, so the next piece has a real context.
Deployment and acceptance
- Gallery, material notes and the buy box remain separate sections, so gift copy can change without touching the variant matrix.
- Add, quantity change and update all submit the active variant through Ajax Cart.
- Recommendations load in the background and never block price or the primary purchase control.
- A shopper can assemble a base plus charms without treating the whole look as one option.
- New charms enter the same product and recommendation model without a rebuilt product form.
View script and Shopify API evidence
main-product.jsVariant behaviorProduct form behaviorProduct Recommendations APICart Ajax: addCart Ajax: changeCart Ajax: updateLet rotate and zoom prove the metal; keep gift photography as mood
Facets, glass texture and the clip have to be inspectable. A gift-box scene should never replace material or size judgement.
- 01Show the piece on a bright ground
- 02Rotate or enlarge to read structure and cut
- 03Read meaning or packaging afterwards
Implementation
- Desktop pairs the 360 viewer with the buy box; mobile surfaces material and size before the lightbox, so compatibility is not left to pinch-zoom.
- js-cloudimage-360-view.min.js handles rotate-around viewing; photoswipe-init.js initialises the media lightbox.
- Colour chips, size controls and add-to-cart sit apart from highlight photography, with selected, sold-out and loading states.
Deployment and acceptance
- After a theme-editor or Section Rendering reload, lightbox and 360 widgets rebind so media follows the active variant.
- Zoom and rotate remain keyboard-reachable; entrance motion yields to reduced-motion and never covers the primary purchase control.
- Swiper is reserved for look or content carousels, not as a substitute for product media.
- Shoppers can inspect silver, glass and the clip before they buy, instead of being led only by gift atmosphere.
- After a size or finish change, the viewing controls still point at the piece that can be purchased.
View script and Shopify API evidence
js-cloudimage-360-view.min.jsphotoswipe-init.jsMedia/model behavioranimation.jsswiper-bundle.min.jsSwiperSection Rendering APIShopify theme editor modeLet occasion and recipient open the right charm, not the whole catalogue
Gift shoppers rarely walk the full jewellery grid. Search, collections and related charms need one vocabulary so “who is this for” can become a sellable piece.
- 01Arrive from an occasion, a recipient or a search term
- 02Land in a gift or jewellery-type collection
- 03Narrow by material, colour or theme
- 04Discover related charms on the product page
Implementation
- Predictive Search returns product and collection suggestions while the shopper types, narrowing the range before a full results page.
- Collections route gifting occasions versus jewellery type; product objects own the SKUs.
- The product page calls Product Recommendations for related charms, instead of packing complete looks into search results.
Deployment and acceptance
- Search includes loading, empty and keyboard states so the typeahead path does not stall.
- Material, size and compatibility stay shared across markets; seasonal copy, delivery and returns remain destination content and do not alter the cart request.
- Occasion intent can reach a specific charm without turning meaning into a variant.
- Seasonal work updates collections and copy, leaving the sellable matrix intact.
View script and Shopify API evidence
Predictive Search APIProduct Recommendations APIfloating-selector.jsOperational handoff
The operating team can continue after launch
- Collections separate bracelets, charms, Murano beads and gifting occasions so bases and add-on pieces are maintained independently.
- Size and metal finish belong on variants; complete looks and gift boxes are related or bundled products, not extra option values.
- Material, compatibility and craft notes stay shared fields and content. Meaning and seasonal stories live on collections, so campaign work does not create new SKUs.
- Checkout defaults to English and USD. Material, size and compatibility stay shared; gift calendars, delivery promises and returns are destination content.
- floating-selector.js exposes region or language at the storefront edge, and pickup-availability.js surfaces local pickup, without rewriting the variant matrix.
- Editors change gift copy, navigation and pickup messaging so seasonal work does not touch the cart request.
Research notesPublic sources and verification boundary
Public research sources
Content verification
Industry, product and observable feature notes are verified against the brand site. Apps, admin configuration and commercial data that cannot be confirmed from the storefront are not inferred. WESWOO scope is stated only from project records and client authorization.
Public information last reviewed: 2026-08-12