Craft Cache

UI / UX Design
WINTER 2020
Task:

Improve the experience of building mutually beneficial relationships between makers of handmade goods and store owners.

My Response:

An app that helps makers and store owners explore prospective partners, negotiate offers, send contract agreements, track inventory, and give feedback to one another.

Context:

_ 2 weeks
_ Personal Project

SELF AND WORLD ANALYSIS

A Personal Perspective

I began by examining my own life-world. I considered my personal journey as a designer and a maker. A common aspect I found was collaboration.

I chose to explore collaboration with nonhumans because I have a passion for those that go unnoticed. With emerging technologies changing the way we navigate the world, it is increasingly important to consider those who may get excluded and forgotten.

PROBLEMATIC

This project highlights observations, pain points, and areas for opportunity that I have found in my journey as a maker and in my endeavors to make collaborative business arrangements with store owners.





Nonhuman beings may not be readily noticeable, but their contributions to each other and our world are vast. They may be unseen, unheard, or unmoving to the human eye, but they are creating and sustaining symbiotic relationships within a plurality of species. And yet, we don’t often acknowledge these nonhumans when we think about collaborative problem solving, design and resilience within the world.

To continue reading please revisit on a desktop browser.

Nonhuman beings may not be readily noticeable, but their contributions to each other and our world are vast. They may be unseen, unheard, or unmoving to the human eye, but they are creating and sustaining symbiotic relationships within a plurality of species. And yet, we don’t often acknowledge these nonhumans when we think about collaborative problem solving, design and resilience within the world.

Journey Mapping

To begin, I mapped out key moments and considerations in the current exchange experience for the two main stakeholders: The Maker and The Buyer/Store Owner.

How might I improve the experience of building mutually beneficial relationships between makers of handmade goods and store owners?

Identifying Pain Points

For the scope of this project, I decided to focus on The Maker's journey because I could validate the paint points found from my personal experience.

Areas of Focus

Ideally, the design response would address pain points across all key moments, but for the scope of this project, I focused on three that showed immense room for improvement:

1. Search: Currently very time consuming, requires pivoting across different platforms, and there is a poor ratio between discoverability and time spent.

2. Storefront: A new key moment that would allow both makers and store owners to quickly access key information to inform their decision making and strategy.

3. Reach Out: Feelings of anxiety and uncertainty are high in this moment. Tailoring each pitch to a new store is time consuming.

Ideation: Search

The search feature needed to have a strong allowance for user control and freedom while also creating a helpful pathway for discoverability. I ideated four concepts that would allow the user to freely search for keywords, add filters, and receive helpful nudges or suggestions.

I moved forward with the second idea because it provided a clear search bar, a brief history, and keyword suggestions for quick discovery.

Ideation: Storefront

The storefront feature needed to convey information both visually and linguistically in order to allow users to quickly analyze and make decisions regarding suitability. Users need to know if the store is currently interested in offers, what they are looking for, what their atmosphere and style are like, and so on.

I moved forward with the third concept because the weaving of imagery and text would allow for efficient and fluid storytelling and reduce cognitive overload.

Ideation: Reach Out

The reach out feature needed to be clearly organized and provide visible opportunities for customization. By providing a set structure users will be able to quickly adjust their product offering based upon the store and gain a clear mental model of the information that store owners need.

I decided to move forward with an integration of the third and fourth concept. A tab view would allow for an immediate overview of the user's offering and a hierarchal cue to add needed information. The expanded card view (4th concept) would allow the user to focus on one group of information at a time, helping prevent errors or information anxiety.

Click to view full size

Wireframing User Journey

Using my sketches as a starting point, I created a wireframe in Figma for the user journey. Shown above is the process of opening the app, searching, viewing a store front, and the initial stages of reaching out to a store owner. This process allowed me to analyze which information was absolutely necessary on each screen and what details could be expanded and contracted.These wireframes also provided a strong foundation to begin refining the visual design.

Visual Design

The color palette was inspired by classic hues used in ceramics. The focus of the app is to highlight the users' products and stores so the palette needed to pop without being overbearing or distracting from the users photos.

SELF AND WORLD ANALYSIS

