Picsart content discovery within the editor

🔎 Research:‍

We did series of tests on Merchandising in Editor. We will quickly go through the summary of each test, and later delive into the details.

Background:

As part of our search and Discovery efforts, we aimed to improve the Template discovery experience. Providing users with diverse templates, fosters creativity and saves them time not only for Ad creation but any future use cases we aim to cater to on our platform. As our platform continues to evolve, optimizing content discovery is imperative to meet the evolving needs of our user base.

During explorations we identified 3 areas that needed further research and ran tests working closely with amazing @Charl

• Categorization levels and shelving in choosers (How many nested levels of categories were useful for users?)
• Filtering categories via dropdown vs chips as filtering options (Which method of filtering better supported navigating through categories?)
• Nested shelves vs expandable shelves on one level (Would users prefer to navigate via nested industry categories or expand/collapse shelves on the same level?)

We've received very similar insights from all tests, it's important to note that the questions posed and the prototypes used were distinct. This consistency in user response is a robust indication of their needs, providing us with a high level of confidence that we are moving in the right direction.

2 Derived actionable items from the summary of the three tests:

Efficient Navigation:

• Enable users to navigate to all templates by selecting "Templates" in the main menu.
• Prioritize organized categorization, even with additional clicks, for scrolling Optimization: minimize scrolling through strategic shelf design for efficient exploration including high-level categorization and subcategories for a structured experience.
• Integrate industry-based shelving and labels for focused template searches.
• Provide stylistic filtering options to ease content discovery.

Search Function and Accessibility:

• Enhance the search function for specific needs like Facebook stories, Instagram posts, and travel templates
• Consider accessibility for color blindness to ensure inclusivity.

Now lets delve into the details

‍Test 1: Merchandising in the Editor user testing Report

‍Background: The editor choosers template content type serves as a fundamental component in our content creation platform, providing users with a selection of templates to streamline their creative process. This pivotal component aims to provide users with diverse templates, fostering creativity. As our platform continues to evolve, optimizing content discovery within this template type is imperative to meet the evolving needs of our user base.

Objective: Our objective is to enhance the content discovery experience within our evolving platform by refining the functionality and user interaction of the editor-chooser template content type.

Plan: This research marks the initial phase of a comprehensive user testing series, focusing on:

• Assessing categorization and shelving alignment with user expectations. Does categorisation and shelving meet users expectations?
• Evaluating users' navigation through shelves. Can users navigate shelves to find content?
• Ensuring seamless switching between shelves. Can users easily switch between shelves?

Research Approach: We ran an unmoderated study testing two different flows. Users were asked to navigate to and between different categories of templates. We tested with 8 participants:

• All solopreneurs
• All create ad/social media content
• Mix of Picsart and competitor platform users

Prototypes tested

👉🏻 Prototype 1

• High level categorisation based on segmentation
• Nested navigation per categorisation
• Minimised scrolling in content shelving
• Minimised scrolling in category filter
• A different category dropdown in main categories and subcategories pages.
• Sub-categories informed by tree testing that make the shelves consistent to discovery page outside of the editor.
• The ability to easily go back by a back button

‍

👉🏻 Prototype 2

• Low level categorisation shelving
• Minimal nested categorization pages
• Reduced unnecessary clicks for a more streamlined navigation experience.
• The ability to change the chosen category or get back to all templates from the nested “industry” page by a dropdown.

‍

‍Key Findings: Users prioritize quick content access. Both prototypes demonstrated comparable task completion, emphasizing the need for speed in content discovery. Optimization strategies include:

• Implementing meaningful layers of organization without obstacles.
• Minimizing scrolling with strategic shelf use.
• Reducing unnecessary clicks for a streamlined navigation experience.

What is important to users? To decide the route forward we focussed on what is important to the user: speed.

Users expressed a desire to quickly access the content they were looking for. While they appreciated organised shelves, any experience slowdown was viewed negatively. To optimise the user experience, the goal is to carefully balance organisation with speed. This involves:

• Meaningful layers that provide necessary organisation without becoming obstacles
• Minimising scrolling by utilising shelves where needed
• Reducing unnecessary clicks for a more streamlined navigation experience.

Which prototype was preferred?

Prototype 1 🏆🏆🏆

Prototype 2 🏆🏆🏆🏆🏆

It was incredibly close, meaning we do not have a clear winner from the users perspective. Prototype 2 had a slight edge, primarily because users knew exactly what they wanted  and so favoured the faster access provided by having one less layer.However, prototype 2 had an advantage for users seeking content at the top, like social media templates, which revealed potential difficulties for those searching for content closer to the bottom.

Recommended design: The direction shown balances the users need for speed.  Having optimized categorization and transitions, our focus shifts to refining shelf navigation.

• We keep the organization of the shelves by use cases as the first page
• We will have a subcategory nested page as the segmentation
• We will have industry shelves per subcategories
• The user will get to the feed of content while having chips as quick filtering options by styles of the image.

How did each prototype perform? From a task completion perspective, there were no significant usability issues.

