Tres Tribus Mezcal

Mezcal has even deeper roots in the ancient craft and culture of Mexico than its sister tequila. The agave species from where it comes are found in the wild, and the selected plants can be 25 years old or more. They slowly cook for five days in a underground stone oven, then go for a week of fermentation followed by manual mashing and distillation. This is the time-demanding process that brings Tres Tribus Mezcal to life. Its owner Altos Planos wanted to build a Shopify store to offer this artwork shaped as spirit for high-ticket customers in USA.

Altos Planos wanted visuals that would recall its flagship product's site Mijenta Tequila, in order to achieve some visual consistency across different products. At the same time, Tres Tribus Mezcal had its own design set created for printed media like labels and bottle boxes: very detailed illustrations and specific decorative patterns, together with a CMYK color palette with darker tones of yellow, brown and gold gave the brand a mysterious, "edgier" feeling that must translated into the site. The buying experience from the homepage to the cart should, of course, be seamless, as well as the site responsiveness. Only a UX/UI Designer with graphic design experience could do this for them.

From printed to digital media

In Figma, I translated the original CMYK colors to RGB and HEX, and determined which typography would better fit the brand's look and feel since the client only had decorative fonts. This established a standard library. The logo and some decors were already available in CMYK Illustrator files, so I had to convert them to RGB using the reference palette and export everything to SVG. There were no RAW photos, only high resolution JPG files that I had to process in Photoshop, adding adjustment layers in order to get the brown-golden hue to illustrate the Craft section.

Shopify theme's customization

Custom CSS and some theme.liquid modifications were enough, along with the processed JPG and SVG files of course. I used GemPages plug-in to set up theme colors, typography and the responsive layout. The footer and all the decors had to be inserted and customized through CSS.

Tres Tribus Mezcal, previously dependent on third-parties for sales, now had a functioning store, visually consistent with its printed design, that also documented the spirit's story, craft and meaningful cultural background. Funnel analysis data from Matomo, gathered during the first couple of weeks after the site's release, demonstrated the Homepage was leaking a bit too many users until the product descriptions were shortened and the products were placed closer to the top.

Jakob's Law of usability states that users spend more of their time on other sites. This means that any digital experience that delivers time-proven, very well-known patterns will have good returns in almost all situations. In other words, people expect a new store to work about the same way as all the other stores they already know on the Internet. Building a basic but well designed Shopify store, imprinting on its theme the brand's visuals with a great section explaining the craft, making the products easy to find and buy and having a predictable interface that works is enough and yet hard to get with too many bloated "solutions" out there.