Confetti

I created a vector confetti pattern to be used throughout the app on screens related to the user's personal pages: Dashboard and Reach Out. The goal was to convey celebration and conversation in an exciting, yet subtle way.

PROBLEMATIC

Nonhuman beings may not be readily noticeable, but their contributions to each other and our world are vast. They may be unseen, unheard, or unmoving to the human eye, but they are creating and sustaining symbiotic relationships within a plurality of species. And yet, we don’t often acknowledge these nonhumans when we think about collaborative problem solving, design and resilience within the world.

SELF AND WORLD ANALYSIS

PROCESS

I sketched the initial illustrations in Procreate and refined them in Adobe Illustrator. I created multiple iterations of color palettes, pattern styles, and textures before determining  the final design.

PROBLEMATIC

Nonhuman beings may not be readily noticeable, but their contributions to each other and our world are vast. They may be unseen, unheard, or unmoving to the human eye, but they are creating and sustaining symbiotic relationships within a plurality of species. And yet, we don’t often acknowledge these nonhumans when we think about collaborative problem solving, design and resilience within the world.

Peer Critique and Refinement

As this project is a personal endeavor, and not situated within a classroom, I reached out to a fellow designer for peer critique of my visual design process. I gained helpful insight from a new perspective in order to identify gaps in consistency and points of confusion.

Notable Considerations:
1. Lengthen the width of search bar so it feels less like a button.
2. Be deliberate in the use of drop shadows.
3. Refine the "Details" card feature to feel more consistent.

Final Design

My final design response is Craft Cache, an app that helps makers of handmade goods and store owners build mutually beneficial relationships. The features in focus are Search, Storefront, and Reach Out. Each of these features help to improve discoverability, convey important information quickly, and create clear pathways for communication.

The title "Craft Cache" is a play on words, referencing both the organization of information and financial profit.

Click to view full size
Click to view full size

SELF AND WORLD ANALYSIS

Key Takeaways

This personal project allowed me to navigate unknowns, trust my process, and thrive within ambiguity.

I enjoyed designing a product that integrated my passion for visual and experience design, as well as craft and business strategy.

Moving Forward

In the near future I plan to share my design with fellow makers and local store owners to receive feedback. With these insights I hope to further refine and develop Craft Cache.

PROBLEMATIC

Nonhuman beings may not be readily noticeable, but their contributions to each other and our world are vast. They may be unseen, unheard, or unmoving to the human eye, but they are creating and sustaining symbiotic relationships within a plurality of species. And yet, we don’t often acknowledge these nonhumans when we think about collaborative problem solving, design and resilience within the world.

Echo

Interaction Design
FALL 2019
Task:
Create a working prototype of a piece of furniture that senses and responds to human interaction and present a product video.
Response:
The Echo bench plays a previously recorded message when someone sits down and offers an opportunity to record a new message to be played for the next person.
My Contributions:
Ideation, physical computing research, basic Arduino coding and wiring, construction and aesthetics, illustrations, After Effects video editing, and writing.
Team:
_ Verli Chen
_ Kevin Oh
Context:
_ 8 weeks
_ Team Project
_ Physical Computing Class
FINDING AND DEFINING THE SITUATION
We were first tasked to explore situations and spaces that could provide an intriguing opportunity for a responsive piece of furniture.

When brainstorming situations, I asked my fellow teammates what values they'd like to express in our project. We synthesized our interests into two themes:

1. Collaborative / Shared Experience
2. Subversive Design

Next, we utilized these themes to brainstorm a variety of specific situations and focused on three spaces.

1. Modern Stairwell
2. Outdoor Walkway
3. Shared Workplace
IDEATION
1. Speak Up Stool: Placed around a table within a collaborative workplace. The stool would rise or lower depending on the audio levels recorded from the sitter.

2. Quirky Pillow: Placed within a public workplace/relaxation stairwell, the Quirky Pillow would act like a "hot potato" and wiggle and squeak depending on audio levels recorded from a group of people.

