Banner Content Template System
Developing standards for content in a tool where anyone and everyone can post warnings and information.
Content before
WARNING - This is a B2B order. If the customer calling is not the Account Holder, do not discuss order information (including financial). Please click for more details.
Content rewritten using my system
Verify B2B Account Holder. Verify the caller is the Account Holder. Do not discuss order information or financials before verification. Learn more
OVERVIEW
Customer service agents struggled to understand the amount of information communicated in banners and alerts in an important internal tool used for handling customer contacts.
PROBLEM
The tool could display an unlimited number of banners with no regulation of the content or design, resulting in a rainbow of alerts competing for the user's attention.
GOAL
Create guidelines for writing banner content which could be distributed to any team wishing to add an alert to the tool.
TEAM
1 Lead Product Designer
1 Product Manager
1 Content Strategist
EVALUATING THE CURRENT STATE
Too many banners. Too many colors. Too difficult to read.
Being forced to parse through the rainbow of banners increased agents' Average Handle Time (AHT) - a key metric that describes how long it takes an agent to complete a live contact with a customer.
DEFINING BANNER USES
Banners are an important communication tool for critical information. But what kind of information were teams trying to communicate?
I evaluated a large selection of current banners and their content to answer the question: "What do banners do?"
PROVIDE ALERTS
A banner can be used to warn a user of critical system issues or advise caution when handling troublesome contacts.
INDICATE ELIGIBILITY
Banners may also be used to communicate whether a particular tool or action is unavailable.
ROUTE TO A PERSON
A banner can route a user to a specific person or team should they encounter a certain issue with the contact.
PROVIDE CONTEXT
Banners can also communicate other customer- or store-specific context.
DEFINING THE SYSTEM
Once I defined the goals and uses of banners, I developed a template for each use case.
I created a chart to visualize the guidelines and share with team members.
Each template uses a shared standard format to ensure the user can easily scan the content. If an existing banner's content didn't match one of the categories defined, that content would do best elsewhere on the webpage and not in a banner.
TEMPLATE DEFINITIONS
Each banner category has a distinct pattern to prevent any unnecessary words.
LANGUAGE EXAMPLES
Help users of the system understand what kinds of statements they should use when writing content.
SHOW IT IN USE
Provide examples of real banners that have been rewritten according to the rules.
TESTING THE SYSTEM
Applying the template system to existing banners decreased the amount of words on the user's screen, making banner content clearer.
I tested the system by finding different existing banners shown in the tool and rewriting them according to the system.
❌ Old content
WARNING - This is a B2B order. If the customer calling is not the Account Holder, do not discuss order information (including financial). Please click for more details.
✅ Alert template
Verify B2B Account Holder. Verify the caller is the Account Holder. Do not discuss order information or financials before verification. Learn more
❌ Old content
Contact Ext. 1234 for processing. There is a SPECIALIZED TICKET open for this customer. Update the ticket here.
✅ Routing template
CMT Ticket Open. Assist the customer and update the Customer Management ticket. Contact the CMT team Ext. 123456. Learn more
❌ Old content
WIZARD UNAVAILABLE. The Returns wizard cannot be used at this time.
✅ Eligibility template
Returns Wizard Unavailable. This wizard is unavailable for this order. Learn more
OUTCOME AND LEARNINGS
The template system improved the readability of banners and decreased the amount of time it took to manage banners, new and old.
While the system was intended to be used by any team, it later became employed by a single team handling the production of the a platform utilizing the banners. The template system became a vital tool in the new platform.
BETTER CONTENT
The system helped product partners write and rewrite banner content to reduce noise and cognitive load for the users.
FASTER DEVELOPMENT
The templates provided clear guidelines in writing. Now, decisions about banner content can take only a matter of minutes.
STANDARDIZATION
Banners in the tool have a shared content structure that is easy for users to scan.