The Inccubator

Overview

During a 3-week sprint, I was part of a team that conducted a UX consultation that included user research, usability testing, information architecture and a visual redesign for The Inccubator, an inclusive multicultural media & social networking platform.

Responsibilities

  • Visual Design Lead
  • Usability Testing Lead
  • Information Architecture
  • Developed prototype

Software

  • Figma
  • Adobe Photoshop
  • Adobe Illustrator

Timeline

  • 3 Weeks

Prototype Link

Desktop Prototype Link

Company Background

The Inccubator started as a digital magazine. Over time it evolved into a social networking platform that highlights content from various cultures all in one place. From the Incc's content writers to the users that utilize the platform itself, the Incc's overall goal is to centralize original content from underrepresented communities that would otherwise be buried from the other major social media websites. As a user, you can network from a cultural, business, and creative aspect all in one community. Content creators can even make a viable income from the Inccubator by being "empowered" by other users who want to support them by paying for their exclusive content directly.

before and after comparison of some redesigned pages

Challenge

The Inccubator team had been working on a social media website that the team felt was ready for beta testing. Before they launched, they were at a point where they wanted a team to look over the site, focusing on the user experience. After an initial overview of the site, we were confronted with an ambitious website in the features and functions it wanted to have. The site's vision and intention were there; the challenge would be organizing the content to help the user interact with the website and engage in this online community.

Outcome

After the three-week design sprint, we delivered a design package, which included a high-fidelity prototype that focused heavily on the website’s navigation structure, as well as an in-depth research package.

Research

Setting the Foundation

To figure out where we could provide the most impact, we decided that this project would rely heavily on the amount of research we would do from the start. During an initial meeting with the client, we asked pertinent questions that helped give us a better idea on what the overall goal of the site and what makes this site different than any other social media site.

Takeaways from Client Kick-off

  • One of the site's main goals was to be a space for underrepresented communities to read and learn about topics that they would not get from other social media websites.
  • The site would let users view up to 5 articles a month, after which they would need to sign up for a paid account to view unlimited items.
  • The Inccubator team had not done much research on target users.
  • Only friends and colleagues had provided any input on design direction and functionality.
  • Content creators can be "empowered" by other members of the site by charging for access to unique content.

Gathering User Data

We decided that gathering user research from current users and users not familiar with the website would give us important insight into where we should concentrate as a team. The team drafted surveys to distribute and scheduled phone interviews with users familiar with the site.

We also wanted to get unbiased information, so I led usability testing with users who had never used the website before and had no affiliation with the client. Simple tasks were given to the users to test some functionality of the website. At the end of the tests, I interviewed the users to get their thoughts and impressions of the website.

Synthesis

Affinity Mapping

Once we conducted all of the interviews, we organized the content during an Affinity Mapping session to highlight any trends the team should keep in mind. After we were done there were a few topics that stood out.

Takeaways From Affinity Mapping
Layout
  • Lack of a definitive homepage for users was challenging
  • Layout and navigation don't foster exploring and ineteracting with other communities
  • Many pages looked the same making navigating to other sections of the site confusing
Site Functionality
  • When uploading content users were confused where on the site it would be viewable
  • Some terminology used throughout the site was confusing
  • There was too much scrolling to view content and a lot of unused dead space
Tone of Site
  • Site visually doesn't reflect the communities and connections they are trying to foster
  • Site leaning toward catering to more business/networking users
  • Users confused by what the site is asking of them

Persona Development

Based on the data that we received from user interviews and our survey, we created 3 personas. Our three personas include the Business Professional, the Content Creator, and the Cultural Explorer.  

The Business Professional's focus is on the content and networking in the communities.
Goals
  • Inspire people with his background and story
  • Motivate future business owners
  • Network for opportunities of investment and connections
Frustrations
  • Social media seems more like competition than uplifting
  • Doesn’t get sense of community from social media outlets
  • Networking limited based on statuses and picture posts
The Content Creator's focus is earning revenue and spreading their work in the communities.
Goals
  • Monetize her brand to be her main source of income
  • Be a role model for the under-represented community
  • Be able to easily upload her content and share it
