IntroductionProject DetailsEmpathyIdeationTestingFinal DesignsDevelopment GoalsFuture StepsCredits

Chrysalis:

Money for Panicked People

2.2023 - 5.2023, 8.2023 - 9.2023

UX Designer, Artist, Researcher, Idea Spelunker
Laura Sender

Introduction

This app was designed for people without astable income, people who need to see how much money they have RIGHTNOW and know their next set of bills will be paid, or people for whom traditional budgeting systems do not work.

Project Details

Problem

Visiting cultural institutions can be intimidating to people, are not always accessibility friendly, Many working adults and full-time students don’t have time to travel to and visit art galleries and museums.

Lack of readily available information for people interested on specific pieces published by verified sources Research on individual art pieces tends to be locked behind scholarly journals and other paid databases

Goal

Increase access for the public to fine art and provide an educational tool and database. The majority of students and educators do not have disposable income to use on art or scholarly literature.

Impact

This tool has not been used in the real world, however it has been tested for usability and accessibility including in a school context.

Key Competitors & Inspiration

History of Art

Website
Main page splash image

Tumblr

Website
Expansive image database

Wikipedia

Website
Expansive knowledge database but unclear authorship

Blase Art Gallery

Website
Information on pieces given by artist. Interactive experience.

Smart Art

Website
Personable blurbs

Saatchi Art

Website
Purchasable art organized into collections

Empathy

"Being able-bodied is a temporary condition."
- Bookstore Customer
User-centered design philosophy requires designing with accessibility first. Age is inevitable, and accessible designs welcome a much larger user base, improving the bottom line. This type of design leads to more usable products that require fewer bone-level updates and decrease the likelihood of class action lawsuits.

Accessibility Highlights

Motion

A dropdown menu in settings allows the user to choose their preferred language. Primary use of images and icons is designed to help navigate for users for whom reading is difficult.

Vision

Settings include a dark mode, light mode, and text size changes.

Language

Many different ways to navigate the app including multiple types of movement allow for a range of physical abilities

Closed
Captioning

Many different ways to navigate the app including multiple types of movement allow for a range of physical abilities
"You don't know who these kids will turn out to be someday, so your impact matters today."
Age:
48
Education:
MAT
Hometown:
Boston, MA
Family:
Cat and Adopted Child
Occupation:
High School Teacher
Problem Statement:
Arwen Connolly is a high school teacher who needs to see specific information about paintings because connecting the information
with her art history class.
Goals:
To give real-world context to what she is teaching in the classroom. To teach her students the importance of respecting other cultures while learning about global history. To be up-to-date with ways for students to learn, so using technology in addition to outside experiences is important to her.
Frustrations:
Communicating nuanced information to her diverse group of multiethnic, multilingual students. Some of her students are hearing, vision, or other ability impaired, and might not be able to read. Any software or app she assigns needs to be accessible. Any technology she is using must be intuitive for teenagers.
"What homework, miss?"
Age:
15
Education:
HS
Hometown:
Lynn, MA
Family:
Three siblings, parents
Occupation:
Student
Problem Statement:
Felicia has a history assignment coming up in which she needs to present the impact of colonization on a particular culture during a specific year. As a knitter she wants to focus on the fiber arts and dyes of the group she is researching.
Goals:
Her mother and grandmother regularly share their family histories around the dinner table. In that spirit, Felicia wants to show how an impact can be multigenerational, but also celebrate strides made today.
Frustrations:
Information is abundant but unreliable and often comes with an agenda.
"I want to give people the opportunity to see the beautiful things we have in the world while protecting the place those things come from."
Age:
27
Education:
BA
Hometown:
Tampa, FL
Family:
Wife, two children
Occupation:
Photographer
Problem Statement:
Jules Pierre is a professional photographer who wants to give historic context to materials by photographing them in their unharvested state in nature.
Goals:
Jules Pierre is a professional photographer who wants to give historic context to materials by photographing them in their unharvested state in nature.
Frustrations:
Jules Pierre is a professional photographer who wants to give historic context to materials by photographing them in their unharvested state in nature.
"Environmental justice matters for everyone. I hope in some tiny way every stitch I sew makes the world a little better."
Age:
43
Education:
MFA
Hometown:
Portland,OR
Family:
Spouse, guinea pig
Occupation:
Fiber Artist
Problem Statement:
TabBee is a fiber artist who travels the world going to different conventions to display their designs and find new clients.
Goals:
To learn more about the cultural and environmental impact of the materials they use to design their costumes.
Frustrations:
As a person with ADHD, they tend to fall down rabbit holes and lose information. They want a single place where they can both research art and save information for later.

Arwen Connolly: Sample User Journey

Actions
Download the App
Make an Account
Explore
Create Lists
Share Lists
Task List
Download from app store
Find special accounts for teachers
Browse art and materials
Add pieces to favorites
Post lists on Schoology
Emotions
🤔
😒
😄
🤔
😁
Fix-Its
Add education to search tags
create educator portal
Add tags for
art pieces
Add privacy options
Add multiple ways to share

Ideation

The Inspiration

I wanted to build something that looked and felt luxurious to use, contains beautiful imagery, and runs smooth as warm butter in a hot pan. I don't want people to feel hung up trying to find something, but rather to give the sense of excitement of chasing treasure down a rabbit hole.

Iteration Progression

Red stars indicate items I felt were important and wanted to keep.
Initial Sketches
Low Fidelity Mockup
High Fidelity Mockup

Research & Testing

Key Questions

Is It Usable?

Is it Pretty?

Does It work?

Sample Observations

