NOV 2021 - JAN 2022
ARTHAUS is a Figma mockup for a mobile app that lets artists auction their work off to other users who are looking to purchase art. The concept stemmed from a prompt provided by Google as part of their UX Design Certificate program.
OVERVIEW
This was the first project I created for my UX Portfolio, so I focused on getting comfortable with Figma & designing a friendly, colorful, and accessible art exchange that caters to casuals and connoisseurs alike.
The art market has a large barrier to entry and can intimidate people who have no knowledge of how it works, but wish to enjoy and collect art. It also tends to overlook artists who aren't represented by established galleries.
Design an intuitive, comfortable app for artists to sell their original work without having to be represented by a gallery, which can also be used by enthusiasts and collectors to find exciting, new artwork from artists worldwide.
TABLE OF CONTENTS
- TRY IT FOR YOURSELF
- USER RESEARCH
- COMPETITIVE AUDIT
- ASSORTED FINAL MOCKUPS
- INFORMATION ARCHITECTURE
- USABILITY STUDY
- CONCLUSION
NOTE FOR DESKTOP USERS
Once the page finishes loading, you can navigate with the number keys. 0 = top, 1-7 = Table of Contents, 8 = Downloads, and 9 = bottom.
Move to the next or previous section with the + and - keys.
NOTE FOR DESKTOP USERS
Once the page finishes loading, you can navigate with the number keys. 0 = top, 1-7 = Table of Contents, 8 = Downloads, and 9 = bottom.
Move to the next or previous section with the + and - keys.
NOTE FOR DESKTOP USERS
You can navigate through this page with the number keys. 0 = top, 8 = bottom, and 1-7 is everything in between.
Moving from section to section is possible with the + and - keys.
-1-
TRY IT FOR YOURSELF!
INSTRUCTIONS: For a complete user flow, click the eye image at the top left hand corner of the home feed. You will then be able to interact with a listing, make a bid, and proceed to checkout.
NOTES:
- It may take a little bit for the images & icons to load, especially the artwork.
- If you ever get lost, click anywhere on the screen. The blue boxes indicate things you can interact with.
- The first two topics under the EXPLORE section of the TRENDING page only have listing information for the art that initially fills the screen. The rest of the works you see as you scroll around are there to primarily demonstrate the omnidirectional infinite scroll, so pressing + holding them won’t show any information. The other two topics are just there for show.
- In actual production, Visual Search would scroll infinitely, which isn't possible here. Also clicking the top work doesn't take you to a listing, it is just there for show. The other results that DO appear on the page can be clicked to demonstrate how Visual Search would reload and track input.
- For the best view, open the prototype in full screen and select either “Fit to screen” or “Actual size (100%)”
- For the best performance, I recommend turning on GPU acceleration in your browser
Browsing interactively requires a wider device. Try visiting this page on your desktop, laptop, or tablet!
-2-
USER RESEARCH
Based off 10 initial interviews, 3 user personas emerged- 2 of which were used as the main representation of the target user base as the design process moved forward.
There were 2 sets of questions asked based around either buying or selling art.
Participants answered both sets of questions to avoid any implicit bias regarding their background / perceived inclination toward using the app:
For the Buyer or Enthusiast...
Which essential features do you need to comfortably BUY art through an app?
What kinds of art would you purchase?
How familiar are you with the process of an auction?
How can your confidence about the item's condition be increased before purchase?
For the Seller or Artist...
Which essential features do you need to SELL art through an app?
Do you use any existing platforms to sell your work? Which ones?
What is a sale split ratio you would deem fair?
Where's the biggest area for growth in your current artistic path?
This allowed me to pinpoint 3 pain points.
COMFORT
Collectors & hobbyists want to engage in the art market but avoid the pretentious nature and price points of the fine art world.
ACCESS
Being able to peruse and purchase genuine artwork is not readily available in a user-friendly format with low cost of entry.
INCOME
There is no accommodating platform for non- gallery represented artists to reliably generate income for themselves.
From the interviews and pain points, I was able to paint a clearer picture of my audience through these personas.
LIANA is a film maker
who needs to purchase artwork to decorate her new apartment.
Liana is a recent media studies graduate who’s moving to Washington, DC to film a documentary. Apartment hunting was brutal but after finally locking down the perfect spot, Liana wants to decorate her new home base with some art. Fine art is definitely out of her price range, but she insists on finding 1-of-1 pieces that her neighbor down the street can’t just get from Redbubble or Etsy. Liana wonders if there is some kind of platform for securely purchasing authentic art from verified artists.
ASPIRATIONS
- Turn her final project about lobbying in the government into an even deeper and more polished dive into the subject.
- Craft the perfect feng shui in her apartment - she'll need it after a long day of filming, editing, and interviewing.
- Have enough savings to comfortably drop money on artwork for her place.
FRUSTRATIONS
- "I have trouble finding a convenient way to buy art I can like AND afford."
- "I’m not familiar with many artists or the ways of the art world."
- "I don’t know the purchasing power for my budget."
MIKE is a warehouse associate who needs to expand his artistic brand so he can leave his job & become a full time artist.
Education
Community College
Mike is an aspiring full-time artist from North Philadelphia. He works part time at an Amazon warehouse while he hones his skills, and finally feels comfortable selling his work. He knows building rapport as an amateur in the cut throat art market is hard, so he seeks a platform where he can grow his name, gain new inspiration, and push his work out there. However, Mike begins to dislike how the available options cater more to social media or general e-commerce rather than sharing and appreciating art.
ASPIRATIONS
- Make enough money from art commissions to quit warehouse job
- Develop a unique style for himself and popularize it
- Network with different creators to build connections and stay updated on his peers
FRUSTRATIONS
- "I need a unique artistic fingerprint so I can leave my day job."
- "It’s hard for me to learn more when the platform is complicated or access isn't straightforward."
- "Who am I competing with? What are their price points? How can I make myself stand out from them?"
GREG is a marketing analyst who wants to discover new artists to continue growing his personal art collection.
Greg is a marketing analyst who has worked and consulted for various companies since he graduated from college years ago. His father collected coins as a hobby and always encouraged him to take up something similar. What started as comic books and action figures has gradually turned into a full blown collection of obscure paintings, small sculptures, plushes, limited edition digital prints, and more. To find unique work, he usually hunts for lesser known artists through services like Instagram, but the process is cumbersome without fleshed out tools for filtering artists, controlling his algorithm, and managing the different works he likes, dislikes, saves, etc.
ASPIRATIONS
- Accrue more disposable income so he can obtain even more niche art
- Connect with more local artists that he might be able to meet with in real life to build a relationship
- Find some dedicated, focused art exchange that empowers less wealthy yet enthusiastic collectors like himself
FRUSTRATIONS
- "I love what I have but hate how long it took me to get it - California, student debt, and professional stability have made finances tough."
- "I wonder what kinds of wonderful artists are right next to me that I don't even know about!"
- "Maybe Artsy isn't for me right now, but there MUST be some similar avenue for exploring creative work for sale that interests me."
PUTTING IT ALL
TOGETHER
I decided to move forward with the last 2 user personas as they best reflected the intended demographics:
Unrepresented & amateur artists looking to sell their work & build a following
Collectors who want to expand their own pool of art and stay informed about interesting, new artists.
This allowed me to finally craft a focused and clear goal statement:
"ARTHAUS will let users sell their own original work as well as purchase the work of others, which will affect rising artists by giving them a platform to build and capitalize off a following of fans, and aficionados of more modest means than the usual auction crowd the ability to exercise their passion for art and culture."
-3-
COMPETITIVE AUDIT
The following 3 sections detail the findings of a competitive audit I conducted into my competitors. You can view each individual audit for
Artsy,
Saatchi Art, and
Artmajeur.
Below you'll find all 3 audits available on Figma for interactive browsing- if you want to view it this way, I recommend setting the zoom to max so you can just scroll and read along.
If you just want the TL;DR, click
here to skip to the summary.
Browsing interactively requires a wider device. Try visiting this page on your desktop, laptop, or tablet!
ARTSY
"As the leading marketplace for art by the world’s emerging and established artists, we’ve made it easy for new and experienced collectors to discover, buy, and sell art—and so much more. Everything you’ll ever need to collect art, you’ll find on Artsy."
Statistics
Averaging 3 million visitors over the past 3 months
Average visit duration: 2 minutes and 31 seconds (02:31)
Top 3 countries: USA (41.3%), UK (8.1%), and CAN (4.8%)
Biggest demographics: 25-34 (28.6%) and 18-24 (20.5%)
Points of Interest
Art Genome Project
Artsy's search technology is powered by ~1200 genes, which are attributes like historical movement, subject matter, colors, and so on developed with art historians, galleries, and curators.
Editorial Content
Artsy has a section in their website with articles, insights, and opinions on current happenings in the art world like trends, must-see shows, and creator spotlights.
Viewing Rooms
Available only with Plus, Premier, and VIP plans, users can create immersive digital viewing rooms to establish the context behind a work or series of works and provide a conceptual overview.
UX Insights
Click an image to learn more. Click again to go back.
Features
+
Ability to follow artists and even tags
Price Database with historical auction results
Art valuation courtesy of their curators
Wide range of works from institutions worldwide.
-
Users cannot interact, negotiate, or connect with artists, only institutions.
Price Database may contain inaccurate or missing financial data.
$1000 to maintain a membership, and different tiers after the fact.
Online feedback shows polarized customers, with positive reviews reading like copy.
NFTs, which have been proven by now to be a
scam that defrauds gullible investors. No excuse for the self proclaimed "leading marketplace for art" to enable its users to fall victim to fraud.
Accessibility
+
Nicely sized, readable headers and labels
Large images make it easy to see the artworks
Navbar provides constant access to essential features
Preview of artwork on hover
User Flow
Navigation
+
Lazy loading to improve page load
Lots of filters to make finding artwork easier
Thin scrollbars under all page sections
-
Sectioning of pages is ugly - relies on thin border that looks identical to scrollbars
Auction information isn't previewable, have to go from lot to lot to see current reserve price
Filters can be tedious and changes aren't batched so each selection causes a pause and reload
Disjointed flow - even upon finally getting to a page, each little sub section requires more waiting.
Analysis
Artsy does not prioritize or share any of the same goals as Arthaus. Arthaus is about empowering both sides of the spectrum - collectors AND artists - by allowing both parties to directly foster a connection, while Artsy clearly wants to be more of a traditional art brokerage a la Sotheby's or Christie's.
There is no synergy between producer and consumer - and having to constantly deal with middle men to place a bid, make an offer, or even make an inquiry (since sometimes prices aren't even listed) drudges up the whole process.
Artsy is clearly targeting established galleries and museums as their audience, and their information architecture feels more like a market than a community. Furthermore, they do not take authentication seriously at all, and even claim no responsibility for any false or misleading listing information. They have poor customer support, do not inspect curated auctions, and acknowledge they have no standards for the level of truth required in item condition descriptions.
Their Art Genome Project has been on hold since 2020, and in April 2018
over 1 million of their users' information was stolen yet Artsy did not confirm or announce this until 2019. The user passwords were encrypted with SHA-512 which
is not recommended at all, and for a company with 2+ million users across 190 countries, it is a glaring lack of compliance. At Arthaus, customer support and security are equal in importance to fostering sales, because all three are essential for a thriving platform.
For more reading, I recommend
this article, which goes into much better detail than I ever could regarding all their issues.
SAATCHI ART
"THE BEST PLACE TO BUY ART YOU LOVE. Discover an unparalleled selection of art by artists from around the world to suit all budgets, styles, and spaces."
Statistics
Averaging 2 million visitors over the past 3 months
Average visit duration: 3 minutes and 5 seconds (03:05)
Top 3 countries: USA (35.2%), UK (8.0%), and GER (6.0%)
Biggest demographics: 25-34 (27.9%) and 18-24 (19.5%)
Points of Interest
Visual Search
Another variety to their typical search lets users browse visually by selecting an image and then viewing similar suggestions
Quality Art
Aside from the prints they offer, the quality of work by the artists on Saatchi has received warm reception.
Art Advisory
Should you request it, a Saatchi Art Curator can suggest a selection of works personalized for your style and space, free of charge.
UX Insights
Click an image to learn more. Click again to go back.
Features
+
Users can sell their original work!
Global selection of all kinds of art from sculptures and digital prints to paintings and photography
Image based search in addition to regular search with a great selection of filters
Gift cards, coupons, and deals
Charity Named
Saatchi Gallery that promotes & support emerging artists
Loyalty rewards program for dedicated collectors called
Curator's Circle
Accessibility
+
Text alternatives for non-text content
Captions for videos with audio
Keyboard only navigation available
Clear headings and labels
Email for any accessibility inquiries/concerns
User Flow
-
No comparison between discounts vs offer price shown, meaning you can actually pay more by making an offer vs taking a discount
Even with a good Internet connection, load times between every single action makes the experience feel slow
- Comparison and filter features outside of search are lacking
No direct communication between buyer and seller!
Trouble performing or proceeding
with basic tasks
+
Good distribution of calls to action
Content takes up page space nicely, layouts are clean and feel purposeful
Compact design scales well on mobile
Back to Top on all pages
-
Search filters are displayed vertically which means even selecting just one can require scrolling
No scrollable preview of image on hover
Cannot adjust results per page until reaching the bottom
Navigation
Analysis
On the surface, Saatchi Art seems like a great, inclusive platform that pays more attention to the actual artists compared to Artsy, and prides itself on helping people discover emerging artists through programs like its Art Advisory service and Rising Stars series. It has a wide selection of work which makes features like its Visual Search a genius idea to increase immersion and remove everything extra surrounding the art, and running a charity that exposes the work of upcoming artists to a broader audience is admirable, but that's about where the good news stops.
Saatchi Art fails to convey information to its users regarding simple things like the
availability of a work before purchase, a transparent
cost breakdown, and accurate
tracking updates. Many customers have
trouble getting in touch with representatives at all, and despite their supposed 7-day 100% money back guarantee, there are endless reports from
people struggling to get refunds.
An artist today is only worth as much as their brand, and Saatchi has no mechanisms for artists to connect with and grow their followers, or migrate them from other platforms. Simple quality of life features like adding social links to artist profiles, or users being able to leave a note in a gift order are missing as well.
The positive feedback is very positive but the negative feedback is very negative, giving the impression that SHOULD everything go well then you will have a good experience- however, given that buying art online is a very finicky process, if difficulty comes your way then Saatchi appears to leave you on your own.
This hit or miss satisfaction is detrimental for both the website's users, whose odds of a successful transaction becomes a gamble,
and the artists, who have no way to streamline the situation because Saatchi mediates for you on every level.
ARTMAJEUR
"Artmajeur has been created to allow contemporary artists to present and sell their work by themselves, simply and intuitively. The gallery offers buyers and collectors a direct relationship with sellers: privileged access to artists around the world, without intermediaries, and with prices direct from the artist's studio."
Statistics
Averaging 1 million visitors over the past 3 months
Average visit duration: 2 minutes and 59 seconds (02:59)
Top 3 countries: FRA (37.0%), USA (8.6%), and GER (8.5%)
Biggest demographics: 25-34 (27.0%) and 18-24 (19.7%)
Points of Interest
Direct Sales
Artists can directly list, price and manage their artwork, including neat features like status updates & analytics.
Licensing
Artmajeur allows artists to select licenses for their works to determine the royalties they receive.
Art Image Bank
Collection of millions of original paintings and photography that you can purchase licenses to use.
UX Insights
Click an image to learn more. Click again to go back.
Features
+
Users can sell their original work!
Vast worldwide selection
Art Image Bank - commercial licenses for artists' work
News section in profile where artist can provide status updates
Archiving available for your works
Free returns!
Curated
collections from their art advisors
-
- 35% commission
Two account types - Basic and Platinum
Many features are reserved for Premium, which costs $60/year
Basic does not include Certificate of Authenticity
Basic does not include Certificate of Authenticity
Affiliate Program doesn't pay out until
30 days after purchase
Accessibility
-
NO MOBILE APP
Cannot proceed with results without scrolling all the way to the bottom
Mobile website requires tedious amount of scrolling - sections cannot be collapsed
Text size doesn't scale well from desktop to mobile website - they retain the small size on desktop
Can only browse one work at a time on mobile - one listing takes up whole page with no options to change layout, requiring even more scrolling
Filters are vertically stacked
Filter changes cannot be batched
User Flow
+
Can choose different display modes when browsing artist profile
Account creation guide for new artists to walk them through setup flow
Ability to request other angles of work directly from listing page
Viewing Room option
Overview of Shipping, Warranty, Payment, and Returns policies on every listing
-
Cannot see listing views
Customs prices not included in displayed price
Cannot see prices of sold work
Limited categories and tagging abilities for artists
Buyers can only directly DM sellers IF the seller allows messages
Buyers can only directly DM sellers IF the seller allows messages
Navigation
+
Translate buttons so if you run into something you can't read you can quickly view it in your native language
Design looks good on mobile
Great sitemap, seems like the most complete out of the 3 competitors
-
Cannot zoom images of artwork on mobile
Empty user profile fields are still shown and take up page space
Mobile navigation feels so much slower because every image is as wide as the screen
Cannot choose page number in search until bottom of page
Cannot preview works on hover
Analysis
Artmajeur seems to have its heart in the right place, but compared to the others just feels... empty. The site feels skeletal -
padding mistakes, cheap icons,
translation errors,
inefficient arrangement, and repetitive block layouts make the presentation feel bland and uninspired. The architecture feels phoned in; I mean, the first section on each art category's page is a collapsed information section that has the same copy on every page!
Month long sponsored artwork slots on the home page for which Artmajeur charges users
$1300 USD aren't even visible until you reach the bottom. They tell you clearly that they are footer banners but my point is
why? How does that help artists sell? How many buyers and collectors scroll to the bottom of the home page? I'd venture to say not many, especially if they actively use the site and have a flow already for how they browse and decide to buy artwork.
This seems to be a symptom of a bigger problem on the site: lack of engagement. Users have reported being on the site for years but still
failing to land an acceptable number of sales, or any at all. There is
no free promotion even with a Platinum Account. The site shoves
add-ons and
promotion options in your face which may not be an option if you're an emerging artist or you don't have the budget to promote every single work.
Artmajeur
reports that only 10% of its traffic are artists and the other 90% are buyers, which makes this even more bizarre - in a site full of interested buyers, how are artists struggling to get sales and averaging page views of 1 minute? My answer once again is that this is due to ignoring buyer-seller interaction. Even this
five star review laments this missed opportunity.
Monetizing every means that artists have for exposure on your site while not enabling them to create their own is flawed, and when you add how their commission has increased from 20% to
35% since 2020, it begs to ask why artists wouldn't take their chances elsewhere.
My point can be perfectly summed up by the last paragraph from this
review:
"I think that Artmajeur would do well to realize that they are broaching the world of brick and mortar galleries in their commission fees. With all the anonymity of the internet yet, they give none of the one-on-one personal experience that has often sold the piece. While we, as artists, will be left in a quandary as to whether we should simply show our work or sell it. For now, it seems, we are left with that old poker adage, hold 'em, raise, or fold."
AUDIT SUMMARY
Artsy and Saatchi Art both have an eclectic range of art for sale, but the problem is that both don't take accountability for the entirety of the user experience they provide, specifically quality authentication, strict shipping & delivery standards, and after-sales care. Artsy by design it seems, because their main priority is gaining the business of galleries and museums, and Saatchi by lack of specialization, since other ventures they fund like The Other Art Fair and Saatchi Gallery help them look good but consumes resources from essential areas the user values like fast customer support and accurate copy. This alongside the loose enforcement of these platforms' own supposed buying & selling standards results in an unpredictable environment for the buyer, which any experienced art collector will tell you does not suffice for an acceptable experience.
On the other hand, we have Artmajeur, who provides status updates, the ability to list on socials like Facebook and Instagram, and even enabling messages from buyers. It's a nice start, but emerging artists are still struggling to make waves because of an inability to develop personal relationships with their clients. Artmajeur's key revenue channels appear to be the promotion options that they provide, which along with their two-tier membership system, segments their artists into different classes. There's no community - comment sections are mostly empty, profiles all have the same layout, and the site promotes its exclusive collections but no user created collections. Despite claiming that there are no "intermediaries", the artist must go through Artmajeur if they look to maximize their chances of attracting an audience.
The focus of these platforms is on getting work sold and collecting their commission rather than helping artists make a lasting impression on their buyers. Artsy can be excused for this as original work isn't allowed to be sold anyway, but for platforms like Saatchi and Artmajeur who market themselves as supporting emerging artists, crucial features for heightening one's reputation are missing or paywalled. It's not the sale that's as important as making sure the buyer comes back.
Thus, there are 2 major opportunities here for Arthaus to address:
OPPORTUNITYArtists want to sell their own work, control their brand and image, and directly build a rapport with their audience
GAP
Artsy doesn't let artists sell original work.
Saatchi doesn't allow interaction.
Artmajeur allows limited/segmented interaction.
SOLUTION
Arthaus will make artist-buyer interaction the foundation of the app, with robust channels and methods for artists to grab and retain attention.
Interaction is the backbone of the app - following is just receiving notifications, but its the reciprocation of conversation, publicity of feedback, and sharing of content that is the crux for why Arthaus focuses on cultivating and protecting the welfare of the artist-buyer connection. This is the core of the app: the other features are just tools, services, and accessories to keep this dynamic afloat.
OPPORTUNITY
Collectors want to buy high quality, properly packaged, original artwork, and receive diligent support if they do not.
GAP
Artsy and Saatchi Art both have a laundry list of quality and customer care complaints, while Artmajeur is better but still lacking with post-purchase support.
SOLUTION
Arthaus will digitally authenticate all listings and enforce strict quality and shipping standards to minimize unhappy transactions.
From the moment the order button is pressed until the user confirms receipt of their item, Arthaus will strive to be available for any help or support they might need. One thing all 3 of these competitors have in common is the lack of assistance they provide to customers experiencing order issues, especially regarding frequency and quality of communication. Plus, artists and buyers can directly resolve issues rather than being forced to go through Arthaus itself.
-4-
INFORMATION
ARCHITECTURE
The key foundation for Arthaus to be successful was determined to be a mix of these three qualities: interaction, responsibility, and utility. These were the three criteria that all design decisions had to meet.
Note: Accessibility is a requirement for all 21st century design projects. That is - it's an implicit guide that must be satisfied in each step of the process.
Feel free to click any of the images below to view at full size.
The purchase flow puts emphasis on choice and exploration.
The upload flow puts emphasis on speed, accuracy, and authentication, with options to configure defaults and save settings so uploading isn't always a big hassle.
I wanted to marry the casual nature of browsing social media with navigating a worldwide art market, so I mimicked some design ideas seen in modern social media. Trying to encapsulate listings as feed items provided challenges, which I had to address when creating high fidelity wireframes.
This “SURPRISE ME” button behaves similarly to Google’s “I’m Feeling Lucky” option - it takes the user to a random art listing. This is a fun little example, but the main idea here is facilitation. The explorative nature of art is what invests people and deepens their interest.
ARTHAUS profiles provide quick, transparent access to the information buyers and sellers need. Preventing bots, fraud, and illegitimate activity is crucial for an art exchange, so I wanted the user to be able to tell with a glance whether a profile is real and worth their time.
The information architecture laid out in the low fidelity HOME FEED was cramped. So I pivoted to an infinitely scrolling flow of blocks via naturally distributing visual weight. The user can still view the information above whenever they want by pressing and holding one of the cubes in the grid.
Figma counts a press + hold interaction as identical to tapping, but in real life this could easily be achieved if this app idea was fully pursued.
.png)
.png)
REVAMPED LISTING
The low fidelity USER PROFILE was too limited, and based on the insights gathered from my competitive audit, I realized that each profile needed to feel like that creator's little corner of the app. So flexibility is provided through a combination of choosing the size of works displayed in the grid layout, to adding other pre- defined widgets that, for example, show collections the artist has been featured in or stats about their business, and so on.
There's another example of a user profile in the prototype, which will let you see just how different profiles can be, allowing users to really reflect and define their brand. In the future, enabling them to choose custom color schemes may be a good idea too.
.webp)
VISUAL SEARCH
REVAMPED HOME FEED
LISTINGS were refined with features to confirm digital authentication from ARTHAUS staff, show seller interactivity options, and indicate recent user interest. Holding the BID button lets you see the item's bid history while preserving bidder anonymity.
To make sure things don’t get constrained should more information be added to listings in the future, I chose a scalable design that could be seamlessly appended with more metadata in the future
REVAMPED USER PROFILE
As mentioned above, utility was a core design guides for the information architecture of Arthaus, and the immersion provided by VISUAL SEARCH benefits both creators and buyers. The current work is resized (aspect ratio is respected), and is shown up top. Tapping it takes you to that work's listing. There are 3 main controls from left to right: a BACK button to return to the previous result, a REFRESH button that resets visual search, and a HISTORY button that stores works you've clicked.
You'll notice the BACK and HISTORY buttons are grayed out because the user hasn't used Visual Search yet. Once you've filled up HISTORY with some works, you can directly compare them just like with items in your WISHLIST
Compared to the mundane and semi-formal look of my competitors, I opted for something more vibrant yet casual. My main motivation behind choosing round shapes, arcade-y fonts, and bright colors was creating a friendly atmosphere that gives the impression of buzz and activity.
Buying art is a serious venture, but that doesn't mean it needs to look and feel serious. Once all the infrastructure for successful, secure transactions is in place, using an energetic design language is crucial for Arthaus to stand out among other art exchanges.
Screens were designed to minimize scrolling and let calls to action grab the user's eye. They're hard to miss given that they're big colorful buttons. The colors have the following semantic meanings:
- RED is a general, meaningful action.
- GREEN is the currently available main action for a listing.
- BLUE is anything related to communication/email.
- ORANGE is for order related support inquiries and actions.
- YELLOW is for anything related to feedback & favoriting, aka feelings.
- DARK GRAY is used for Back buttons when presented a choice.
- LIGHT GRAY is used for unavailable or disabled interface items.
The other major factor in helping create a friendly, intuitive interface was a variety of interactive components on each page. In addition to providing robust navigation, this allows page items to become self-contained gateways to other related screens or modals, without jarring the user with a hard transition or making them leave the current screen they are on. Here are some examples:
Tapping the price on a listing pulls up the bid history for that item. Despite no site-wide auction history database (more on that later), bids on each individual item are publicly viewable.
Switching units under a listing, like from inches to centimeters as seen here.
Switch from Text to Visual search from the top of the search page, with a clear reminder of which screen you are in.
Easily compare items in your wishlist by pressing + holding, providing dual functionality since simply tapping an artwork on the Wishlist page takes you to that listing.
Switch from Text to Visual search from the top of the search page, with a clear reminder of which screen you are in.
Tapping the price on a listing pulls up the bid history for that item. Despite no site-wide auction history database (more on that later), bids on each individual item are publicly viewable.
Switching units under a listing, like from inches to centimeters as seen here.
Easily compare items in your wishlist by pressing + holding, providing dual functionality since simply tapping an artwork on the Wishlist page takes you to that listing.
- Visually striking UI components that are easily memorable through a combination of color, positioning, font, and iconography. I used these app wide with a consistent, recognizable layout to reinforce Gestalt Principles.
- Multiple ways of traversal with no gratuitous motions means providing a responsive smorgasbord of routes to digest the meat and potatoes of the experience without complex gestures or interactions.
- Jargon-free, meaningful text and links with full screen reader support. Whether it’s a listing, dialog, user profile, art inspection screen, or checkout page, all information is succinct and fully accessible.
- One meaning/action per icon. Icons were reused in a way where once a user associates them with a particular feature or screen, they know that's what it represents any time they see it throughout the app. Once again, this reduces the need to think while navigating, allowing regular users to develop muscle memory of sorts.
You can see all the assets and controls I used to create this mockup below:
-5-
USABILITY STUDY
You can view the raw notes taken in this study
here.
STUDY DETAILS
Participants were artists who wish to sell their artwork as well as art world enthusiasts, hobbyists, and aficionados who wish to buy artwork. This will best resemble the target audience for the app.
- Time: 20 minutes
- Number of Participants: 5
- Place: United States (Remote)
- Type: Unmoderated usability study
- How much trust is required for the user to complete a transaction?
- What do they see/don’t see in the UX of the app that adds to or harms this confidence?
- What actions can ARTHAUS take to increase confidence for users who wish to buy artwork?
5 out of 5 participants spend a lot of time browsing, going back and forth, and analyzing the different screens. Navbar appears to be an anchor of sorts.
INSIGHT: Having navbar visible at all times (except for certain immersive features like Visual Search and the Trending Explore Topics) is crucial for people to be able to move around effectively.
4 out of 5 participants said they wanted some additional payment options and security adjustments during checkout.
INSIGHT: Support alternative payment options like PayPal, allow check out with saved info via user authentication (ex. Face ID, PIN, or password), and provide an FAQ to clarify privacy and security concerns prior to the user's purchase.
4 out of 5 participants said they were most excited to use the app to search, discover, and support new artists they enjoy.
INSIGHT: Have multiple, easily usable channels for artist discovery: spotlight sections, follow suggestions, and filtering.
2 out of 5 participants said they wanted a comparison feature to simplify decision making.
INSIGHT: Enable comparing works in Wishlist and Visual Search History modal, which will help users make purchase decisions.
3 out of 5 participants felt overwhelmed sometimes by all the art in front of them and wanted recommendations more tailored to them.
INSIGHT: Track browsing habits (anonymously and with consent) to provide better suggestions, and have diverse recommendations in Trending section. Continue to improve and develop Visual Search.
DESIGN ADJUSTMENTS
Click on any of the below images to enlarge if needed.
.png)
The Spotlight feature lets artists highlight a particular work of theirs that they want to receive extra attention.This is some text inside of a div block.
Topics under the Explore section on the Trending page fill the whole screen when tapped for full immersion.
Added more sections and collections under the Trending page to facilitate decision making.
Added more filters for both users & listings including location, colors, and accepted payment options.
Save button becomes support button after purchase so buyers can always get help directly from the page of any problematic listing.
Buyers can send sellers a message with their order, like special shipping info or even a simple thank you note.
Implemented a comparison screen that shows in depth metrics for each work along with bid and contact buttons.
Topics under the Explore section on the Trending page fill the whole screen when tapped for full immersion.
The Spotlight feature lets artists highlight a particular work of theirs that they want to receive extra attention.
Topics under the Explore section on the Trending page fill the whole screen when tapped for full immersion.
Added more sections and collections under the Trending page to facilitate decision making.
Added more filters for both users & listings including location, colors, and accepted payment options.
Save button becomes support button after purchase so buyers can always get help directly from any problematic listing.
Buyers can send sellers a message with their order, like special shipping info or even a simple thank you note.
Implemented a comparison screen that shows metrics for each work along with bid and contact buttons.
Topics under the Explore section on the Trending page fill the whole screen when tapped for full immersion.
-6-
ASSORTED
FINAL MOCKUPS
Click to view full size, or download all screens and frames
here.
iPhone 13 Pro
HOME
SEARCH
USER PROFILE
.webp)
TRENDING
.webp)
WISHLIST
.webp)
WISH LIST SELECT
.webp)
WISHLIST COMPARE
.webp)
FEED FILTERS
.webp)
RANDOM USER
EXPLORE TOPIC
.webp)
LISTING
.webp)
ART INSPECTION
.webp)
SELLER RATINGS
BID HISTORY
.webp)
PLACE BID
.webp)
CART
.webp)
ORDER REVIEW
.webp)
CHECKOUT
.webp)
ORDER CONFIRMED
.webp)
TRACKING
.webp)
HOME
WISH LIST
RANDOM USER
SELLER RATINGS
ORDER REVIEW
SEARCH
WISH LIST SELECT
EXPLORE TOPIC
BID HISTORY
CHECKOUT
USER PROFILE
WISH LIST COMPARE
LISTING
PLACE BID
ORDER CONFIRMED
TRENDING
FEED FILTERS
ART INSPECTION
CART
TRACKING
-7-
CONCLUSION
NEXT STEPS
- Conduct more usability studies before launch to consolidate core features and ensure the user experience is intuitive, accessible, and meets industry standards.
- Review best language to use when describing auction process so all users can quickly grasp the system.
- Enable embeddable listings which artists can use to create portable listings wherever they'd like, such as their website, to facilitate sales.
- Add swiping from screen to screen for navigation to improve accessibility on desktop fnewer touchscreen laptops and tablet devices
- Begin iterating the artwork upload user flow as the current prototype centers on the purchase user flow.
- Verify that industry A11y standards have been met once prototyping and testing are complete to provide a full experience for A11y users.
COMPETITIVE POINTS OF DIFFERENCE
- Flat 15% commission on all purchases, which is possible because Arthaus does not need to support as much infrastructure as other competitors; there are no middle men to pay, and aside from customer support and curation staff, there are no additional organizational bodies. This is also a very competitive rate compared to rival platforms, allowing Arthaus to generate sufficient revenue with overstepping.
- Direct communication between buyers and sellers. A modern art exchange should enable and encourage artists and collectors to engage with each other. This was a common critique from users of Arthaus' competitors, who felt like genuine connection was blocked or hampered by the architecture of those platforms. Users still have the full ability to block, report, and ignore users that may be causing them problems
- Fully customizable artist profiles. There are no 2 artists who are the same, so user profiles should reflect that. From adjusting the layout of the visual grid to using pre-defined widgets and displayable statistics, all artists can take full control of their profile designs, which is another cornerstone of their brand.
- Value is determined by listing, not by history. While auction history databases are important in the high art world for established artists, they can hurt upcoming artists by applying constraints on the profits they could receive from a sale. The hammer price for all sold listings can still be viewed, but most sales data will only be visible to the artist. Each listing's value comes from the work it represents, which aids artist growth.
- Conflict resolution through personal responsibility. Customer Support should be a last resort when you have an app that fosters interaction as much as Arthaus. Reviews are public for all to see, sellers control their payment, refund, and shipping policies, and buyers can directly contact artists to resolve their issues. Should a conflict still persist beyond this, THEN customer support will get involved and investigate both sides. A strict three strike system will be enforced to mitigate bad actors.
- All users are welcome to buy and sell artwork. No segmenting users, no payment plans, no red tape, and no ridiculous commissions. Once your account is authenticated, you are ready to take full advantage of the app!
- Immersion is emphasized where possible. Whether it's through visual search, the sections of the Trending page, or taking advantage of the 360° view required for 3D objects, Arthaus wants you to get lost in the art - it's why you downloaded the app! Even the regular fluid block layout shows all works without immediately visible listing data, so each piece has the same shot of evoking something in the viewer.
- Various channels for promotion. There were reports from users who mentioned how even good competitors tended to neglect how important promotion is to an artist's career. Having dedicated curation staff, an affiliate links system, and built in social media sharing options helps Arthaus tackle this problem.
WHAT I LEARNED
I wanted to offer a solution that provides people who otherwise feel the art world is out of their reach or "not for them" with an accessible, exploration-focused shopping platform. Now if they want to purchase, appreciate, or share artwork, all they need is a smartphone. However, I learned that a designer's vision is more of a springboard than a guiding light, because for a product to truly be widely successful it must tailor the user experience around resolving the pain points of the target audience.
Given that this was my first UX project, I also want to sharpen my Figma skills and continue to develop my visual eye- especially regarding iconography, typography, conducive color schemes, & intuitive information architecture.
ALL DOWNLOADS
THE END
THANKS FOR TAKING THE TIME TO REVIEW MY WORK!
I BET WE CAN MAKE SOMETHING EVEN COOLER :)
