Element

Manage vast sources and accelerate content creation.

Live Demo

Project Overview

This is a 7-month capstone project in which I collaborated closely with 5 other MHCI student at CMU. Our goal was to find a target user who would benefit from our client's tool for collecting information online and design for their needs. After several rounds of research and design, we focused on content creators as our target user and created a desktop productivity tool -- Element -- to help them manage the information they collected and generate new content.

Client

Prof. Niki Kittur
Center for Knowledge Acceleration

Team

Asit Parida
Neha Shah
Charlie Abbott
June Byeon
Ally Liu

My Role

User Research
Ideation & Prototyping Wireframing & UI Design
User Testing
Project Management

Methods | Tools

Survey, Interview, Affinity
Storyboarding, Speeddating
Crazy 8, Design Sprint
Lots of post-its, Figma

The Challenge

Solve the "Cold Start" Problem for an Information Collection Tool

In an era of information overload, the ability to sift through and make sense of the vast and ambiguous information online becomes imperative. Our client, Prof. Niki Kittur, has ben researching online sensemaking for over a decade and recently created Fuse, a Chrome extension that can grab all kinds of information from across the web.

However, the lack of a specific use case prevented more people from adopting this tool. Hence, we were tasked to identify a target user group and design for their needs to attract the first set of super users.

Solution Highlights

Enable Content Creators to Better Collect and Utilize Online Sources

Through our generative and evaluative research, we narrowed down to content creators as our target user group and designed a desktop tool specifically catering to their needs in collecting information and producing outputs out of research online. Here are a few highlights of our solution that could help streamline the user's workflow from information collection to content creation.

01.

A Single Point of Collection

Element helps content creators collect and visualize all kinds of media in one place for easier access later

02.

Organize your Thoughts and Connect the Dots

The infinite canvas enables users to freely organize collected sources and draw connections to facilitate the thought process

03.

Annotate with Ease throughout

Incorporate annotation in every step of the process to help jog the memory and build content piece by piece
See Live Demo

Vision Video

See how Element can help content creators succeed

The First Challenge

Finding a Target User: Start with Online Shopper

Our client's current tool, Fuse, is a Chrome extension that helps users clip content across the web, from a single sentence to a whole webpage supporting a variety of medias. The client proposed to start with online shopping because it is a frequent action that almost all of us do that requires some level of research and information collection. Hence, we conducted a series of research activities to identify the current process and find pain points to solve for.

200+

Survey Responses

30

Interviews

10

Storyboards

20

Speeddating

Learn more about research in this phase here

However...

A typical online shopper's need for information collection does not necessitate a designated tool.

Although there are pain points related to information collection in the online shopping process, a paradox becomes apparent: people would only use such a tool for purchases that requires intensive research, however, these purchases are rare; for frequent purchases, people rely more on simple actions (e.g. add to cart, bookmark) price comparison and already curated information. Hence, the incentive to download and use a tool to collect shopping-related information is low.

The Pivot

Shifting to Passionate Creators: They Share Synthesized Research

After validating our initial ideas, we decided to move away from the generic online shopper population. Back to the drawing board, we actually found something really interesting that led us to focus on a more exclusive set of users -- content creators. These are people who are passionate about a topic, spends time doing in-depth research, and share synthesized research with the public.
On the creation side ...

Passion for the topic leads to in-depth research and content creation.

We found passion to be a strong motivator for people to spend a significant amount of time and effort researching a product. Someone may spend an insane amount of time comparing stereos because she is an audiophile . She may then share her research and insights with her friends, online communities, or even post publicly.
On the consumption side ...

Other consumers rely on already curated information to get quick insights.

For those who are not passionate about the topic, they rely on curated information to gather insights and recommendations quickly. For example, someone who is buying a stereo just to have better sound projection when watching TV, may go to WireCutter to look at a list of expert selections instead of doing first-hand research.

More Research

We interviewed 10+ content creators in the space of health and beauty to understand their motivation, research process, and tools.

User Persona

Meet Michelle, a Skincare Science Influencer