The navigation is really simple on this.

Participant 1

Stock Image Used for Privacy

First things first - going to go into the settings. I am specifically looking for a dark mode that I would assume would inverse everything.

Participant 2

Stock Image Used for Privacy
Task Completion Key: 1. Easy to complete
2. Completed, but with difficulty
3. Not completed
N/A. Not Relevant or Available
Participant 1
Additional Notes: Neurotypical User
Participant 2
Additional Notes: User has ADHD and thus had difficulty following the prompts
Prompt 1: Navigate to an art piece
User #
Click Path
Observations
Score
User 1
menu - browse - material
user seemed to navigate pretty easily
1
User 2
search bar - menu - browse - art piece
User tried several things before finding their way to the browse option
2
Prompt 2: Navigate to a material
User #
Click Path
Observations
Score
User 1
artwork - material
took time to review the material page
1
User 2
artwork - material
Website stalls / needed to refresh Figma page
1
Prompt 3: Add an art piece or material to your favorites list
User #
Click Path
Observations
Score
User 1
Clicked favorites on top right of corner
Did so without needing to look at prompt
1
User 2
From current materials page - hit heart button
User immediately noticed the different aspects of each page
1
Prompt 3 follow up: How do you feel about the navigation? Is it intuitive? What would you change about it?
User #
Click Path
Observations
Score
User 1
N/A
Felt the back and forth between materials and paintings was pretty smooth
N/A
User 2
N/A
User seemed comfortable using a low-fi prototype and to enjoy exploring the different options outside of the prompts
N/A
Prompt 4: Navigate to your favorites page
User #
Click Path
Observations
Score
User 1
N/A
N/A
3
User 2
Tap favorites at bottom of page
Immediately found the favorites page from the bottom of the materials page
1
Prompt 5: Navigate back to the home page
User #
Click Path
Observations
Score
User 1
menu - home
Did so without needing to look at prompt
1
User 2
menu - home
User immediately found the home page without trying to hit the back button
1
Prompt 1: Navigate to an Artpiece
User #
Click Path
Observations
Score
User 1
menu - browse - material
user seemed to navigate pretty easily
1
User 2
search bar - menu - browse - art piece
User tried several things before finding their way to the browse option
2
Prompt 2: Navigate to a material
User #
Click Path
Observations
Score
User 1
artwork - material
took time to review the material page
1
User 2
artwork - material
Website stalls / needed to refresh Figma page
1
Prompt 3: Add an art piece or material to your favorites list
User #
Click Path
Observations
Score
User 1
Clicked favorites on top right of corner
Did so without needing to look at prompt
1
User 2
From current materials page - hit heart button
User immediately noticed the different aspects of each page
1
Prompt 3 follow up: How do you feel about the navigation? Is it intuitive? What would you change about it?
User #
Click Path
Observations
Score
User 1
N/A
Felt the back and forth between materials and paintings was pretty smooth
N/A
User 2
N/A
User seemed comfortable using a low-fi prototype and to enjoy exploring the different options outside of the prompts
N/A
Prompt 4: Navigate to your favorites page
User #
Click Path
Observations
Score
User 1
N/A
N/A
3
User 2
Tap favorites at bottom of page
Immediately found the favorites page from the bottom of the materials page
1
Prompt 5: Navigate back to the home page
User #
Click Path
Observations
Score
User 1
menu - home
Did so without needing to look at prompt
1
User 2
menu - home
User immediately found the home page without trying to hit the back button
1

Case Study Review

You made this really clear design that works really well. Why didn't you use it for the final prototype?

Fellow UXer

At the time when I was first making my high-fidelity prototype I didn't know how to animate a spinning wheel. Needing to meet class deadlines, I went with something I could animate but that did not meet my visual design goals. After having completed the course I went back and researched different ways to create clickable wheel that would both spin to location as well as be something the user could manually grab and turn. I would have given up on this design being worth exploring if not for the enthusiastic affirmation during this case study review.
Case Study
Review
😱
Both users were able to experience the core features of the app and have a good experience in spite of key neurological differences.

Change Examples

I had been so excited with my design for a magnifying glass/search icon and no one knew what it was. Future versions of the app used a more easily identifiable symbol. I still like my original design but it does not fit the user's needs.
I used what I thought was a standard filter icon and not everyone knew what that was. Future iterations will include text to explain the icon's function.

Final Designs

Development Goals

This app does not yet exist but if it were to be pushed into development, there are a few key elements I'd like to see implemented:

1. Add haptics to the scroll wheel.

2. Pay scholars to write the copy for each piece.

3. Include a shop for art materials.

4. Closed caption mode -click a button to remove the scroll wheel that enables screen readers to easily navigate the app.

Future Steps

If I were to continue iterating on this project here a few additional pieces I would want to include in future prototypes:

1. Change the logo - "Why does your llgl lllk like a piece lfmedical equipment?" is slme lfthe feedback I received.

2. Colorblind and low-vision filter icons available next o each image, preferably near where the "expand image" icon is located in order to normalize their use and make them easy to find.

3. Explore other accessibility options including the validity of dyslexic type.

4. Educator portal  - key for this to be useful in the education section and would include such QOL as a way to add assignments, extend deadlines, custom-set grading tiers based on lateness, and add custom names and pronouns for students.

5. Online Shop - connect users with a means to purchase materials found in art pieces that are gathered in a way that reduces environmental impact and improves the wellbeing of local communities. Highlight segment under materials showing "communities and people today" by providing additional information on family and community run businesses, allowing users to have a direct impact.

Credits

Unsplash and other credits In order of appearance