Users were able to complete the given tasks on both prototypes.

Could they find Instagram stories?

Prototype 1 ✅
Prototype 2 ✅

Could they find industry templates?

Prototype 1 ✅
Prototype 2 ✅

Could they switch to Facebook templates?

Prototype 1 ✅
Prototype 2 ✅

Could they return to all templates?

Prototype 1 ✅
Prototype 2 ✅

‍

‍Test 2: Filtering categories via dropdown vs chips as filtering options

Background

The editor choosers template content type serves as a fundamental component in our content creation platform, providing users with a selection of templates to streamline their creative process. As the platform evolves and user needs diversify, it is imperative to assess and refine the content discovery mechanisms within this template content type.

Objective:

Enhance the Template Chooser experience by understanding behaviors, and preferences, and addressing UX issues focusing on ease and comprehension of navigation through categorization.

Plan: This research is related to filtering categories via dropdowns vs chips as filtering options. In this test our aim was to understand the following:

• Assessing the intuitiveness of shelf navigation for users to locate content: Is the navigation of shelves intuitive for users to locate content?
• Evaluating the ease with which users can switch between different shelves. Can users easily switch between different shelves?
• Determining which method, either dropdowns or chips, offers a more user-friendly experience for accomplishing the mentioned tasks. Which method, dropdowns or chips, provides a more user-friendly experience for accomplishing the tasks mentioned above?

Research Approach: We ran an unmoderated study testing two different flows. Users were asked to navigate to and between different categories of templates.

We tested with 8 participants:

• All solopreneurs
• All create ad/social media content
• Mix of Picsart and competitor platform users

Prototypes tested

👉🏻 Prototype 1

• High level categorisation based on segmentation
• Nested navigation per categorisation
• Minimised scrolling in content shelving
• Minimised scrolling in category filter
• A different category dropdown in main categories and subcategories pages.
• Sub-categories informed by tree testing that make the shelves consistent to discovery page outside of the editor.
• The ability to easily go back by a back button

‍

👉🏻 Prototype 2

• Low level categorisation shelving
• Minimal nested categorization pages
• Reduced unnecessary clicks for a more streamlined navigation experience.
• The ability to change the chosen category from the same page filtering the shelves users sees bellow
• Easy navigation to all templates.

‍

‍Key Findings: Users preferred:

Efficient Navigation:

• This includes pressing on templates from the main menu navigation to return to all templates
• Less scrolling, more organized categorization, even if they needed to do more clicks was preferred.
• The presence of high-level categorization as well as subcategories.
• The presence of industry-based shelving and labels was considered valuable, aiding users in focused searches for templates related to specific industries.
• The presence of stylistic filtering for easing content discovery was considered useful

Search Function and Accessibility:

• Search function for specific needs and quick access keywords like: Facebook stories, Instagram posts, etc.
• Accessibility consideration, for color blindness. Something we need to consider as improvements to the experience.

‍

In the evaluation of the two prototypes, a definite winner was identified Prototype 1. From the research we identified that the most important user need were:

Efficient Navigation:

• This includes pressing on templates from the main menu navigation to return to all templates
• Less scrolling, more organized categorization, even if they needed to do more clicks.
• The presence of high-level categorization as well as subcategories.
• The presence of industry-based shelving and labels was considered valuable, aiding users in focused searches for templates related to specific industries.
• The presence of stylistic filtering for easing content discovery

Search Function and Accessibility:

• Search function for specific needs and quick access like: Facebook stories, instagram posts etc
• Accessibility considerations, for color blindness

‍

Recommended design: The direction shown balances the users need for speed.  

• We keep the organization of the shelves by use cases as the first page
• We will have a subcategory nested page as the segmentation
• We will have industry shelves per subcategories
• The user will get to the feed of content while having chips as quick filtering options by styles of the image.

‍

‍

What is important to users? Couple of more important notes from the users…

Which prototype was preferred? With the majority of votes, prototype 1 was preferred by the users.

The users favoured the clear organization of templates by categories, finding it user-friendly. Some even suggested introducing an additional level of categorization based on specific social media platforms. They expressed a preference for a few extra clicks over navigating through a lengthy scroll, recognizing that it would save time. Prototype 1 received positive feedback for its clarity and ease of understanding among users.

Prototype 1 🏆🏆🏆🏆🏆🏆🏆🏆🏆

Prototype 2 🏆

How did each prototype perform? From a task completion perspective, there were no significant usability issues.

Users were able to complete the given tasks on both prototypes.

Could they find Instagram stories?

Prototype 1 ✅
Prototype 2 ✅

Could they find industry templates?

Prototype 1 ✅
Prototype 2 ✅

Could they switch to Facebook templates?

Prototype 1 ✅
Prototype 2 ✅

Could they return to all templates?

Prototype 1 ✅
Prototype 2 ✅

What is important to users? To decide the route forward we focussed on what is important to the user; speed. Users expressed a desire to quickly access the content they were looking for. While they appreciated organised shelves, any experience slowdown was viewed negatively. To optimise the user experience, the goal is to carefully balance organisation with speed. This involves;

