Content Branding & UI Design

Last Updated October 9, 2024

Important Note

Both UX (User Experience) and UI (User Interface) design principles create a seamless and intuitive user journey, enhancing user satisfaction and engagement.

This article focuses on principles for content branding and UI design. For information on Microcopy and other UX best practices, visit Microcopy & Editor Organization Principles.

Brief Overview

UI Design is about how your WalkMe implementation looks and feels, including the color schemes, button shapes, font choices, animations, and all the visual aspects that facilitate user interaction. UI Design is often likened to graphic design but with a focus on interactivity. It's about creating aesthetically pleasing interfaces that are consistent, cohesive, and effectively guide users through the product's interface.

Consistent, branded assets fosters end-user trust, reduces content development effort, and helps create streamlined, efficient deployments for your project.

How This Impacts Your Program

Benefits of operationalizing
  • Reduce time-to-delivery for future net new projects and WalkMe items 
  • Build trust with end-users through a consistent brand experience 
  • Eliminate decision fatigue - standardize early 

Risks of not operationalizing

  • Lack of end-user trust 
  • Unsanctioned styles being created without oversight

Design Approach By Software Type 

Design approach can differ depending on the end-user audience of your software. 

Internal-facing application
  • Users: Employees & contractors (EX)
  • WalkMe Design Recommended: Adheres to company branding and styling guidelines
  • Consideration: Determine if there is a way to opt out of the standard design. If so, what are the reasons and approvals pathways?
    • The most common reason for opt-out is a design clash (for example, blue WalkMe balloons on a blue application background)
    • The Digital Adoption Team needs to agree on an alternate approach
  • Cross-functional Needs: Not commonly needed

Not sure what company brand guidelines look like? See ours here

External-facing application

  • Users: Customers or public facing (CX)
  • WalkMe Design Recommended: Adheres to application branding and styling guidelines
  • Considerations: Designate the application design owners as the main stakeholders in the design template creation and approval
  • Cross-functional Needs: UX, Design or Marketing

When This is Relevant 

The Project Lead should communicate design expectations to stakeholders during the Kickoff and Discovery stages of an implementation. 

Example language for the Digital Adoption Team to use with your stakeholders: 

“[Company] has a standard CSS format that is used across all apps in the enterprise. The design standard is easily deployed, scalable, and matches [Company] brand requirements. The standard design will be applied to your Editor upon creation.” 

  • Include screenshots of sample WalkMe balloons, the Menu, or any design ideas

Some stakeholders may want a custom, localized design that differs from your global standard. Here's how the delivery resources on the Digital Adoption Team should handle those conversations and set proper expectations.

Note

This section provides a framework for a self-sufficient digital adoption Center of Excellence to run their own design consultations and conversations. If you need support in execution of design needs, WalkMe has custom offerings available - please discuss this with your Customer Success team or WalkMe contact.

Ongoing Ownership

Key talking point: Global design is easiest for scaling and maintenance.

Ask your stakeholder: Do you have someone to handle upkeep if changes are needed?

Level of Effort

Key talking point: Changing visual elements (via CSS) is the easiest/lowest level of effort for custom design, while changing HTML takes time/development work. In general, removing design aspects from WalkMe's templates requires less effort than adding new design aspects.

Ask your stakeholder: Are you prepared to absorb adjustments to a project timeline if needed, to accommodate additional time needed for adding design aspects to templates?

Risk Management

Key talking point: If a design deviates significantly from the existing HTML structure, it may introduce fragility and risk.

Ask your stakeholder: Do you have someone to handle upkeep if changes are needed? Is this a high-visibility item that would cause significant distress if it was broken?

Accessibility

Key talking point: Understanding level of accessibility compliance is important.

Ask your stakeholder: Does your organization require UI elements follow strict accessibility standards?  Ex. color contrast, keyboard accessibility, etc.

Get Inspired: Learn From Other Customers

Watch these two videos to see how three customers have utilized DAP implementations as a way to reinforce their unique brands with their users. Discover how characters, colors, and a focus on improving users' experiences led to small changes that made big impacts.

This customer brought a Designer to his centralized program team to do an in-depth brand for his DAP Center of Excellence, to support continued stakeholder awareness, professionalism, and scale.

Get Started

Creating and Testing CSS - Tips from Experts

Other Resources

The following are primary WalkMe tools that help you manage branding and style guidelines at scale. 

Was this article helpful?

Thanks for your feedback!

Be part of something bigger.

Engage with peers, ask questions, share ideas

Ask the Community
×
×