3. Messenger Bench: Placed within a public outdoor space, the messenger bench would allow people to leave an anonymous message for the next sitter to hear.
REFINEMENT
As a team, we decided to pursue the messenger bench idea within an outdoor walkway space. We believed this idea offered the most potential to utilize our design themes, challenge ourselves within the scope of our time constraints, and offer an uncommon and engaging platform for human-computer interaction.


CODING, TROUBLESHOOTING, AND BUILDING
Pulling from various open-source resources online, we compiled an effective code and adjusted variables to suit our project's needs.

When we ran into coding obstacles, such as setting the internal timing for the 10 second LED, we would isolate sections of code and inspect each line until the functions were working independently. Then, we would reintegrate the code and move forward.

We created our bench from an IKEA table and restructured it to fit our computing hardware. We used a vinyl printer for aesthetic branding and typography.
FINAL DESIGN
The Echo Bench would be placed near a public walkway so that people could sit, reflect, and leave their message in a serendipitous moment. The interaction provides an opportunity for people to reach out to the world; to express concerns and hope within the safety of anonymity. People can express themself freely; whether that be voice, song, or other forms of audio. We defined this experience as "Echo: a messenger who reflects and reverberates the introspective expressions of humanity."
MOVING FORWARD
In the coming months we plan to coordinate alongside UW faculty to install Echo in a public space on campus. We hope to gain insight on how the experience is perceived, how it can be improved, and how to navigate the potential for both positive and negative impact inherent in anonymous messaging
Echo
INTERACTION DESIGN
FALL 2019
Task
Create a working prototype of a piece of furniture that senses and responds to human interaction and present a product video.
Response
The Echo bench plays a previously recorded message when someone sits down and offers an opportunity to record a new message to be played for the next person.
Team
_ Verli Chen
_ Kevin Oh
My Contributions
Ideation, physical computing research, basic Arduino coding and wiring, construction and aesthetics, illustrations, After Effects video editing, and writing.
Context
_ 8 weeks
_ Team Project
_ Physical Computing Class
Defining the Situation
We were first tasked to explore situations and spaces that could provide an intriguing opportunity for a responsive piece of furniture.

When brainstorming situations, I asked my fellow teammates what values they'd like to express in our project. We synthesized our interests into two themes:

1. Collaborative / Shared Experience
2. Subversive Design

Next, we utilized these themes to brainstorm a variety of specific situations and focused on three spaces.

1. Modern Stairwell
2. Outdoor Walkway
3. Shared Workplace
Ideation
1. Speak Up Stool: Placed around a table within a collaborative workplace. The stool would rise or lower depending on the audio levels recorded from the sitter.

2. Quirky Pillow: Placed within a public workplace/relaxation stairwell, the Quirky Pillow would act like a "hot potato" and wiggle and squeak depending on audio levels recorded from a group of people.

3. Messenger Bench: Placed within a public outdoor space, the messenger bench would allow people to leave an anonymous message for the next sitter to hear.
Refinement
As a team, we decided to pursue the messenger bench idea within an outdoor walkway space. We believed this idea offered the most potential to utilize our design themes, challenge ourselves within the scope of our time constraints, and offer an uncommon and engaging platform for human-computer interaction.
CODING, TROUBLESHOOTING, AND BUILDING
Pulling from various open-source resources online, we compiled an effective code and adjusted variables to suit our project's needs.

When we ran into coding obstacles, such as setting the internal timing for the 10 second LED, we would isolate sections of code and inspect each line until the functions were working independently. Then, we would reintegrate the code and move forward.

We created our bench from an IKEA table and restructured it to fit our computing hardware. We used a vinyl printer for aesthetic branding and typography.
FINAL DESIGN
The Echo Bench would be placed near a public walkway so that people could sit, reflect, and leave their message in a serendipitous moment. The interaction provides an opportunity for people to reach out to the world; to express concerns and hope within the safety of anonymity. People can express themself freely; whether that be voice, song, or other forms of audio. We defined this experience as "Echo: a messenger who reflects and reverberates the introspective expressions of humanity."
MOVING FORWARD
In the coming months we plan to coordinate alongside UW faculty to install Echo in a public space on campus. We hope to gain insight on how the experience is perceived, how it can be improved, and how to navigate the potential for both positive and negative impact inherent in anonymous messaging.