Feathermen

Feathermen is the name of the small workshop that crafts everyday accessories, such as wallets, phone cases and skins. All products are made by hand using only high-quality natural materials.

  • UI/UX Design
  • -
  • Branding
  • -
  • Development

Backstory

A few years ago I ran into a friend, that I haven’t seen in a while, at the well-known jazz festival Nishville in my hometown. He approached me with an idea of crafting some interesting products and asked me if I am willing to help him create a brand and a web store. I fell in love with the concept instantly, so I had to say YES!

Making the concept and planning of the products took more then a year, so he was short on time and budget for building a custom webshop, therefore, he had to use a template for the launch. Consequently, in the beginning we focused on creating the brand only.

During the first year, both feedback and reviews of the products were amazing. That inspired him to continue working on the project, and revive his old idea, to build a custom designed webshop.

Problem

He was not truly satisfied with the design of the template, but he thought it was good enough for the start. Later on, he started to notice some issues with it.

The template was built for a large amount of products, but here, he needed something minimalistic with a focus on a small number of items. In other words, he asked me to remove all unnecessary things and simplify the expereince as much as possible. The ordering process was cluttered too, which ended up with lower conversion rate due to cart abandonment.

The bounce rate was a problem too, mostly because of non-optimized graphics, so the load time was too long, which lead some users to “bounce off” before the shop fully loads.

Solution

The whole project is permeated with a Native American theme, therefore, all products are crafted by hand, made of natural high quality materials. At the same time they are modern, fashionable, and compact, as well as rough, unusual, and unique. To point out all these details, we wanted to display each product as a separate story. In order to achive that, we asked Nikola Pejcic, the photographer, to help us create amazing photo shooting sceneries.

In my early days, I worked for three years in a local computer web store as a manager and designer, and that experience helped a lot for this project. The Feathermen’s webshop is powered by WooCommerce, which I adjusted to the small number of products, getting rid of all unnecessary features and options, as requested. The goal was to offer fluid experience making an effective navigation design, which was crucial for guiding a potential customer.

Nikola, our “Swiss Army Man”, was in charge for the implementation of the new design into the WordPress, with a little help from Vladan Tacic.

Outcomes

The launch of the website is expected in June this year after which we will run the A/B testing on some user flows we are still not sure about. From this point of view, the following design concept is still subject to change. The status of the new website is in a closed beta phase, so there is still no data about improvements in conversion rate. Anyhow, some progress on the website could have been measured already, such as:
  • 20% quicker ordering process
  • 2.5s faster loading time

01Branding

The Brand itself consists of Native American symbols: tepee, arrow, feather and wood. The logo was created to resemble the shape of a traditional tepee, sharp edges as an arrow and a piece of chopped wood. The colour dominating the logo is the specific shade of brown associated with cork and natural wood.

  • Tepee
  • Feather arrow
  • Chopped wood
  • Native American
Letter “A” symbolizes “tepee”
Brown shades represent wooden colour
Customized “Native Alien” font
Colour pallete
All the fonts used for the website needed to support the characters from the Serbian Latin alphabet

02Webshop

The UI of the website was simplified in order to put an emphasis on the products and their specific and unique stories and customized settings. Regarding the homepage, only the product categories were presented, due to their small number.

Large thumbnails of the main categories and the newsletter inspired by Native American macrames
The full screen menu with the main navigation links
The category page displays three products per row
The product page with option to customize colours and choose a model

03Checkout Process

The number of unnecessary input fields was reduced, such as state, region etc., since the purchase was intended only for Serbian citizens. The payment option includes paying for goods when they are delivered, which is the most popular payment method in Serbia. Therefore, the billing process for online payment was excluded.

Shopping cart
Delivery address form

04Responsive

The responsive version of the webshop was a No.1 priority since the main marketing campaign was conducted through Facebook from which most of the visits have been accounted. Due to the fact that the interface focused on minimalism, it was not difficult to incorporate the webshop’s concept and functionality on mobile devices.

Responsive version of the homepage
Main menu
Category page
Product page, product images
Product page, product description
Shopping cart
Contact page

At first, I was just looking for a simple solution for my webshop, but Milos provided a lot more; The visual identity that strongly resonates with the story and idea behind the Feathermen's name. Also, he helped a lot regarding the physical product design by providing excellent feedback on first concepts. With a smile on my face, I can say that sales exceeded my expectations in the first months of my business, but I must admit that I was more excited about the look than the financial benefit that came with it. However, perhaps the best thing that this collaboration sparkled is our friendship. Now, after a few years, I can say that Milos is one of my best friends with whom I drink beer almost every week, and discuss technology, movies, and music.

-

Milan Jovic, Founder

Fin

Thank you for scrolling so far.
If you liked my work pick a number to see another one: