INTRODUCTION

Content Hub

With the merger of three brands, all users will be brought onto a single platform for creating and editing content. Today, different editors exist for news, websites, and email — each with its own design style and interaction model. This fragmentation makes it hard for users to switch between tools smoothly.

As a result, content creators face inefficiency, wasted time, and inconsistent formatting. Beyond workflow friction, the lack of alignment also weakens brand identity. A unified editor is needed to streamline editing, ensure consistency, and provide a cohesive user experience across all content types.

START

Don't rush into the functionality design！

When working on tool-oriented products with complex interactions, designers often focus too quickly on individual features. This can come at the expense of considering the broader design framework.

Without a solid foundation, changes at the framework level are often deferred to later stages of development, where they are harder to implement and risk causing long-term issues for the product.

ANALYSIS & RESEARCH

Problem analysis

From customer calls and user research data, we have learned that the majority of users write content using other editors and then copy it into Staffbase. Only 12% of users utilize our online editor.

In the requirements phase, the design and product teams research and analyze user scenarios, enrich user models, and create user stories. Attention to detail is crucial, including information flow between workflows and events that influence design decisions. Also, analyzing the similarities and differences in user journeys across three products.

COMPETITIVE ANALYSIS

At this stage, competitor analysis is essential to clarify decisions on layout, workflows, data elements, and interaction patterns. It allows us to learn from competitors’ strengths, identify key differentiators, and reassess the priority of our own features

USET TEST

High-frequency functionalities

We extracted all high-frequency functionalities and validated them through UserTesting. The assessment of major functional modules and key interaction hotspots is illustrated in the diagram below.

PRINCIPLES

The Reorganization of Layout

We aim to deliver a user-friendly and enjoyable experience, enabling users to access all product features with ease. By reducing visual clutter and focusing on clarity in content browsing, we create a flexible visual style that works across different content types.

Optimizations such as larger font sizes and comfortable line spacing (1.6) improve readability for long-form text. Within platform guidelines, subtle details like gradients are introduced to provide a fresh and distinctive visual experience.

Final Design

We have streamlined the creation entry and user pathways, allowing users to choose their preferred editor from the start. Additionally, we offer the option to select from a variety of templates to further enhance their editing experience.

With this flexible editor, users can move seamlessly between editing modes and manage different aspects of their content within a single interface. From fine-tuning text to enhancing visuals or adjusting multimedia elements, the Multi-Type Editor delivers a unified and efficient workflow for producing engaging, professional content.

More

We updated the preview screens to better reflect real usage scenarios. By showcasing authentic layouts and content examples, the previews help users visualize how their work will appear after publication, making the editing process more intuitive and trustworthy.

More

By unifying different editors into a single, flexible platform, we streamlined content creation and ensured a consistent brand experience. Through competitor analysis, user testing, and design refinements, we built an editor that is both efficient and intuitive.

The result is a tool that empowers content creators to focus on producing engaging content, supported by a clear and cohesive design framework.