Challenge. Our client wanted to help brands (such as de Volkskrant, Het Parool, Trouw) create engaging stories with rich content that readers would enjoy. They noticed that their existing article editor had become difficult to maintain and required an update. This led to the need for a new concept and the development of new elements, known as content blocks.
Value Delivered. We developed a concept to gradually move towards a simplified editor with consistent interactions and navigation while delivering features such as content blocks for images, embeds, quotes, ratings, nested content blocks, accordions, and AI-driven tools for grammar and search engine optimization checks.
Background
Approach. Before diving into the articles, we first tried to understand how editors work. This proved to be quite challenging, as DPG Media includes over 50 brands and approximately 3,000 users, each with their own organizational structure and unique workflows. Despite the wide range of ages, roles, and brand-specific practices, we focused on the common “Jobs-To-Be-Done,” which were surprisingly similar across these differences. To gather insights and begin concept development, we used the following methods:
- User interviews
- Journey mapping
- Persona’s (beginner, advanced, experts)
- csat score (surveys)
- Expert Review & Audit
- Prioritising problems
- Benchmarks
- Workshops
Insights. Based on our interviews, journey mapping, expert reviews, and customer satisfaction scores, we identified numerous pain points, with the following being the most common ones:
- Lack of consistency in (setting, navigation) patterns and completing actions for users.
- The need for better grammar controle within the articles.
- The need to better understand the system and (advanced) actions.
Concept Design. The goal was to set a vision for the editor that was to be achieved within the next year or 2 years. This goal and the many technical constrains resulted in the following propositions, validated amongst users with a prototype.
- Global Navigation
- Sticky (main) toolbar
- Unit toolbars, labels and placeholders
- Fixed menu positions.
Deliverables
Detailed design. The concept design resulted into a roadmap to start delivering unit, including their interactions. Slowly progressing to the envisioned concept designs. What we delivered so far is:
- Adding Units flow
- Dragging Units
- Unit interaction (anatomy, states)
- Toolbars & Labels
- Extra Features
Extra Features
Other problems. We also developed an AI-driven model to analyse articles and provide grammatical suggestions that could be easily implemented in the text.
Additionally, we introduced features such as an author page and AI-driven recommendations to optimize the SEO of articles.
