Strategic UX/UI development for a Bavarian education platform

In the summer of 2023, we were commissioned to analyze the brand universe of the education platform and its applications and to develop a recommendation for the future brand strategy. To this end, we initiated a joint brand workshop. Together, we developed the goal of creating a memorable brand experience in which the product is viewed comprehensively and holistically: Memorable brand experiences arise when you avoid silo thinking, view the product comprehensively, and think holistically. Based on the results of the workshop, we developed a brand recommendation for the entire education platform. Our focus was on defining a compelling self-image in the form of a brand pyramid and a recommendation for future positioning and brand names. Building on our brand strategy, the merger of all applications in the education cosmos was implemented, with our consulting support. 

Since the individual applications exhibited many discrepancies in terms of color schemes (light, dark, high contrast), typography, and UI elements, we designed a comprehensive digital design system and built it in Figma. By establishing a clear structure of atoms, molecules, and organisms, we ensure overall consistency at a granular level, while larger components remain adaptable to specific applications. This collaborative approach, which also provides for the expansion of the system with other partners (agencies), is supported by detailed documentation for each component – including description, intended use, responsibilities, and current status. This transparency and clear distribution of roles optimizes collaboration between all parties involved, from editors and developers to customers, and ensures the efficient and consistent further development of the platform.

The top bar navigation, an web component positioned at the top of every application, is much more than just a graphical element. It is the invisible backbone of a coherent user experience within the education platform.
Regardless of the technological basis used by the individual applications, the top bar guarantees standardized functions and preserves corporate identity (CI). For users, this means a familiar environment, regardless of whether they are navigating the learning platform, the information portal, or another application. The top bar thus creates a seamless transition experience and plays a key role in helping users find their way around the diverse world of the education platform and focus on the actual content.

For one application, we developed a forward-looking concept for integrating artificial intelligence directly into the rich text editor. This enables students to use AI in a safe and transparent manner. At the same time, teachers can leverage the advantages of AI to create assignments and share information. The implemented functions include both free prompts and context-sensitive quick prompts for text creation (summarizing, translating, detailed description), audio and image generation. A transparent display of the prompt quota promotes the responsible use of AI. The generated content can be seamlessly integrated into the editor.

In close cooperation with our developers and the developers of the education platform, we have created an innovative tool that addresses the relevance of AI in education while ensuring the highest data security standards.

The technical implementation of this ambitious project was carried out in close collaboration between our internal development teams and the experts from the education platform. Particular emphasis was placed on seamless integration into the existing architecture. The Mustache template engine played a central role in the development of the AI tool and the corresponding plugin.