Frustrations
  • Most social media networks aren’t blog-friendly
  • Hard to compete with big influencers on other platforms
  • Online networking difficult through the noise of social media
The Cultural Explorer uses the site to read and learn about the different communities but won't necessarily post content to the site or become a paid subscriber.
Goals
  • Learn about different cultures she interacts with everyday
  • Gain different perspectives in society, lifestyle and culture
  • Connect with people with similar interests and content
Frustrations
  • There’s a lot of fake news on current social media
  • Quality of written feature content varies from site to site
  • Doesn't want to subscribe to multiple websites to get a range of multi-cultural content

Problem

Users need a more intuitive way to explore and engage with content on the Inccubator so that they can connect with other users and learn about different cultures.

Solution

By refocusing the Inccubator website to have simple, cohesive navigation and a consistent content structure, we will make engaging on the Inccubator website an informative and collaborative experience.

Ideation

Information Architecture

A significant component of our UX consultation was to address some of the information architecture challenges. The overall takeaway of our research was that users found the site not intuitive and challenging to navigate. The guiding design choice behind the proposed site map was to separate the content channels and content feed. This would allow users to realize the site's purpose as a social media platform and provide a space for the content channels and the Inccubator to show their unique content. It was vital for us to keep all of the content from the original Inccubator in the reorganized site, so our main goal was not to change the content but to make it easier to find and use.

Click on images above to view detail

Sketching Solutions

I led a design studio session where the team got together to brainstorm ideas for the sections of the site we were going to tackle. The session helped establish a good foundation on what we wanted to focus on during the next step in the Design phase.

concepts for the landing page

Design

Areas of Opportunity

With the site navigation reorganized, we identified three areas of opportunity that we felt would significantly enhance the site and address some of the website's challenges.

User's Landing Page
User Profile Page
Content Channel Page

Medium-Fidelity Wireframes

With our areas of focus established, I began building medium-fidelity wireframes based on our sketches, the findings from our current state usability tests and user interviews. We used this prototype to test the new site's navigability and the user's perception of the site's intent.

click on images to view Wireframe details

Medium-Fidelity User Test Takeaways

Glows
  • The site was easy to navigate.
  • User assigned tasks were easy to complete.
  • Profile page and content channel page were well organized and pleasing to look at.
Grows
  • User landing page is still a bit overwhelming.
  • Content needs to be organized and prioritized.
  • Community/social media/collaboration needs to be included in the content channel pages.

High Fidelity Screens

After testing the prototype, we increased the fidelity to include color and more visual elements with the feedback in mind from the medium-fidelity takeaways. Below are the three main opportunities we developed upon:

User's Landing Page

Profile Page

Challenges
  • When users added content, such as blogs or videos, they did not understand that the content was available to view on their profile.
  • The user had to scroll a long way to take in all of the information available. If a user had left a category blank, such as their academic path, the user had to scroll past a blank box.
  • The original profile design seemed flat and boxy. One user commented that it looked like the back end of a site, not a finished design.

Content Channel Page

Challenges
  • Each content channel home also acted as a landing page, effectively creating ten landing pages.
  • Users had to navigate through the site to find content related to one content channel. For example, to view Latinx videos, they had to leave the Latinx page and navigate to Videos. To read Latinx blogs, they had to navigate to Blogs.

Prototype Walkthrough

Next Steps

During the three-week design sprint, the team and I focused our energy on parts of the website that would benefit the most from a UX consultation. Working on building a social media platform is a massive task, so there were some things that we weren't able to address during the duration of the project. If we had more time, these are a few things that we would have liked to address:

  • Continuing the new design into a mobile and tablet version of the website
  • User onboarding screens for new users logging in for the first time
  • Build out page designs and user flow for the Blog and Discussions sections of the website
  • Develop more of the business centric part of the website

At a follow-up meeting with our client, we found out they are already working with developers to implement some of our changes and recommendations. We understand that not all of our recommendations will make it into the Inccubator at launch, but we believe that we were successful in creating intuitive navigation and in providing valuable insights into the user experience.

Check out the prototype in its current state

Back to top of page
Go to read Netflix My Lists Feature Case Study

Check out more projects

© RENE VAZQUEZ 2021 All Rights Reserved

RV logomark