CLLCTVE
A portfolio platform for young creatives to showcase their work, skillset, and experience, as well as discover other creatives' work and apply for jobs within the creative industries.
“A future where everyone has access to the tools, resources, and network to create the life they want.”
Project - Client website community feature
Team - Team of 4 UX Designers
My Roles - UX Researcher, UX Architect, UX Designer
Tools - Figma, Maze, Miro
Methodologies - User Interviews, Affinity Mapping, Contextual Inquiry, Persona/User Hat Creation, Journey Mapping, Comparative Feature Inventory, Task Analysis, Heuristic Evaluation, User Flows, Design Studio, Sketching, Wireframing, Iterative Testing, Prototyping, Usability Testing
Based on research conducted by the team at CLLCTVE, their aim was to build out a community segment so users can build relationships, connect with each other, and better maintain their creative networks within the platform. Our team was tasked to dive deeper into research and development of a community hub, using the existing style guide CLLCTVE provided for integration into their current platform.
Our designs for the community hub are scheduled to go live in early 2022.
CLLCTVE Currently
Based on previous research conducted by the team at CLLCTVE, their aim was to build out a community segment so that users can build relationships, connect with each other, and better maintain their creative networks within the platform. Our team was tasked to dive deeper into research and development of a community hub, using the existing style guide CLLCTVE provided us with to be integrated in the existing site.
Comparing Features on Similar Platforms
We compared CLLCTVE to competing platforms such as Behance, Creatively, and Dribble, among others, to discover what features and design/organization trends were working for them.
Following other users, a feed, and reacting to posts with likes are the most common feature trends. One notable trend we also saw was an in-platform direct messaging system, which despite not being in the scope of the community page and features we designed, is recommended and backed through user interviews, surveys, and comparative analysis.
Other common trends included filtering by topic, commenting as a means of feedback, sharing posts, tagging by topic or skill, a grid-like feed, and the layout of each individual post with a main image, small user icon, and interaction icons at the bottom.
Learning from the User
With these trends and common community features in mind, we sat down over Zoom with 10 CLLTVE users from various backgrounds to discuss their needs as creatives and gain insights on their experience in the current platform and how a community feature could aid them in their networking efforts. We also observed how they navigated the few tasks they’re currently capable of completing on the current platform.
All of our interviewees were around college-aged and were part of the Beta cohort of users.
Surveying Creatives
After getting valuable insights from CLLCTVE users, we decided to look beyond current platform users and into communities of potential users. We sent out a survey to creatives of any background who had never used the platform to figure out what they are hoping to gain from a creative network.
There is extreme value in a sense of community for creatives.
We can see forums are valuable for creatives seeking out information. This led us in the direction of designing a discussions page within the community.
Creatives find the difficulty of finding collaborators outside their field is moderate to high. This means groups and discussions, as well as the capability to filter by field/topic type, could prove useful to creatives on a platform like CLLCTVE.
Creatives find that events are helpful in their networking and collaboration pursuits, confirming what CLLCTVE users had expressed in our earlier interviews and leading us towards our decision to include events in the community page.
In this pie chart you can see: Friendships, events, internet (social media) and work/gigs are the main methods of networking. Most notably, social media platforms at 20.8% vs job searching platforms at 0% tipped us in the direction of social media style networking as opposed to more formal networking platforms like LinkedIn when designing our community page.
Picking Apart the Information
These findings allowed us to define the problem:
Creatives need a platform to grow their craft through connections with other creatives in a personal yet professional way.
The Solution:
A creative portfolio platform with spaces for creatives to discuss topics, give and receive feedback, discover events, gain inspiration, network, and interact with each other.
The Journey
During our initial interviews with CLLCTVE users, we conducted a contextual inquiry, which is when we watched users complete certain tasks on the current platform. We took their feedback during those observations and applied it to a map that illustrates the satisfaction during each step of navigating certain tasks in order to achieve their ultimate goal of connectedness and inspiration.
Before
Represented in red are painpoints, while the green shows what they found positive about the task. Some key takeaways from this map are
CLLCTVE users wanted presets and suggestions when adding skills or searching for content.
While interacting with the current discover feed, users mentioned not understanding the organization and the content blending together.
When viewing another users profile on the current platform, users wanted a way to contact the user directly, either through post comments or DMs.
After
This map illustrates possible solutions that could address these pain points by means of community features, such as
Tagging, following, and commenting.
A hub for saved content of their interests
Reorganization of the feed layout
Topic filters
Interaction icons.
We predict engaging the user more interactively could lead to increased user satisfaction and retention, as well as help the user achieve their goal of growing their network and gaining inspiration.
User Hats, Flows, and Wireframes
CLLCTVE currently defines their users as college-aged artists and creatives who need to improve their skills through feedback and non-biased criticism. We took this persona a step further by developing task-focused personas called User Hats. We created these hats based on the tasks users would be capable of completing through the community page and explore what success looks like for the user. These tasks were determined by the key needs of the users gathered from research and an analysis of community focused tasks on comparative platforms such as Behance, Creatively, and Dribbble.
At the top of the feed are 3 shortcuts that navigate to the landing page for discussions, events, and groups.
On the side navigation you can see we included a hub for the user to view profiles, events, groups, and discussions they’ve followed.
Izzie the Post Interactee
Izzie the Post Interactee is seeking to interact with other creatives as a way to give feedback and gain inspiration. They are focused on interactions through passive viewing, and follow other users who inspire them.
Izzie’s Flow
Izzie’s desires revolve around small interactions they have with others such as liking, commenting, sharing, and following other creatives that inspire them. Izzie wants these interactions to be as casual and quick as possible.
Community Homepage and Interactions Wireframe
Because of Izzie’s desires, we modeled our interaction icons after post layouts on comparative platforms. We created a feed as the community homepage, similar to CLLCTVE’s current discover feed, populated with posts of work users have uploaded to their profile. In the current platform, the feed is set up in a staggered layout, with each post being a different size and not in any predictable placement. Based on user feedback suggesting the feed seems cluttered and overwhelming, as well as our discoveries from comparative analysis, our designs strayed away from the current look and took on a grid style feed, so Izzie eyes can scan the feed and easily interact.
Carter the Conversationalist
Carter is discussion based. They want to communicate in-depth with other community members in CLLCTVE, they love discussing their work and enjoy sharing knowledge with others in their field. They also enjoy joining groups online to feel a sense of community and like they have a space for specific interests.
Carter’s Flow
Carter’s tasks are focused on participating in a discussion through giving feedback via replying to discussions they are interested in. Carter also has the task of creating groups to facilitate these discussions they love to engage in.
Discussions and Groups Wireframes
The Discussions landing page was modeled after popular forums and message boards such as Reddit. Carter would be able to upload an image with their discussion topic and include tags so the discussion shows up in certain group feeds and is also filterable. Carter can “like” a post to boost it and click on the main post to view comments and leave a comment themselves. Carter can also follow a post to save it to their hub to return to later if they prefer to eat popcorn and watch the discussion dish out from the sidelines.
The landing page for Groups follows the same grid layout but is subcategorized by Your Groups at the top and Featured Groups underneath. At the top of both pages are filters to sort by tending/recent or by topic. Events, discussions, and user posts will populate if they’ve been tagged or shared into that group. Groups are essentially a way to categorize and view all content of a specific topic, as opposed to filtering through discussions, events, and user posts separately, and this was a key feature users expressed a desire for in our initial interviews.
Elliott the Event Seeker
Elliot the event-seeker is driven by a desire for experiences, either online or in-person, that involve their creative interest. They are defined by their passion for face-to-face engagement with others.
Elliott’s Flow
The tasks associated with Elliott are finding digital and in-person events to attend. They find an event they’re interested in, click into the event for details, and follow the event as a way to save it for future reference.
Event’s Page Wireframe
The Events landing page is similar in layout to the Community feed but also filterable by event type and location. Users can follow an event so it saves into their hub for easy access later, as well as create an event.
Testing It Out
We conducted usability testing with 16 people, divided between 2 rounds of testing. Both rounds of tests were conducted through a user testing tool Maze.co which prompted users with 4 tasks and provided detailed results such as click heatmaps, number of errors, and timed results. I also asked a set of interview questions to gather what might have been challenging for the users. After the first round of tests, I made changes based on those results, retested with new users, and then refined the design with additional changes.
We made some important discoveries.
-
The icons/buttons associated with following weren’t straightforward for users.
We switched out the + sign follow button for a larger button with the label “follow”.
-
Users had difficulty locating the filters for topics.
We made changes to the filter by changing the word “Topic” to “Filter” and bolding and increasing the font size to make the filter more noticeable.
-
Users felt the call to action or shortcuts to the different landing pages for Discussions, Groups, and Events weren’t obvious or easily accessible. There also was confusion about our hub shortcut on the sidebar. Multiple users clicked into the hub to see their saved posts when directed to explore the general landing pages instead.
To fix this, we changed the side navigation to be a shortcut for the main landing pages and condensed the hub into one page, accessible through a “My Hub” shortcut, also on the side navigation.
-
Users found it inconvenient that, once inside a discussion thread, they had to click the comment UI to open up a comment field at the bottom of the thread.
To make it encouraging and easier to comment by reducing clicks, we changed the comment field to be open when entering a discussion thread.
For the Future
Based on usability interviews and some additional comparative analysis, I determined what direction and lengths this feature could travel.
Both rounds of tests showed users struggled to notice the filter drop down, suggesting a need to reiterate the design for the filters bar UI. It’s possible the filter UI currently matches too closely to the “Explore All” UI in close proximity above.
The comment popup when commenting on a user post was in some cases unexpected by users. A redesign of the commenting system after some further research could be implemented.
Users expressed a desire to click into a post to see more details before liking, commenting, sharing, or following. This would mean inclusion of these interactions within a post page to increase opportunities for users to interact.
Beyond the Community Page
We also discovered some features outside the community scope that could be developed to meet additional user needs.
A separate board or landing page for exclusively jobs and opportunities.
Users during our usability tests expressed a habit of using the search bar, suggesting the importance of making the search bar functional for sorting content via tags.
An onboarding process was mentioned as a useful tool to users.
An in-platform direct messaging system would allow users to interact personally with people in the CLLCTVE network.
With the planned 2022 implementation of these community features such as social interactions, groups, discussions, and events, CLLCTVE can grow into a community their users desire, where ideas of young creators can flourish and strong bonds can be made.