Ion’s Publishing Flow: Helping users to publish successfully

The audience

• Designers and marketing managers using Ion worldwide, who need to grab the URL or embed code for a live Ion creative.

• New Ion users who struggle to adapt to Ion, due to unfamiliar nomeclature and information archteture.

The problem

When trying the path to access the embed code for an Ion experience, my PM and I observed that users had to go through these 3 steps:

1. Change the status of the Ion experience from "Draft" to "Engaged".

2. Click the "Add an URL" button and proceed with the URL setup.

3. Once the URL setup is completed, retrieve the embed code from the "URL management" screen.

Initially, we believed that the publishing flow itself felt longer than necessary and could be simplified. To validate whether that perception was true, I started to map out the existing user flow for publishing to gain a deeper understanding of the underlying issues.

To start this process, I questioned myself: What does publishing an interactive content to the web entail? This led me to identify the user tasks supported by Ion that could go into publishing, and categorize them as required, recommended, or optional based on our product's business rules.

By listing these user tasks, we were able to map a comprehensive user flow for effectively publishing an experience. It became evident that publishing encompassed more than just creating a URL or obtaining an embed code. It involved tasks such as tagging components for visitor behavior tracking, optimizing content for SEO, defining data incorporation, and more.

After mapping the entire user flow for these user tasks, it was possible to identify:

• 5 possible decision-making points.

• 3 possible context changes (page changes).

• 26 possible user interactions (clicks and typing).

While it became evident that the flow was lengthy and prone to errors, a thorough examination of each task allowed me to identify the three core problems with Ion's publishing flow, which are outlined below.

Problem 1: Lack of guidance for users

There was little-to-no guidance for users on the settings required for a successful publishing. Users had to rely on their own knowledge and memory to navigate the various settings, such as SEO and indexing options. In-product instructions or guidance were not provided, making it challenging for users to understand when and how to configure these settings effectively.

Problem 2: Disperse settings

Users had to navigate between multiple pages to configure various aspects of a creative for publishing. For example, setting up the cookie consent manager widget and adding meta tags for search engine instructions required accessing the "Edit creative" page. However, managing the URL for the creative in the sitemap or adjusting data processing settings required visiting the separate "URL management" page. This disperse setup increased the effort and created a fragmented user experience.

Problem 3: Complexity

The overall publishing flow was complex, involving numerous user interactions, context changes, and decision-making points. This complexity was exacerbated by unfamiliar nomenclature, such as the use of the "Engaged" status, which contributed to an unintuitive user experience. Simplifying the flow and addressing the unfamiliar terminology would be crucial to improve user understanding and reduce cognitive load.

The research

Once we identified the problems with the publishing flow, we conducted a competitive analysis to understand how our competitors and similar products structured their own publishing flows.

From this exercise, we learned that most competitors had made publishing an effortless and quick task. The user flow was simplified, system automation reduced complexity, and prominent CTAs were placed at multiple spots to publish content.

Additionally, we examined customer support tickets from the past 12 months, which further confirmed the issue of unfamiliar nomenclature. We also collaborated with developers to help answer a few usage questions that our product analytics tool couldn’t, such as "how many URLs do each live creative have?" and "how many domains do our customers have in use?".

After learning more about it, we had a clear challenge:

How might we make publishing a straightforward task and empower users to successfully accomplish it?

The solution design

As we entered the moment for designing a solution, I started having ideation sessions with my PM, where we explored concepts for a revamped publishing experience that employed the learnings from discovery and competitive analysis.

Exploring ideas

These collaborative sessions were crucial for us to test different approaches and define a viable solution. Initially, our intention was to integrate the revamped publishing flow within our builder, the Creative Studio. However, we recognized that this implementation would require more time than we had available for this initiative. Considering our constraints and team expertise, we decided that implementing the new flow outside of the builder, where it already existed, was a more feasible approach.

With these alignments and decisions in place, I proceeded to work on high-fidelity designs for the new flow.

Problem-solving

To address the problems of Complexity and Disperse settings, we introduced a new component called drawer to encompass all the necessary functionalities for publishing. This drawer component could be overlaid on the creative page, eliminating the need for context switches.

In addition, we consolidated all significant URL and Ion creative settings into a new "Publishing settings" view, accessible at different stages of the user's flow:

• Before publishing the Ion creative, at the opening screen of the publishing flow.

• During the publishing process, on the URL screen for the published content.

• After publishing, on the creative page control bar.

Similarly, we created an "Edit URL" view that allowed users to modify URL-specific settings after publishing.

To streamline the publishing process and make it easier and quicker for users, we automated certain actions to reduce their initial effort:

• Status change: Users no longer needed to manually change the status of a creative. The system automatically adjusted the status when a creative was published.

• URL setup: Users no longer had to choose a domain or write a URL path for publishing. The system published the content to the most commonly used domain and used the creative title as the URL path. However, users still retained the ability to edit the URL and change the domain if desired.

Finally, to eliminate unfamiliar terminology, we made specific updates:

• Changed the status label from "Engaged" to "Live" to align better with market standards found in the competitiv analysis.

• Renamed the URL-tracking fields "Category" and "Subcategory" to "UTM Source" and "UTM Medium", respectively.

To address the Lack of guidance problem, we implemented micro-copies to provide users with clear instructions on advanced options within the flow, such as the "Respondent always new" option, and to assist them in determining the type of embed code they needed.

Additionally, we explored the idea of a checklist to help users publish effectively. However, due to time constraints, we decided to postpone the checklist for a future iteration of the flow.

Pushing improvements further

The revamp of the publishing flow also introduced several enhancements to the creative page, such as brand new URLs and Embed code cards for quick actions.

The URL card, which already existed, was improved with a more appealing design and additional features such as "Copy URL" and "Get embed code" shortcuts.

On the other hand, the embed code card was newly introduced specifically for Micro-experiences to further encourage the desired user behavior for this creative type.

User testing

User testing was a crucial step in the project, considering the comprehensive updates made to the publishing flow. As the responsible product designer, I planned and conducted remote and unmoderated usability tests for the publishing flow. The testing process involved:

• Defining the test objectives and the aspects of the design to be validated.

• Writing task scenarios for each user task to be tested.

• Creating an interactive prototype using Figma to simulate the user tasks.

• Establishing user profile criteria and selecting participants from our user base.

• Building the usability test using Maze, an online user testing tool.

• Collaborating with the Product Marketing Manager (PMM) to send out invitation emails to users for the testing.

• Analyzing the test results and prioritizing design iterations.

We had a total of six users participating in the tests, and the following key insights were gathered:

• Most users were able to complete the tasks successfully.

• Some users had difficulties finding the "Edit URL" option, which was presented as an icon button next to the URL.

• A few users attempted to publish by clicking on the legacy URLs card on the creative page, which was not the correct path.

• The usability test received a CSAT score of 66 points.

Based on the results of the usability testing, we made the following design adjustments:

• Included a mention of the ability to edit the URL in the micro-copy on the opening screen of the publishing flow.

• Replaced the icon button for "Edit URL" with a text button to make the action more prominent.

• Expanded the display box for the URL to accommodate longer text and avoid truncation, encouraging users to think about their URLs.

• Introduced a "Draft" state for the URLs and Embed code cards, along with a call-to-action (CTA) to publish the creative.

These adjustments aimed to address user issues and improve the overall user experience based on the insights gained from the usability testing.

Final design

You can view and browse the high-fidelity publihsing flow on the Figma embed below.

The outcomes

The introduction of the new publishing flow yielded the following benefits:

• Shortened the path to publish Ion creatives, making the process more efficient.

• Provided users with clearer guidance throughout the publishing process, improving their understanding and confidence.

• Reduced the effort required to complete significant URL, creative, SEO, and data settings for publishing.

• Eliminated outdated nomenclature, aligning with market standards and improving new users comprehension.

Although the new publishing flow was not fully implemented at the time I left Rock Content, we anticipated positive results in terms of key performance indicators (KPIs). We expected to see a decrease in user effort score and an increase in user satisfaction score, reflecting an improved user experience with the updated flow.

My learnings

One of the key learnings was navigating the complexities and interdependencies that arise in large user flows. It was a challenge to identify and address all the requirements that could be impacted, but it was essential to ensure comprehensive coverage.

Additionally, I enjoyed the close collaboration with my Product Manager (PM) during the discovery and ideation phases. Working closely together allowed us to leverage each other's expertise and perspectives, leading to more informed decisions and a stronger outcome for the project.