Design Process

I set out to design a solution that would meet the needs of the target user, the objectives of the business, in this case the art scene, and technical capabilities.

User Persona’s & Empathy map

To synthesize the gathered information during the interview, I used empathy maps to discover the key behavior of the target audience. The sticky notes were categorized into the categories of Doing, Thinking-Feeling, Seeing, Hearing, Gains, and Pains.

Through my secondary research, I was able to get a clear picture of the target users. The created persona represented the needs and wants of different type of users and served as a guide to my decisions in the further design process.

User Type A:
The Art Teacher & Art Enthousiast

User Type B:
The Experienced & Seasoned Collector

Value Proposition
& Opportunity

After the research phase I’ve identified the following stages and opportunities:

• An interactive platform where users can interact with people from various regions that allows users to chat, share and collect art which increases the opportunity for users to engage with friends, galleries and collectors in a more meaningful way.

• Help users locate exhibitions, museums and galleries in their city without having to switch between various applications while keeping them connected with their network.

• Simplify the process of collecting and buying art, while allowing them to ask opinions from advisors or their own network during this process.

The process and app functionalities

Taking what I have learned throughout my process to this point, I started to make decisions on how the content would be organized. Therefore, the low & high fidelity wireframes of the screens were designed. The wireframes only represented the content layout. I do find it important to fill it with imagery as soon as possible to see how images and information relate to each other. I will only show the high fidelity ones in this case study.

I designed for the following features:

• Onboarding

• Profile creation & Settings

• Interactive search

• Discover & Browsing

• Messaging & Chat option

• Posting & Commenting

• Latest news & trends

User flow

With all the insights we gained from the analysis phase and understanding the audience, the following step was to map out the app's entire structure and features.

Based on the goals and needs of the user persona I created a simple task flow. This flow defined how the user would interact with the app to complete given tasks regarding, onboarding, browsing and setting up a profile.

In the given example the user goal is:

"As an artlover I want to be able to personalize my profile before browsing art."

The user flow was created to define the customer journey across the app.

Moodboard & Visual Research

Before designing a high-fidelity prototype, a mood board was created for inspiration and to set the feel and direction of the app. I focused on finding different elements (colors, typography, and imagery). Because the art itself is quite colorful at times. To balance that I decided to keep the UI clean, functional and minimal e.g. black and white tones that will go well with the colorful artworks.

Design System & UI Components

Grid

For the spacing system I went with a rem based guide that aligns with the 8px grid. The reason why I went with an 8pt system is to help the design system be more responsive because all of the top screen sizes are divisible by 8 on at-least one axis.

Typography

I chose for typography that had this modern yet classical feel. It's also super versatile having several variations in weight which make it look great as a heading font and as body text.

Iconography

For the icons I choose a minimal yet informative style that complements the overall visual language of the design system. I went with a simple icon set because detailed icons increase cognitive load. I focused on simplicity to help users understand the concept the icon represents so they can recognize icons on smaller screens.

Color palette

Although I value an aesthetically pleasing use of color, I place a higher value on clear communication. Color supports the hierarchy of information, interactive states, and the difference between distinct elements. Because the artworks already contain so much color in them, I decided to go for a palette that was absent of color and made just of grey, black and white tones to complement and balance that and to add to that classical look. There is just one color used to accentuate an active state. Every color has an assigned role, which hold a specific meaning based on how they function within the interface.

Onboarding flow

The onboarding flow starts with asking whether the user already has an existing profile or if they want to sign up. To sign up it asks them to create an account and profile. If users want to create an account they can skip the profile creation if preferred.

Sign up flow

The user can switch between sign in/sign up depending on whether they have an existing account or want to create a new account. When creating the account the user is asked to enter personal details and accept terms & conditions before he/she can continue.

User Profile Creation

Then the fun part comes where users can start setting up their user profile. Profile creation allows users to add their interests to their profiles so other users can see what they are all about. Here they can also start following other peers and friends and find out about their art interests. Here a pop up prompt will appear asking the user whether he/she wants to add friends and/or browse for works.

