.    .    .                          
                                     Type: Team, 2 members                                       Role: UX Designer
                                     Timespan: 4 months                                             Course: UX Research & Design Capstone
Many are afraid to start creating from scratch
Social media platforms' ad/revenue scheme can stifle indie content creators that originally could gain a following. However, it’s not just the larger platforms that are causing it harder for newcomers to get established - it can also be the creators themselves who are not confident in their skills.
One of the reasons people don’t feel creative is because they consider it a big-sum game. They see people like Einstein in the history books, or Steve Jobs in the news, creating innovative ideas that change the world, and they think “I could never do that!"
Starting from scratch without the resources can be intimidating and also unsuccessful without the right approach. For instance, self-publishing can be extremely difficult - the average self-published copy only sells 250 copies in its lifetime! Our team wanted to explore how to encourage more people to create content and build their confidence within a community. 
Initial user interviews revealed people get discouraged early
By the current content users are consuming in a space they may be interested in, we found people often get discouraged, often attributing the impressive work they see to "talent." This held true across all content types - music, writing, art, etc. 
Interviews: 5
Duration: 25 minutes each
Level of guidedness: Low - we wanted to let users drive the conversation to understand what they find important in the first place.
We found that people are deterred from learning due to  motivation, time, and how "behind" they feel. Content viewers are interested in the process and story behind the creator, but often, only polished work is revealed. Recreating work was cited as being very difficult - the phrase "where do I start" was brought up a lot.
Content viewers also are not looking for a very robust learning platform - since there are many already out there - but actually for a platform with bite-size content that allows users to figure out what they interested in dedicating time to
We asked users to talk us through how they feel about recreating content when they see something like a beautiful illustration or music selection. People's reactions fell into the same framework: 

Common framework for how people seemed to view creating content.

Understanding the stakeholders of the problem
In order to better understand and frame the problem, our team devised a stakeholder to map to see who has a stake in the issue of content creation. Before we started ideating or conducting more research, we wanted to make sure we were not limiting our scope to students too easily. Who does this problem affect, and why would they want to be a  part of the solution? 
We circled areas of the map in which we could focus on, due to having access to the population.

Stakeholder map to understand which population's pain points we could best address.

Our project timeline became key to monitoring progress
In addition to mapping out who had a stake in our project, we also had to divvy up the time we had into a tentative project plan. This plan became our "north star" and made sure we stayed on track in each project phase: research, design, and implementation.
Narrowing to a problem statement & bridging the gap
After prioritizing which populations we had access to conduct research with, and which populations needed the most intervention, we narrowed to our problem statement:
There is an opportunity to create an environment that supports creators / gives them exposure,  while supporting and encouraging those who might not have developed skill sets yet.
This problem statement allows us to focus on the two-sided issue of content creation: viewers & creators. How do we bridge the gap to allow flowing between these two entities, which are currently viewed as separate? Our goal became to enable "bleeding" between creation and viewing.
Planning overall research objectives &  methods
Before we dove into our main body of research, we put together our research objectives and research plan over a timeline, with goals of how many participants we would recruit. This helped us time-box our research and plan what  methods would be best to address our objectives. 
From this process, I learned that matching the method to the objective is crucial, as it provided focus.
Instead of just going for interviews or defaulting to a survey, we thought creation workshops with our users would address more of the objectives in a subtle way:

We planned our goals for research methods & order.

Research objective questions.

Brainstorming interactions for a new content platform
Our next step was to brainstorm ideas for how we could augment existing platforms - what features could encourage creation? What could we add that is missing from the content browsing experience? How do we reveal the intensive process behind works and debunk the "talent" myth? 
With these principles in mind that we gleaned from our user interviews and informal conversations, we began sketching various ideas.  For example, a "scramble" button to randomize content. We also thought of a search & filter content mechanism that is two-tiered: you can filter by different high level categories (colors, keywords, etc.) AND the types of results (music, articles, podcasts):

There were ideas for commenting on specific areas of an illustration - "hotspots" (top), a scramble button to push random content to the top of the feed (left), and having associated timeline tutorials for each post (right).
After this session of brainstorming, we consolidated ideas that were similar, and prioritized ideas that had heavy relation or basis on user values and research done so far.
However, even with the sketches, we will weren't sure how users envision content and what they would want a feed like this to look like. The question became...
What is a user's ideal feed structure with multiple content types?
Most existing content platforms, such as Instagram, Facebook, Dribbble, Behance, etc. have some sort of variation in content type (video, text, image). However, there is no existing platform that actually contains all of these content types - music, image, video, articles, etc. in an integrated feed
In order to understand how users would want this integrated feed to look, we first ran a workshop where we had the user sit in a room and draw their ideal feed. 
Participants: 5
Session duration: 30 minutes
Follow up interview: 15 minutes
This approach proved to be unsuccessful, since users were looking for more guidance and the blank sheet left them intimidated. After the first few attempts, we switched to a templated exercise. Users got set "kits" with some components created for them that they could use to build the feed. Then, users could also create their own components. This was more successful, and all of the users had a feed created by the end of the exercise.
To get the user ready, we had pre-cut templates ready for feed interactions, content types, and more that the user was likely familiar with. A few examples of template pieces are shown below:
Having users build together revealed more patterns
After running the first few creation workshops individually, we ran a few co-creation workshops. This means users could sit in a room together, most often with a friend, and build from each other's ideas in a comfortable environment. Users could choose to create one collective feed, or separate ones. 
Why did this help clarify the previous workshop results? This exercise revealed patterns of what both people preferred on a high level, agreed on, and deemed as important
Turns out people really liked the concept of the Buzzfeed "Tasty" video series - since the video itself is a tutorial that shows you how each step is done. From these workshops, we found that associated tutorials with each post is key - people want to know how a creator made [x], even if they don't plan on following the steps!
In each workshop ran, users always picked components such as instructions behind recipes, video tutorials, and the option to leave comments and get help. Users expressed they want more guidance from a creator, especially for those they aspire to be like. These workshops led to our key design findings (below).

