Global Art
Global Art is an open environment where artists and art collectors from all over the world can connect directly and establish professional contacts. With this app users no longer depend on intermediary agents such as art galleries or art auctions. This work is part of Google UX Design Professional Certificate’s final project.
Problem
Artists and art collectors don’t have a direct channel to interact with each other and they depend on art galleries for building professional relations.
Goal
To create a platform where artists and art collectors can come together to find opportunities for the sale, creation and purchase of art without going through intermediaries like galleries or auctions.
Role
UX designer: conducting interviews, creating paper and digital wireframes, writing texts, building low and high fidelity prototypes, conducting usability studies and iterating designs.
Time
Around two months.
Tools
Figma, Adobe Illustrator, Flaticon, UsabilityHub, ColorAdobe, ContrastRatio, Icons8, FontAwesome, Thispersondoesnotexist, Unsplash, Grammarly.
User Research
I conducted competitor analyses, interviews and used empathy maps to understand the users’ needs. After analyzing the data collected I could identify two main groups of users: artists and art collectors. For representing the goals and characteristics of each group I created two different user personas.
Competitor Analyses
In order to know the main competitors I analyzed some similar apps in the market. In this way I could discover their strengths and weaknesses. The competitor analyses provided me with useful information for identifying new business opportunities.
Interviews
In this phase of the research process I asked seven target users about features that they would like to find in an app such as “Global Art”. For organizing all the information collected I created interview transcripts.
Empathy Maps
The first commandment in UX design is keeping the user in mind. For this reason it is really important to build empathy maps. Through empathy maps I was able to get understanding of end users.
User Persona 1
Place Statement
Amanda is an art lover who would like to start her own art collection.
User Persona 2
Place Statement
Brian is a young artist who would like to sell some of his artworks in a direct and easy way.
Preparing the Design
At this point I started to design the way to bring to life the information collected in the previous steps. In order to complete this phase in a proper way, I always keep in mind “The Jakob Nielsen’s 10 usability heuristics”. These rules work like a bible for designers from all over the world.
Information Architecture
Defining a simple and clear hierarchy map is the best way to provide a good navigation experience for end users. That’s why I arranged the content keeping a cohesive sequential structure, easily understood by everyone.
Wireframing
After setting up the information architecture the next step of the process was focused on creating a visual guide that represented the skeletal framework of the app. For this purpose I made several wireframes. Firstly, I made them in paper format and, later, in digital version.
Paper Wireframes
Digital Wireframes
Low-Fi Prototype
In order to offer a first impression of my design intent, I created a small low-fi prototype where you can interact with the product and check out its functionality. Thus far I only focused on the art-collector option.
Usability Test
Before moving to the next stage, it was crucial to start a usability test as soon as possible. A good usability test will help us avoid problems in the future. I conducted two rounds of usability tests where a group of users tried to complete a specific task. I recruited the participants using the Hallway testing. Below, you can see some of the testers’ findings.
Positive Findings
- Breadcrumb navigation.
- Items for making click recognizable easily.
- Few steps to complete all the process.
Negative Findings
- Some buttons are too small.
- Some users didn’t understand the forecast layout.
- Too many elements on the screen.
UI Design
As you probably know, UI design is the process of transforming wireframes into a polished graphical user interfaces. Personally, this is one of my favorite steps because I can use my experience as a graphic designer to create friendly and useful design options. I used Figma to build the different interfaces.
Mockups
Based on the previous structure wireframes, I created these mockups. The intention was to provide a realistic impression about the final project for the skateholders. Mockups are a really useful tool that can save us a lot money and time. Nowadays, thanks to software such as Figma or Adobe XD, creating mockups is easier than ever. I still remember when I used Photoshop for making interfaces.
Content Writing
For me, UX Writing is one of the most important parts in the Design process, that’s why, considering the previous research, I always try to adapt the message to the potential users. In this case, I adopted a tone clear, concise and useful, looking for a good balance between the brand’s personality and the user’s needs.
Adding Interaction
When I get to this stage, I always feel like Doctor Victor Frankenstein just before bringing his creature to life. This is an exciting moment for me!! The next step is crossing my fingers because I would not want my finished product to resamble the original Frankenstein. So far, I have added some interaction effects, focusing only on the art collector’s perspective.
Design System
If “behind every great man there is a great woman”, I think that behind every website or app there always should be a solid design system. I used a combination of orange and white because I think it creates a nice balance between calm and energetic. In this way, I have tried to convey a gratifying feeling out of users. Concerning the typeface, I chose work sans, especially for its clean style, very appropriate for a good reading experience.
Accessibility Considerations
In order to align the design with the standars of accesibility (WCAG), I applied a high level of color contrast to text and graphics. For calculating the contrast I used the website contrast-ratio.com. I also used icons that have a title tag, so screen readers will be able to read them correctly. In addition I increased the typefont size in order to improve the accessibility consisted in increasing the size of the typefont that I used.
Takeaways
Impact
I hope “Global Art” provides a certain freedom for artists and art collectors. The new technologies are changing the ways in which humans interact and the art market needs to update their business models. I consider this app to be very useful in shifting old mindsets and creating a modern concept of global community in the art world.
What I learned
I learned the importance of using a design methodology focused on the user. In the past, the process of building digital products didn’t account for the user’s perspective. That’s why so many websites or apps were poorly designed and lacked functionality. At the beginning, the UX design process can seem overwhelming. You have to manage so many things and you spend a lof of time doing tasks!! But when you start to gain insight on UX, you realize that, in the long term, by using this design process you will be able to create more consistent and friendly products. After this experience I think I have become an UX addict. I can’t wait to build my next project!!
Thanks for Scrolling!!
