ShareBio App
PROJECT BACKGROUND
Designing a new Artist’s Bio app that includes the ability to create the bio, link it to websites and galleries, add social media links, and share the completed bio on artist-chosen social media channels.
Before launch, I conducted Foundational and User Research to determine app features, accessibility, and usability. I also conducted User Testing with the high-resolution prototype to understand specific challenges our users might face so we can find solutions to help them fix those challenges.
FOCUS
A) Simplify the app experience for non-tech-savvy and access-challenged users
B) Incorporate WCAG 2.1 accessibility into the the app
C) Design a(n) MVP that may expand in the future, as the product succeeds
FOUNDATIONAL RESEARCH
Determine...
How often do artist's need to self-promote to bring attention to their work and upcoming shows?
What is their current user experience around self-promotion?
How useful do users perceive the the ability to share their bio and links via social media?
What can we learn from the steps that users currently take to self-promote?
Are there needed features that we have not yet considered?
RESEARCH GOALS
Assess whether this is a viable solution for artist's self-promotion, and if there are additional preferred features.
METHODOLOGY
Moderated Remote (via Zoom) Usability Study using Figma Lo-Fidelity Prototype
PARTICIPANTS
Participants are all creatives who sell their creative work online. This includes full-time or part-time workers, students, caretakers, and/or parents.
Eight total: Four females, three males, and one non-binary individual between the ages of 18 and 79. One participant is a person with a physical impairment and another has a hearing impairment.
User Journey Maps for our personas, Weldon and Adeline.
Story Boards — Big Picture, left; Closeup, right
User Flow — Main and secondary user tasks
LOW-FIDELITY WIREFRAMING AND DESIGN USABILITY STUDY
Ideation and Wireframing started after UX Foundational Research revealed the features which would be most helpful to creatives: Simplified UX allowing sharing of basic bio with web, gallery, and event links to social media channels.
Wireframe iteration
Due to my disABILITY, hand-drawing paper wireframes is not an option, so I created these in Powerpoint. Versions A, B, C, D, and E (right, below on mobile) show the home screen iteration process.
Accessibility considered from the start. Best solutions for each combined into one refined version, shown at the bottom.
After laying out the User Flow, and iterating on key screens, I moved to Figma to create the digital wireframes and prototype (see below).
UX Design Research was conducted with the Wireframes (above)
and the resulting feedback were categorized in an Affinity Diagram (below).
UX Design Research proved that creatives were looking for simplified UI that was easy to navigate and complete. The feedback about the app, the 'Edit Existing Bio' and Profile features, and incorporated changes to the mockups.
View the updated ShareBio Wireframes on Figma.
DESIGN SYSTEM, HIGH-FIDELITY PROTOTYPING, AND USABILITY TESTING
After completing the UX Design Usability Study with the Low-fidelity (Wireframe) Prototype, the next step was to incorporate all the wireframe improvements, developing a design system, and all changes into a High-fidelity Prototype in preparation for the next round of Usability Testing.
ShareBio Logo | Pristina font
Blue #0012B5 on white / light OR
White on Blue #0012B5 / dark
Primary Dk Blue #0012B5 | Maroon #B3000 | Charcoal #585656
Since this application was designed for use by a wide variety of creatives, it was important that the design be usable and not distract from each creative's own work. The colorful but generic background image was derived from a portion of a photograph, taken 'accidentally' by Nancy Barry-Jansson, and used for the Splash and initial app screens. This is the kind of 'happy accident' that inspires creative play and helped guide the development of design system colors! Other portions of the photo also shown in this page header.
Below is a silent (no captions) video of the ShareBio Hi-Fidelity Prototype (below) showing the main user flow plus example of menu navigation.
Another round of User Testing was done on the High-fidelity Prototype. The overall response was positive, with all participants easily able to start and complete the main user flow. This proved we had a(n) MVP (Minimal Viable Product). One minor suggestion was made to allow users the option in the Profile screen to replace the default Home Screen image with their own creative image.
Before development, this project would benefit from additional UX Research to confirm it will add value in the current market.
KEY PROJECT TAKE AWAYS
While I enjoyed learning the UX Design process, I was most impressed by the following:
It is so crucial that the project(s) chosen have a true business need in the market, and will benefit the company financially. Once I got into the project, I realized that a free app in a saturated market doesn't make a lot of business sense.
As the sole UX / IX Designer on this project, the lack of input from other team members (Developers, Engineers, Marketing, Sales, Customer Service, etc.) was a noticeable disadvantage. Other team members provide valuable insight and brainstorming that will improve both the end-product and the UX design process.
I was astounded by how much I enjoy UX Interaction Design (wireframing / prototyping / design testing). It was so much fun to apply the user research conclusions to the design process, and find ways to make the interaction effective and accessible.