Modeling User Behavior and Pain Points

The Current Process from Collection to Creation is Fragmented

Based on our contextual interviews with the content creators, we extracted a 5-step model that describes their current process and identified specific pain points along the way. In our final design, we focused on the part from Organization to Synthesis because there is currently no tool that could help bridge the gap between raw research to final artifact.

Collection

Organization

Contextualization

Synthesis

Artifact

Different types of information are stored dispersively
Levels of hierarchy limits how user builds a knowledge base
Transient thoughts and purpose of use are often lost in the process
Heavy lifting happens in the mind and no tool currently helps with it
Have to joggle between different tools before reaching final state

Scoping down ...

Focus on helping content creators streamline the workflow and alleviate the mental effort for synthesis.

Since our client was focusing on the Collection part and there are various tools that helps crafting beautiful final artifact, we wanted to bridge the gap between Organization - Contextualization - Synthesis. Our solution should essentially be the downstream of Fuse, and help users act on the sources they have collected and create output more easily.

Conceptual Design Sprints

HMW Help Users do What They Already Do, but Better?

We wanted our design to map closely with what the users already do instead of having the user learn a new workflow. Here, we adopted the Design Sprint method. Each week, we generate diverse ideas around an umbrella HMW question, select key ideas to parallel prototype and do guerrilla testing on proxy users to quickly narrow down.

Define the project scope and synthesize insights from research

HMW help users contextualize different kinds of information?

HMW organize the information to allow for creation?

HMW facilitate the synthesis that happens in the user's mind?

Parallel Design Ideas

Low-Fi Wireframe

Validate Core Concepts and Iterate on Workflow

Once we have our core ideas selected, we made an InVision prototype to do cognitive walkthrough with our target users and elicit feedback. We specifically asked the users to tell us how this workflow we designed is similar or different from their current process and how they may or may not use specific function for. After 4 user testing sessions, we iterated on the details and finalized a workflow along with core functionalities.

Final Design

User Reactions

Content Creators See Great Value in this Solution

Since our goal is to design a solution that is desirable to the target user group to jump-start the adoption of our client's tool, we were thrilled to hear that our solution appeals strongly to content creators. All four participants expressed interest in trying out this tool, for it solves specific pain points in their current process and could help streamline their workflow.

The All-in-One Collection Space

"Just being able to see everything I've collected in one screen like that? That's really really cool! I don't have to click into each of the notes to find what I want."

The Infinite Canvas for Moving Clips Around

"I think this is awesome! I have never thought about using a format like this before because I haven't seen it done as easily... I want to use it like right now!"

The List View for Synthesizing Information

"I think having this would allow you to cut down the time you actually spend writing, because you can just go back to look at your note and remember 'what was I thinking'...

Learnings & Takeaways

The Most Important Learning: How to Work with a Team

My biggest takeaway is learning how to collaborate with a group of people of diverse skills and work styles. We have had many issues related to teamwork, but we were able to solve them together by improving our communication mechanism and developing a health team environment. We gradually learned when to work together and when to divide up, what to prioritize in discussion and what to leave up to the person in charge. Most importantly, we established a team norm that is collaborative, proactive, and warm.

We Could Have Done Better: Define and Scope Earlier

A noticeable part of our project is the pivot we took in the middle when defining a target user group. From the inception of the project, we have had concerns about the online shopper demographic being too general. Nevertheless, we did not know a way to frame it differently, so we followed the standard UX process and did all the work in the beginning which did not turn into fruition of a solution. Although this is indeed a valuable lesson to learn, we could have challenged the prompt and assumption and focused our effort earlier on.

If I Had More Time: Test Usability and Efficacy of the Solution

Since our client is a startup and our project is more of a product design challenge, rather than a UX design project, we spent the majority of our time coming up with conceptual designs. Through user testing, we learned that our solution is Desirable and appeals to our target user. However, we did not have time to do a longitudinal study to determine if the product is actually Useful and Usable in the everyday workflow.
<- PreviousBack to TopNext ->