Case
AL000059
Who
Sttoke Incorporated Pte. Ltd.(2017-2019)
What
Web DesignWooCommerce Online StoreCustom Development

The Story

STTOKE is a lifestyle brand based in Australia / Singapore and they make the world's first shatterproof ceramic reusable cup.

Minimalist, elegant and functional – STTOKE’s core values align with ours. As the gold winner of 2018 Good Design Awards®, the brand needs an online platform that’s on par with the brand’s credibility and aesthetic.

With plans for global expansion, the brand needs a flexible and customizable e-commerce platform that supports multi-countries, multi-currencies and multi-languages. The online store is also required to include multiple payment gateways for different currencies, as well as integration with shipping company for dynamic shipping fee calculation.

So, What Have We Done?

Minimalist & Monochromatic Web Design

Inspired by the brand’s original color options of the cup, we translated the black-and-white color scheme into a full color palette for the website, with a dash of classic red as the universal accent color.

What also caught our attention was the sheen (or reflective highlight) on the “Luxe Black” coating when the cup is viewed under different direction of light source.

We translated this sheen into a type of gray-black gradient with an inverted version, and applied this design element across all dark backgrounds (as demonstrated by the background gradient of this row and the row above).

Exhibit 1: The website's global footer

Typography

The Questrial font from Google Fonts  is the perfect fit for the brand as it’s close to the brand’s logotype.

Custom WooCommerce Development

Multi-lingual, Multi-countries & Multi-currencies

Multi-lingual and multi-currencies online store is made possible thanks to WordPress and WooCommerce’s flexibility.

Utilizing leading translation plugin WPML and custom development, we created multiple “sub country-sites” under single WooCommerce installation. (Tip: Higher-end hosting is recommended.)

Support for multiple payment gateways based on checkout currency was added to cater to local markets as well as to reduce third-party transaction fee.

Geo-location Redirection

Visitors are redirected to specific country-site based on geo-location information provided by LiteSpeed server application running on the hosting server.

Dynamic Shipping Fee with DHL

DHL Express‘ integration API allows online stores to retrieve latest shipping fee directly from their database.

By sending buyer’s location, product weight and packging dimension to the API, STTOKE website can display updated shipping fee in real-time.

The two-way integration allows store manager to send order details to DHL system to create shipment request, bypassing manual data entry in fulfilment.

STTOKE Referral Program

Extending the standard WooCommerce installation, we added a Referral System to the website – when someone placed an order via your referral link, you’d get a discount code for your next order.

Custom Development for Seasonal Campaigns

From time to time, we develop custom campaign layouts in conjunction with STTOKE’s seasonal marketing plans – from Christmas, Valentine’s Day to new color launches.

We transform materials provided by STTOKE’s internal creative team into campaign micro-sites, each with a little different flair every time.