Discover
& Settings

An important part of this flow is that it allows users to discover artworks, artists and find out about the latest trends and news within the art market. They can browse between different categories, explore the latest auctions which will bring them to the home screen or read the news articles.

Via settings they can see a full overview and shortcut to an overview of their favourite works, order history, purchases or any other inquires that revolve around personal account settings, payments, data or feedback.

Product Browsing & Artist Overview

Here you see an overview of how the product and browsing pages look like and what the home screen looks like. Via the home screen (second screen of this flow) users can navigate towards the latest new works, auctions overview and recently viewed. It will also show recommendations based on the users preferences and saved works. When an artwork is selected it will show the works of that particular artist and provides the user with the ability to get more additional information about a specific artwork. When clicked on more info it will direct the user to a screen where you can have direct contact with the gallerist.

User Profiles

To create that sense of belonging and personalize the experience of collecting art, there is the option to set up your own profile adding so users can share their thoughts, opinions and reach out. Below are a few different variations of how such a profile could look like.

Posting & Commenting

The post section will enable users to share some of their favourite works and lets them comments and post. The share icon provides the option to repost a post which in turn will then appear onto the profile of the user that reposted it.

Messages, Notifications & Followers

In the decision-making stage, a collector will typically gather as much information as possible about an artwork, comparing it to similar works, consulting auction results or seeking approval from peers and friends. Therefore keeping them connected to their network and community within the same place can be valuable. This chat functionality enables users to directly chat within the app and share their thoughts and feelings.

Search & Locations

To make the user experience complete this app intends to help users locate exhibitions, museums and galleries in their city without having to switch between various applications while keeping them connected with their network. They can see whether their friends are in the neighbourhood and can invite them to go to one of the locations.

User testing

Because this was a proof of concept I’ve tested this with a small group of users to gain insight in what was still missing.

User reported the following:

• The locations functionality still looked too limiting. One user reported she would have liked to see which of her followers liked that particular place or gallery.

• They would have liked to connect the app to their socials, which wasn’t possible.

• They would have liked to see more suggestions of new art events and artworks based on location.

• In some instances the font was still too unreadable, particularly in the locations and followers section.

Web Landing Page

Next to providing the main features for the app, I also designed a web page. This provides an easy search filter and overview to learn about artists, market news, featured collections, auctions and anything related to buying, selling and community support. Through research I understood more users are interested in using the app on mobile, therefore I have chosen to keep the website clean and leave space for discovery and reduce cognitive load. What also became apparent from user feedback is that the younger generation is particularly interested in what is currently trending. Therefore I’ve specifically designed a component that highlights that feature.

*If your viewing on mobile, please turn it landscape mode to see the full prototype video below. ↓

Learnings &
Next steps

It was very interesting to deep dive into the world of art as I am a collector myself. Because of that there was the risk I would be biased during the design process because I could be a user of this app myself and design to my likings, so it is best to always stay objective and make optimal use of the research and insights. The research insights helped me to improve the prototype and motivated me to come up with better solutions. Ultimately I would say that it’s important to organize your files properly in fimga and to document everything as the order of things can get messy along the way.

Next steps I’ve identified:

• Add more social media functionality that makes it possible to integrate other social media platforms with this app.

• Provide personalised suggestions of new art events and artworks based on user’s preferences, favourites and saved works.

• Provide personalised suggestions of new art events and artworks based on location.

• Collaborate with curators from art galleries to provide valuable information about the latest trends within the art market.

• Test website landing page with users and found out what features they find important and what are their needs.

Conclusion

It was a really great experience designing this, creating a feature that is accessible for a wider audience. Because I am real art lover it can be easy to be biased so research is always necessary to have that broader perspective and get to know the user, their needs and pain points and what is important to them.

The online environment becomes more and more important for online shopping within the art market so it was interesting to learn that the people that I interviewed value a sense of belonging and community. Technology has altered the way we communicate. Therefore sharing and viewing art online to discover new work is important, especially with a generation of millennial and generation Z buyers who have a shorter attention span and have better access to wealth.