A co-creation workshop in action, followed by follow-up interviews.

Key design findings.

(In)validating core interaction ideas with users
After some key ideas bubbled to the top, we wanted to get concrete sketches of our ideas and run the full interactions by users, in a low-fidelity state so people are not afraid to give harsher critique. 
Before mapping out these core functionalities, we did a "do-go" map (shown left), which shows the connections between key interactions. For each page, we wrote key inputs, what the user can do on the page, and where they can go from that page.
What happens when you click on a post? Where does the browse page lead? 
Following this, we sketched our key interaction options and ran them by users (shown right).

The "do-go" map
Concept validation sessions
Beginning the prototyping process
We decided to plan which functionalities to implement in Framer X, our chosen tool for design & implementation. We also planned out the prototype architecture before beginning the hi-fidelity designs.

Project prioritization & implementation plan.

Prototype architecture planning.

After the implementation plan, we iterated through some possible color palettes, and tried how the palette and type system looked on a webpage with mock "posts."
Some of the explorations are shown below:
Our high fidelity designs created in Framer X
Finally, we prototyped using React components in Framer X and implemented the core interactions in our implementation plan outlined above. Take a took!

A few screens from Reel.

Tutorials acclimate the user to the environment & tone
We created a tutorial that users could quickly go through in order to get acclimated with Reel's features, since there are special components that may not be obvious. For instance, our platform allows for greater interaction with creators through polls the creator can post.

Reel tutorial example.

Featured creator interaction reduces intimidation 
In order to take the load off of users, users first select their interests during the tutorial. Based on this, they can get recommendations for featured creators. 
These creators will be a mix of brand new creators with veteran "mentor" creators.
The users can then favorite these creators and follow their work, and also participate in polls to guide what the creator makes next.

Landing page for browsing content. By providing featured creators based on user-defined interests, users can discover content more easily without feeling intimidated. 

Clip showing the scrolling interaction.

Filter system & scramble allows for exploration
Users indicated that the way they interact with content is key, not just the content itself. To make it easier for users to comb through different content types, we created a two-layered system
The first layer consists of user preferences of content types, and the second layer has user interests. 
Finally, there's a scramble button to randomize content, to take on the idea of this platform being a place for bite-size exploration

Two tiered filter system so user can quickly add and subtract content types.

Demonstration of filter and scramble interaction. Scramble allows exploration by pushing totally new content to the feed. Users stated they really liked this feature since content can get "stale."

Our tutorial system is incentivized
What differentiates our platform from Instagram or other social media platforms that have a lot of "finished product" posts, our platform is emphasizing the work that goes behind content. This is why each post with an associated tutorial has a "star," so users know it has a tutorial. In addition, posts with stars are given priority over posts without tutorials, as an incentive.​​​​​​​
During user testing, we got feedback that it can be intimidating to create tutorials for beginners. Some creators worry they are not skilled enough. To mitigate this, we allow other users to rate the tutorials on helpfulness and provide tips in the comments that are specific to the tutorial style. Once the creator posts five tutorials, they are give a creator badge.

Individual post view. Contains hero image of content, tutorial on how it was created, and ability to scrub through tutorial. Users can also rate the helpfulness of tutorial. 

Special attention was given to UX writing 
We paid special attention to the tone & messaging, encouraging creation at every point. 
In the post view, we have words like "try this yourself!" and "imitation is the first step to creating your own content!" This is based on feedback that at times, users feel like "frauds" from recreating existing tutorials. We want users to feel empowered to start with tutorials, and then move into creating on their own.
We also plan on having guides for creators who want to create video tutorials at low cost - such as advice for gimbles, recording videos on your phone, screen recording softwares, etc. We do not want tools to be a barrier for tutorial creation. 
In the comment box, the placeholder text is: "Did you know? Commenting on specific parts of a creation can make your comment more helpful!" 
This sort of messaging encourages commenters to be more specific about what they like and dislike, instead of just saying "awesome." We found users are more motivated if the comment is more specific, like, "The gradient of the sun is so well done!" 
Learnings & reflections
1. Designing with users can give insight that interviews cannot. In the past, I have done primarily interviewing and other more passive forms of user interaction. By involving users in the design process and having them sketch their ideas, we got valuable information about how they think about content. 
2. Timelines are necessary guides to stay on target, and be sure to build in buffer time. We completed our research phases on time and had enough time to spend on polishing the higher fidelity designs. This time for validation was built into our original timeline. Without this framework, we may have veered off task.
3. Version control when working together is important.  When working individually, I do not have to be so focused on sharing the  most up to date version of my work. However, while working with  my partner, I had to make sure the assets were all up to date and consciously upload new versions every day. 
4. UX writing is key.  In my past projects, I had not focused as heavily on UX writing or what a certain voice, tone, or placeholder text can do. In this platform specifically - when trying to encourage people who may be nervous - I realized how key wording can be. Rather than just saying "hey, go create!" , we had to put special care in a way that eases people into it, such as "everyone starts somewhere..."
Back to Top