Webflow e-commerce and stationery design

Studio DeArta is a small local art studio based in Zadar, Croatia and led by Bozica as her passion project. Lawyer by profession, she has been creating artwork since forever, and wanted to share them with others. She needed a website created from scratch, as well as all of the branding files: logo, business cards, stickers and notes to go with the products.

Background

Challenges

The Client wanted a simple, modern and clean website that would highlight the paintings and their details clearly. She wanted it to look high-end, to fit the vibe of the paintings she has been creating. The website needed to have a webshop, and the artwork was split into 3 types of products: canvas art, paper art and commissioned work.

As for the branding assets, Client wanted something clean, simple, and a had an idea about the type of font she wanted to use.

Solutions

In order to satisfy the high-end feel, I’ve opted for sections inspired with editorial magazines. That is most obvious on the “About” page, which hosts a lot of text.

We structured it like an interview and created sections that seemlesly follow one another on any device.

For the shop section, I opted for series preview. Because the Client often painted 2-4 artworks in a similar style, that can be sold together or separately, my goal was to make a clear UI showing these types of artwork together.

The shop is stating how many products are available, in how many series, and offers more details by entering each piece.

As this was my first Webflow shop design project, the added challenge was to research all possibilities we had with it. I put time designing the shop components and states (such as: adding items to cart, behavior on the page as something is already in cart, checkout components...)

The added challenge was creation and editing of all the assets that were going into the shop. The Client had some professionally taken photos and a premium Canvy account, so our goal was to find a common way of editing each style of artwork, to ensure the same quality for all the future pieces as well.

Process

This design journey started with creation of branding assets. Bozica, the Client, wanted a very simple logo that included a brush stroke. After we decided on the logo, I’ve created a color palette based on modern, cool purple shades. Purple is often associated with beauty, royalty and high-end products.

The idea of creating a editorial-looking website was set in stone after the Client prepared some professionaly taken photos. Our main challenges from then on were about how to set up a shop, properly lay out the art pieces and how does the site behave when items are added to the cart.

Tools

For wireframing and design: Figma

For photography edits: Canvy app, Affinity Photo

For development: Webflow

For assets and communication: Google Drive and Gmail

Big thanks to:
Little Eagle photography for amazing photos
Qman for Webflow magic