A redesign proposal for Artshop's e-commerce website.
Fougaro is a unique multipurpose arts venue in Nafplio, Greece. It is comprised of different spaces which promote art, education, innovation, and community engagement. Tourists and locals who visit Fougaro usually want to keep a small part of it with them before they go. Some visitors and art enthusiasts may also be looking for special gifts. Fougaro's small store, called "The Artshop", fulfills these needs by offering a number of for purchase items like art objects, books, office accessories, jewellery, children’s products, and more. Apart from its physical store, The Artshop also has an e-shop where the visitors can go through the products in their own time and from wherever they choose.
After redesigning Fougaro’s main site, we proceeded to propose a new design for its e-shop, "The Artshop". Our first thought was to visually connect the two. Next, we deliberated and came to the conclusion that we could boost sales by creating a better e-shop structure and improving customers' shopping experience. Our goal was for the customers of the online shop to have a pleasant shopping experience as did the physical store's customers.
We researched the Artshop's e-shop needs. We decided to keep some elements of the previous e-commerce site. To stay focused on the features, touchpoints ecc. of the desktop and mobile version of the e-shop, I proceeded to write them down.
In this case, the target group was the same as Fougaro's:
Due to the proposal's tight deadline, we created user personas and a customer journey map for a specific case (i.e. when a customer wants to buy a gift for a friend). This helped us discover certain things that needed to change through the e-shop's redesign. We also made a diagram to visualise the specific users' desires and needs from the Artshop's e-shop.
I often use a program called Pixave where I collect (by bookmarking and screenshooting) all kinds of websites, images, UI elements, navigation and animation elements, new web trends, and organize them with tags. This process helped me with this project as well.
From our overall research, we found that there are different but also common needs. The website's structure must be based on these needs. The customer journey helped us make the site's structure more clear, although after the redesign process, we had to keep in mind that new user needs and problems would form. That's why the design process will always have to change and improve.
We worked on five basic pages:
We focused on the e-shop's architecture by creating wireframes. We concentrated on the content by carefully adding specific components that could improve the user experience:
We used brighter colors in “The Artshop” than the ones we chose for Fougaro’s site. We maintained the same aesthetic between them to keep a consistency design wise. Font was meticulously selected to have a good rendering with the Greek language and improve the legibility. The colors we chose followed the brand’s guidelines maintaining a clean and neat approach at the same time. You can see the design elements we collected below.
We wanted to make a responsive version we could showcase the possibilities of the Artshop's redesign. You can see the design for desktop (1.400px), tablet (770px) and mobile (320px) below.