Dana Drawing's

Find a website design that showcases her work, is easy to update, and drives growth in sales.

The problem:

The solution:

Define her unique brand and style. Set up responsive e-commerce website so she can grow her following and connect with new buyers.

Lead designer + developer (webflow)

My role

2 weeks

Timeframe

Research

• Identify pain points customers experience while shopping online

• Research various retail e-commerce websites to analyze their strengths and weaknesses

• Understand the customer’s online journey from site visit to checkout

Research goals:

Primary/Interviews: I interviewed 5 online shoppers to gain insight and to learn about their likes and dislikes of their current online shopping experiences.

Secondary/Competitive analysis: I wanted to understand the retail e-commerce market for artists and to learn about common practices on their responsive websites.

Findings:

User pain points and preferences:

• Prefer shorter checkout flow and fewer steps to complete a purchase

• Must have a seamless shopping experience on desktop or mobile without interruptions

• Need to build trust and loyalty, so knowing about the seller or contact info was important

Defining the layout

My initial research gave me an understanding of a typical user flow, and common ecommerce site structures so I developed this initial sitemap to guide my design going forward.

Sketches and wireframes:

It was important to define the interface and information hierarchy at a basic level. This was done through quick sketches and finally by creating lo-fidelity wireframes of key pages. This laid the groundwork for the next phase of polished mockups.

We had a basic site structure in mind, but Dana did not fully define her brand style or main colors. Informed by the previous phases in the design process, we began putting together a mood-board to figure out these style questions. This led to the development of Dana’s overall visual aesthetic and with this the UI began to take shape.

Visual design and branding:

Hi-fidelity Designs

I applied the new branding and style guidelines to create high fidelity mockups of her site. I used the mood-board to create a playful color palette that would compliment the whimsical and free form nature of her illustrations. Along those same lines, I looked at font pairs with a neat, casual and friendly feel.

Bringing it all together

Delivery and Conclusion

I delivered the final designs and built out her website on webflow. This was my first time designing an e-commerce site from scratch so I had to learn about a new industry on the fly, which was definitely challenging for me. Luckily Dana was a very patient client and was very good at letting me try new things while providing detailed feedback throughout the design process.