D'art Chocolate — Creating a More Delightful Chocolate Shopping Experience 🍫✨ The concept: reima...D'art Chocolate — Creating a More Delightful Chocolate Shopping Experience 🍫✨ The concept: reima...
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
D'art Chocolate — Creating a More Delightful Chocolate Shopping Experience 🍫✨ The concept: reimagine the premium digital shopping experience for a local Vietnamese chocolate brand by turning product discovery into an enjoyable journey. The goal was to help customers easily discover the perfect chocolate product while showcasing the craftsmanship and story behind every handcrafted creation.
🚀 Bringing the vision to life: I redesigned D'art Chocolate's website to present its handcrafted chocolates more visually and intuitively. Instead of browsing through static collections, customers can explore products based on the moments they're celebrating or the flavors they love—creating a shopping journey that feels natural, inspiring, and enjoyable.
🛠️ Built with Squarespace + Finish Layer
Used Finish Layer capabilities to bring the chocolate experience to life. Created a dynamic product interaction where chocolates gently float and transition into the gift box
Block Animations — Added subtle motion and hover interactions to create a refined, engaging browsing experience without distracting from the products.
Mobile Experience — Instead of simply scaling down the desktop version, the mobile experience was carefully redesigned with optimized spacing, content flow, and interactions to create a seamless shopping journey across screen sizes.
Rather than simply displaying products, this website, through thoughtful layouts, intuitive navigation, and engaging interactions, guides visitors from discovery to purchase.
🎨 Tools: Squarespace · Finish Layer · Figma · Gemini
Password: 123
sakshi's avatar
so cute .!
Tram's avatar
Aww, thank you! Cute like you. 😉🫶
Tran's avatar
Amazing project!!! I like it so much. Great job🫰🏻
Tram's avatar
Thank you! I'm so glad you like it😍
Isabel's avatar
Contra logo
i love this branding!!
Tram's avatar
Yayyy, thank you, that means a lot 🎉
Ehtasham's avatar
Delicious 🎉 @Tram Nguyen
Tram's avatar
Thank you 😍. You should definitely stop by the store and pick your favorite one! 🍫😋
Salman's avatar
Tram I really love this style 😺
Tram's avatar
Thank you so much! I'm really glad you love it. ❤️🥹
Shakti's avatar
Tram's avatar
Thank you so much! That means a lot! 🤍✨ ☺️
Ruslan's avatar
great🔥
Tram's avatar
Thanks, that means a lot to me 🙌☺️
Sophia's avatar
digitals professionals logo
Love this
Tram's avatar
Aww, thank you so much, that made my day 😍 🎉
Ateeb's avatar
This feels less like browsing an online store and more like walking into a boutique. That's a really hard feeling to recreate on the web.
Tram's avatar
Thank you so much! That was exactly the feeling I wanted to bring to D'art Chocolate's online experience. I'm really happy the boutique atmosphere came through. 😊🎉
Job's avatar
You've done an amazing job.
Tram's avatar
Thank you! I really appreciate that 😊
Boluwatife's avatar
This deserves more than just liking, this deserves to be featured! 🏆 Making product discovery feel this interactive is the secret to high-converting web layouts.
Tram's avatar
Thank you so much! 🥹❤️ That's incredibly encouraging to hear. I'm really happy it resonated with you! Fingers crossed!
Mahrukh's avatar
it looks amazing! i love the chocolate box animation!
Tram's avatar
Wow, thank you! 🥹❤️ That means a lot coming from you. I spent a lot of time thinking about how interactions could make browsing chocolates feel more delightful, so I'm happy it resonated!
Asif's avatar
The strongest decision here is organizing discovery around occasions and flavors instead of a flat catalog, because that mirrors how people actually shop for a gift: they start from the moment, not the product. If I were extending it, I would make that occasion-based entry point...
Tram's avatar
Thank you for the thoughtful feedback! 😊 I completely agree that people usually start with the occasion rather than the product, which is exactly the idea I wanted to design around. I really like your suggestion about making occasions the primary entry point on mobile—it would...
Adekanmbi's avatar
This is quite amazing work, very creative, very smooth.
Tram's avatar
Thank you so much 🙌 🎉
Jamil Harun's avatar
Tram's avatar
Thank you so much 🙌☺️
Tarik's avatar
WhiteFrame Creative logo
Excellent work!
Tram's avatar
Thank you so much, glad you like it 🫶🤩
Adeola's avatar
Amazing!
Tram's avatar
Thank you so much 🙌☺️
MD Rafee 's avatar
Letting people browse by occasion or flavor instead of static collections fits chocolate way better than a typical grid. The floating product transition into the gift box is a nice detail, curious how Finish Layer handled that compared to doing it in Figma first.
Tram's avatar
I really enjoyed using Finish Layer's built-in animation; it comes with a variety of triggers like On Hover, On Press, On Loop, On Scroll, On Appear, and Follow. For this interaction, I used a Scroll trigger and customized the animation so each chocolate gradually floats into...
Rakibul's avatar
Nice work!
Tram's avatar
Thank you so much! That made my day 🥹❤️
Adesina's avatar
Really nice 👍
Tram's avatar
Thank you, I'm so glad you like it 🥹❤️
Mark's avatar
This looks delicious and so well designed😍
Tram's avatar
Thank you so much! I'm glad you like it😍🙌
Nazmul's avatar
Awesome 🔥
Tram's avatar
Thank you! I'm so glad you like it😍🎉
Mayowa's avatar
amazing work!
Tram's avatar
Wow thank you so much for support these two submission 🫶🎉
Back to feed
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started