CaptionAI Integration Case Study

Project Overview

For this project, we introduced and integrated a new feature inside Cloud Campaign, a social media marketing and scheduling tool. The new feature is CaptionAI, an AI powered caption generator that works to improve the workflow of Cloud Campaign customers. There are two forms to CaptionAI, one as an integration and the other as a standalone product.

Teams and My Role

Members from teams across the organization were involved including product, engineering, marketing, customer success, and sales. I acted as the sole UI/UX designer.

The final design of the CaptionAI integration

Problem

How can we live up to what Cloud Campaign stands for and keep the platform intuitive and powerful? How can we continue to allow our customers "to breeze through [their] most time-consuming tasks?"

Solution

An AI powered caption generator that would reduce the time spent on the platform. One of the main goals from an user experience for a platform like Cloud Campaign is to decrease the amount of time users spend on it. Through CaptionAI, users can create content quickly, making better use of their time.

Key Points of Consideration

  • How to handle limited space in the location of implementation

  • How to integrate and introduce the implementation without disrupting the existing work flows of our users

  • How to add value and satisfaction without hindering user experience

Key Points of Reflection

  • More minds at the beginning proved beneficial in several ways given the startup environment and one person design team

  • Keep documentation up to date and accessible to all necessary parties

  • Check in early and often with your engineers to discuss topics from feasibility to final visual design reviews

Research

Initial research, focused on AI in general, was carried out through user interviews, surveys and competitive analysis. We took note of our various types of users including the size of the marketing agency and the industry they served.

Research Results

With regards to Cloud Campaign's problem space, these were some of the key wants from existing customers.

  1. Ability to edit captions (must have)

  2. Bulk operations ability (future phase)

  3. Ability to generate platform specific captions (nice to have & feasible)

  4. Ability to train the AI generator to suit their industry (nice to have & not yet feasible)

Ideation

I carried out a design sprint specifically for the ideation portion of the project. With time and collaboration being a limited resource, the ideal design sprint was adjusted to fit the environment and timeline. The sprint began with a product requirements document and from there a cross-functional team was created to participate in the brainstorming and ideating part of the process.

Sprint Review

Collaborating with internal team members, who have been in consistent contact with our customers, provided key actionable insights. Suggestions were made, implemented, and documented for future phases.

User Flows

Below are the three key user flows determined from the design sprint.

  1. The create content modal flow

  2. The post now screen flow

  3. The calendar view flow

As shown below, each flow is slightly different due to the various entry points and how the platform is currently designed.

Architecture: Where & How

One of the key considerations was dealing with the limited space where the integration was to take place. It came down to the following two options.

The first two images show the vertical scroll option on the Captions section of our content creation modal.

The following two images show the horizontal scroll option, which takes the user to an additional screen within the Captions section.

Iterations

From my experience, speed is a key component when it comes to iterative design. Here are some of the iterations that occurred during this project.

Main Screen Changes

From Top left to bottom right, the image below shows how the main AI screen changed as requirements changed.

Some of the additions include:

  • Platform specific selection dropdown

  • Token usage count

  • Hashtag toggle

  • Placeholder text

Some of the subtractions include:

  • Token usage progress bar

  • Token usage count

  • Caption count info

Platform Specific Result/Edit Screen Changes

Cloud Campaign provides a feature in which users are able to create captions specifically for the type of social media post. When implementing CaptionAI, we debated between the following two versions.

The first version shows all platforms in caption edit mode even if the platform was not selected.

The second version shows only the selected platforms.

A/B preference test results reflected less confusion and higher learnability with the second version. Often times, less is more.

Results and Reflection

This new feature has been successfully released and is being utilized by a noticeable majority of Cloud Campaign customers. With that, there has been an inflow of positive reviews with regards to the design and the functionality of the feature. Personally, this is one of my proudest projects at Cloud Campaign as I stepped out of my comfort zone and reached out for increased collaboration. This in turn led to a fuller list of design requirements, better understanding of the technical feasibility, and clearer insight into user needs. This allowed for easier navigation when faced with scope creep, new information, and necessary adjustments.

Next Steps

  1. Gather user feedback and pinpoint pain points

  2. Review the must haves and nice to haves

  3. Organize Phase 2 requirements and KPIs

Posted on Jul 12, 2023

More by Jane Pyeon

View profile