Artchives

App Design
Date: January 2022 - March 2022
Role: UX Designer and UX Researcher
Teammates: Ren Sy, Analis Lechien, and Audrey Chung
Project Overview
Artchives is an app prototype created in Figma that would connect artists of different levels in order to promote events, sell works, watch demos, private message others, and explore other works. We began by conducting a competitive analysis, identifying themes and need, interviewing artists, and creating storyboards and personas for our stakeholders. After creating an initial lo-fi prototype, we continued developing the visual aesthetics of the app and conducted user testing in order to achieve our final prototype.
Problem Statement

Artists at any skill level need to create relationships with other artists of various skill levels in order to find new inspiration, reach a wider audience of people, attend or promote workshops and events, teach or learn new skills, and overall find more enjoyment in their craft.

Background
Artistic outlets can be a great source of stress relief, a form of self-expression, and even increase confidence. But how many times have you started a new hobby and not gone through with it? Novice artists can experience many difficulties which cause them to quit before reaching their potential. For example, not knowing other people with the same interest, struggling to find inspiration, or having difficulty learning a new skill. When learning a new artistic medium it is beneficial to create connections with artists of all levels. For newer artists, these connections can provide them with people to show their work, inspire future projects, or help them learn something new. Additional connections can also benefit more experienced artists looking to pass on knowledge, display their skill level, or promote their workshops or events. Having others to share and create art with not only enhances one’s abilities but also makes for a more enjoyable experience which they are likely to continue.

User Research

Competitive Analysis
While artists use many of the general social media platforms to promote their works for free, it does not fit their needs properly. Social media can be detrimental to self-esteem through competition for likes and followers with others and even themselves and can also harm creativity by feeling pressured to follow trends rather than working on something more novel and personal.

Furthermore, many of the current social platforms dedicated to artists have potential. From workshops to shop features, these apps strive to cater towards the art community. However, our competitive analysis has shown us that one common disadvantage these apps share is that they have only some of the listed capabilities, forcing artists to switch between many platforms or pick and choose which features are most important to spend time with. The most consistent feature across the apps was a feedback system, although this feedback is received in a variety of forms. The various forms include followers, likes, comments, live chatting, and product reviews. Taking inspiration from a few of these competitors, we created an all-in-one art application called Artchives.
Apps Compared:
  • Instagram
  • Twitch
  • Youtube
  • Class101
  • Discord
  • ArtStation
  • Etsy
  • Choice App
  • DeviantArt
Topics of Comparison:
  • General Feed
  • Free or Paid
  • Events and Workshops
  • Search Capabilities
  • Learn New Skills
  • Sell Art
  • Feedback Systems
  • Top Features
  • Networking
Themes and User Needs

Selling
‍
Artists need a space to sell their work
Teaching
+
Learning
Artists need a space to teach or learn from one another

Networking
‍
Artists need a space to network with peers

Creating
‍
Artists need a space to share their creative works

Inspiring
‍
Artists need a space to find inspiration

Personas

The personas capture the two different types of stakeholders we would like to cater towards. They have different needs, but can also fulfill some of each other's needs in a mutually beneficial relationship. Alex is a younger, more novice artist, whereas Linda is an experienced artist looking for someone to mentor or teach. Our primary persona is Alex who represents the younger art student. His needs include the ability to promote his work to a wider audience, the ability to receive feedback on his work, and the need to learn from older, more experienced artists through demos or workshops. Our second persona Linda is an older more experienced artists who has trouble navigating a multitude of online platforms and prompting her workshops to younger artists like Alex.

Storyboards

After identifying the needs of our stakeholders through creating personas we were able to visualize how Artchives could be the solution to their problems. We followed the pattern of context, problem, solution, and resolution when drafting our stories.

Alex is nervous to ask his friend for critique. His friend does not give helpful advice.

Alex's work barely improves over months.

Alex learns about and posts his art on Artchives and receives great feedback!

Alex improves his art technique by following the feedback in the comments.

Context

Problem

Solution

Resolution

Linda posts flyers for her painting workshop.

Linda tells Cindy that no one came to her workshop.

Cindy shows her how she promotes her workshops on the events tab of Artchives.

Linda posts her workshop on Artchives and many people join her class.

Context

Problem

Solution

Resolution

Interview Insights

Before designing the flow and layout of our first prototype, we wanted to learn more about what features artists find most valuable in the apps they currently use and where there's room for improvements.
  • Difficulty finding other artists in small towns or when travelling
  • Too much pressure on conventional social media apps
  • There were a variety of answers on whether they felt comfortable reaching out to others online
  • Would like a safe place for constructive criticism and to display their portfolio
  • Becoming successful on social media can be due to luck rather than skill
  • The ideal platform is a place to collaborate and exchange ideas
  • Looked to Instagram for inspiration, but would love a platform for just art where you can filter what appears.
  • Hard to find upcoming creator's posts

