Track my career
Explore my workflow
View my projects
Download my full résuméTime: Q3 2023
Tasks:
- logo design
- web design
- mailing design
- packaging design
- front end development
- back end development
Design Stack: Adobe Photoshop & Illustrator
Main Tech Stack: Wordpress, WooCommerce, ACF
Assignment's Overview
Hemply Smile is a company producing and selling high quality CBD products. It operates mostly in Sweden. I was tasked with designing its whole brand identity from scratch and developing full e-commerce website from top to bottom. No easy assignment as scandinavian markets are generally considered difficult when it comes to gaining customer's trust as a completely new company in health segment.
So, let's get to it!
1st Challenge: Logo
For the whole project the client wanted a proffesional feel that at the same time wouldn't be too stiff. Main competitors went for cold, very medicinal, almost hospital like aesthetics. My bet was on being rather a friend than a doctor here as core of the target group would be young adults. I wanted this logo to be edgy and fun yet still trustworthy, fun but not too much fun and certainly not funny.
Cannabis leaf seemed like a good main theme especially that usually it's being used in CBD context only as a simplified icon. I saw a chance to make somehing very distinct here. At first I had some trouble with leaf's shape forcing the logo to be quite tall. This could be a serious problem depending on the use case. Luckily it proved still very readable if cut from top and left, so I decided to follow this route.
Through trial and error I quickly realized that I can't successfully separate big, strong visual of the leaf and oil drop from brand's name and have to somehow mix them together. Negative space came to the rescue. Rather early in the process I decided tu use Slackey font as it sat perfectly with project's mood. A lot of font size, spacing and baseline shifting had to be done to make lettering perfect but finally I was sasisfied with typography.
What was still needed was some final touch. I had to dismiss quite a few silly ideas and ended up with adding a discrete smile line to an oil drop. It nicely corresponds with brand's name and kinda breaks drop's shape making it whole. At this point I was finally ready to show my design to the client at first in the form of a mobile mockup.
We had some requirements but we weren't sure what we exactly wanted and what to actually expect. When we saw your logo design we said to ourselves: wow, this is it! We tried to describe it and you envisioned it perfectly.
Next Step: Packaging
With logo done it was time to take care of packaging. Not my usual cup of tea but the scope of work here looked fairly straightforward. I was supposed to design sticker labels for CBD oil bottles and capsules containers. Products differed by cannabinoids amount, type and usage. After some consideration I decided to distinguish them by color. That's why at this stage I had to decide what color palette I'm gonna be using in all my upcoming work on this project. I ended up with two main colors already used in logo design and six supporting tones.
Fitting all that text into often tiny labels proved quite challenging. Good thing that Fira Sans font which I really wanted for this project has a very nice condensed variant. After a lot of shifting, sliding and resizing I managed to fit there some nice icons representing different sections of text content. I also chose to split long products names into color and size divided parts. I would later use this visual title-sequencing widely on the website.
I haven't prticipated in actual printing process as a lot of this commission was done remotely across the borders. There were three small test prints done involving necessary CMYK color corrections and fixing few typos. Pretty quickly the client was satisfied with the results and from now on I could focus fully on creating the website.
Main Task: Website
With logo and packaging design already complete without any serious amendments I was pretty confident about my sense of client's preferences. That's why I decided to skip prototyping and get straight to design. Luckily I was spared the hassle of „lorem ipsum” and got most of the page contents available right away. That allowed me to plan ahead and split it into a few logical sections page by page thus making my life a lot easier later, when I finally got to coding. At this point I had to create some basic design patterns - headers, subheaders, buttons, text/photo blocks, icon sets which I would later reuse on all website screens.
It was agreed that we'll stick to standard WooCommerce and Wordpress blog user experience so main screens needing custom design were homepage, products list with sorting and filtering, product details and a few custom modules supplementing other pages. I went for full width RWD design with big photos in mostly green tones and previously mentioned big headers split into parts. Following some consultations mobile and desktop designs were swiftly accepted one by one with only minor changes. Now it was finally time to get dirty with some code.
Scope of the project demanded fully custom Wordpress theme build from scratch. Too much moving parts and job specific elements to lean on ready, off-the-shelf template. Substantially more work with html, css, JavaScript and php but at the end of the day worth every minute. This way I could also utilize the power of css flexbox model still too rarely used in commercial themes. I realized quickly that standard Wordpress content blocks won't do because of their limitations. I'm not a big fan of page builders like Elementor so I decided to use ACF Pro allowing full control over content display. Reusabale, well thought modules, components and sections after initial effort made future work a breeze.
From technical point of view most of the work from this point was pretty standard. One especially challanging piece of code was the „4 for 3” promo product picker module allowing clients to choose four items and get the cheapest one free. Surprisingly of all available WooCommerce extensions, free or paid, none allowed this specific functionality. Product Bundles plugin helped a little but still a lot was left to be desired. The client was very determined to make it work so I wrote custom cart and checkout templates that completely changed products display and counting logic of purchase totals. Finally I prepared a nice UI module in form of nested sliders allowing users to interactively pick four desired items and instantly see the final price. Then it was all about making sure ordering process works perfectly, configuring shipping and payments extensions and a little fine tuning of user e-mails.
Migration: Hosting & Domains
So, the website was ready and it was time to move it from my developement server to its final location. My client had a preferred Swedish shared hosting provider and had already bought desired domains. Having all necessary access I moved all files to their new FTP location, migrated the MySQL database and configured domain with a fresh SSL certificate. I've also made a few security, cache and image optimization tweaks on the server side. Then finally I took care of Wordpress security configuration including things like directories permissions, admin url and spam prevention. Soon we were ready for launch.
Final mission: Mailing Campaign
The site was up and running so now it was time to get some audience. My client's main channel for reaching new customers was e-mail marketing. After some research and discussion we decided to use two solutions simultaneously and at a later stage decide which one suits best company's needs. Freshmail & GetResponse were gonna be our weapons of choice. I created e-mail templates based on previous designs, set up campaigns and very soon we started sending. There were many batches dispatched including some basic A/B testing, totaling in ~50k emails. Open rate went as high as 39% (compared to 20% advertising average). CTR reached 3.55% (vs typical 2%). Pretty decent!
Summary & Conclusions
To be honest most of this work was rather fun than effort. Even though I encountered some challenges they proved to be engaging and assured me a good learning experience. I also managed to develop a very good and healthy relationship with my client which later evolved into ongoing cooperation. After four months of work we were able to complete full design and development process of not only e-commerce website but also branding, packaging, mailing and some minor print. More than that - after first five full months of online presence I can proudly say that
order conversion rate of the shop is 7%
compared to 3.6% average for health & beauty segment worldwide. I'm no expert when it comes to marketing stuff, all those CTRs, CVRs etc. but it looks like quite an achievement and I'm pretty happy to be a big part of this success.
If you like this story and you would like to have your project taken care of with similar attention, don't hesitate and send me a message.