• Meaningful layers that provide necessary organisation without becoming obstacles
• Minimising scrolling by utilising shelves where needed
• Reducing unnecessary clicks for a more streamlined navigation experience.

‍

‍Test 3: Nested pages for industry shelves vs collapsible expanding shelves.

Background: The editor choosers template content type serves as a fundamental component in our content creation platform, providing users with a selection of templates to streamline their creative process. However, as the platform evolves and user needs diversify, it is imperative to assess and refine the content discovery mechanisms within this template content type.

Objective: Improve the user experience of the Template Chooser by examining user behavior and navigation preferences evaluating whether through nested pages or expandable rows-while interacting with shelves.

Plan: Assess template discovery ease, including user interactions with shelves, nested content, and expandable shelves

• Evaluate the simplicity of template discovery, considering user interactions with shelves, nested content, and expandable shelves:
• Investigate user engagement with the Template Chooser, identifying patterns in interactions and preferences: How do users engage with the Template Chooser, and what patterns exist in their interactions and preferences?
• Examine how users manage nested content pages in comparison to utilizing expandable shelves. How do users handle nested content pages compared to utilizing expandable shelves?
• Measure users' comprehension of template shelf functionality and analyze their navigation between different shelves. To what extent do users comprehend template shelf functionality, and how do they navigate between different shelves?

Research Approach: We ran an unmoderated study testing two different flows. Users were asked to navigate to and between different industry shelves of templates.

We tested with 8 participants:

• All solopreneurs
• All create ad/social media content
• Mix of Picsart and competitor platform users

Prototypes tested

👉🏻 Prototype 1

• Effortless category change, enabling shelf filtering on the same page.
• Intuitive navigation for quick access to all templates.
• Nested navigation for industry-specific shelves.
• Swift search functionality with stylistic filters below.
• Easy back button for seamless navigation to alternate industry templates.

‍

👉🏻 Prototype 2

• Effortless category change, enabling shelf filtering on the same page.
• Intuitive navigation for quick access to all templates.
• Expandable shelves for industry-specific templates.
• Stylistic filters conveniently integrated within industry shelves.
• Easily navigate through various industry templates on a single page.

‍

‍Key Findings: Our research again highlighted that the most important user need is the speed of content discovery, efficient navigation, search function and this is optimized through a careful balance.

• Providing navigation to all templates by selecting "Templates" in the main menu.
• Prioritise organized categorization over excessive scrolling.
• Value industry-based shelving for focused template discovery.
• Incorporate stylisitic filtering for improved content discovery.
• Implement user-friendly search for specific needs like Facebook stories.
• Consider the inclusion of a specific filter for sicial media plaatforms in future iteration.

Users favor a single-page view of results from different industries, utilizing expandable shelves for navigation. However, in the prototype, they encountered 26 items from each industry, considering we have hundreds, could lead to usability issues. Additionally explicit user feedback expressing discontent with scrolling further highlights a usability concern. Two users did not notice any distinction between the prototypes, while the remaining users noted minimal differences. Based on this information, the recommendation is to proceed with the initial solution, which involves implementing nested pages for industry shelves.

‍

What is important to users? Couple of more important notes from the users…

‍

Which prototype was preferred? With double as much votes the prototype 2 was the winner.

Users prefer viewing results from various industries on one page using expandable shelves for easy navigation.

🔻 However, it's crucial to consider that exceeding 40 items per industry shelf can pose usability issues and create bottlenecks when trying to find the previous or the next industry shelf.

🔻 Additionally, receiving explicit feedback from users expressing dislike for scrolling poses another usability concern.

Two users did not notice any distinctions between the prototypes, and their choices lacked rational reasoning; therefore, their votes have been excluded from the count.

Based on this information, the recommendation is to proceed with the initial solution, which involves implementing nested pages for industry shelves.

Which prototype was preferred?

Prototype 1 🏆🏆

Prototype 2 🏆🏆🏆🏆

How did each prototype perform?

From a task completion perspective, there were no significant usability issues. Users were able to complete the given tasks on both prototypes.

Could they find Instagram stories?

Prototype 1 ✅
Prototype 2 ✅

Could they find industry templates?

Prototype 1 ✅
Prototype 2 ✅

Could they switch to Facebook templates?

Prototype 1 ✅
Prototype 2 ✅

Could they return to all templates?

Prototype 1 ✅
Prototype 2 ✅

‍Recommended design

The direction shown balances the users need for speed.  

• We keep the organization of the shelves by use cases as the first page
• We will have a subcategory nested page as the segmentation
• We will have industry shelves per subcategories
• The user will get to the feed of content while having chips as quick filtering options by styles of the image.

Next steps: Having successfully optimized the categorization and streamlined the flows between categories and subcategories, we are now confident in our strategic direction. Our next focus involves

• refining the categorization of existing templates,
• organizing them by industries, and
• structuring the workflow into iterative phases.

This will enable us to commence the development of an optimized user journey.