Prototype Development

Sketches
This is one example of the four sketches we made in preparation for wireframing. The sketch includes red and green text which provides notes on how the apps flow may work. We included several features that were needs for our interviewees and personas. For some sketches, we used layouts similar to other apps like Instagram, since many of our users would be familiar with how they function. There are multiple layout options for certain pages, including various layouts for the feed/explore page and how the menu can be displayed.
Wireframing
To the right is a larger preview of our Artchives wireframe, including the side menu, scrolling feed, explore page, events page, shop, and user profile. Below is our entire wireframe which features red text and arrows that depict the possible flow of the app and additional pages. The additional pages include using the shop filter, a search page, a log-in page, and messages page. Our wireframe provided us a general outline of what we wanted to create. We knew some of the key features we wanted to add and needed a main hub of where to access all these features. The side bar seemed like an easy way to display and access the functions of the app where it can be accessible throughout. This wireframe is later expanded upon to create our lo-fi prototype.
Lo-Fi Prototype +
User Testing
Our Lo-Fi prototype expanded upon our wireframe by adding additional pages and adding clickability. The following pictures display some of the new pages, including filters for the shop, creating a new post, and a settings menu. The clickability allowed for us to complete user testing in order to receive feedback about the initial aesthetics and flow of the app. Interviewees generally found the application to be aesthetically pleasing and interactive. One concern that we found between a majority of our users was that the app was slightly difficult to navigate through. In order to account for this problem, our team proposed to add a statement page or help page in our next iteration.
Mood Board + Style Guide
We created a mood board and style guide in order to have the aesthetics of the app match the specific look and feel we wanted to attain. We began by coming up with a list of adjectives that we wanted our app to give off. We then began a Pinterest board in order to add photos which represent these words. We stuck with warmer, more neutral tones and pictures of art, buildings, and travelling. Based off our mood board, we curated our style guide to help us upgrade our prototype from low to high fidelity.
  • passionate
  • freestyle
  • comforting
  • creative
  • peaceful
  • minimalistic
  • welcoming
  • colorful
  • warm
  • explorative
  • eclectic
  • expressive
  • calming
  • abstract
  • romantic
We created an initial version of the style guide, then edited it to this final version after receiving feedback. One comment mentioned that we should “tweak the color palette to match your lovely style guide a bit better- a gray brown to emphasize antique buildings and city life could be good for example.” We took this advice and changed our warmer brown color to something slightly more gray to match the style guide. During our initial hi-fi we also received feedback to add more darker tones in order “to help differentiate screens and add some contrast” and to add more of the brown/red colors since they were more underutilized in our initial design.
High Fidelity Prototype
After implementing elements from the style guide into the prototype, we conducted additional user testing to create our final design. In our second round of interviews, the participants were asked to complete several tasks so that we could analyze the flow of our app. All interviewees were able to complete the tasks, but some took longer than others, pointing out some areas lacking discoverability or ease of use. Some suggested pages they consider most important, such as profile, should be located near the top indicating they would like that page to be the home page. Based on previous feedback, we added a mission statement page.

Our mission statement rang true as many users were able to navigate through the app quite efficiently while understanding a lot of its purposes. The most useful features were the tools centered around navigation such as the sidebar and filters. Many users also liked how the shopping feature was laid out where the Artist, price, and number of reviews would display upon hovering.
Reflection
Completing this project taught me a lot about conducting user research and developing a UX design prototype. Artchives was the first UX Design project I took part in and while I would do some things different now, I am proud of it because it started me on my UX Design journey.
‍
For being a first project only lasting about 10 weeks, the scope of our project was quite large. Our final prototype included 36 separate Figma screens and many functions. This caused us to really expand certain features, but neglect others. For example, our shop and review pages look nice and are detailed, but there was only 1 page showing demos. Despite its downfalls, this project taught me a lot of skills crucial for future work as a designer.

At the time of this project, I didn't consider myself an artist, which helped me step back and learn more about how to see the perspective of our stakeholders. Additionally, the creation of the mood board and style guide taught me to be intentional when choosing colors and fonts in order to create specific branding and enhance the user experience. It was also my first time using Figma, and I was able to learn a lot about its features and capabilities which helped me in future projects.
madysonwilkins.design@gmail.com


© by Madyson Wilkins - Created Using Webflow
⇧