The Migros Group’s vocational training platform meets the highest standards. The new platform is fully integrated into the careers platform and has overcome some tough technological challenges. The solution to these challenges is the use of Drupal 8 as a headless CMS. The extremely modern functionality of the new version of Drupal has been fully utilised and a high degree of flexibility has been maintained in the front end. This means a consistent overall appearance for users while ensuring that the page is technologically completely independent of the home page of the Migros Group's careers platform.

Success via state-of-the-art technology

The page was connected to the existing CMS for the Migros Group’s careers platform. The modern technology stack uses Nuxt (vue.js for SSR apps), the Node.js Express server and the Node.js proxy API to export, aggregate and cache data from the CMS. Bulma was used as the CSS framework and TWGL.js with a custom GLSL shader was used for the dynamic visuals. A site cache and server-side rendering ensure availability and stability. Pre-rendering the website on the server makes sure that it is stable and available. When choosing which technology to use, flexibility was high on the list of priorities in order to ensure clients’ needs were met.

Sophisticated algorithms in the talent matcher

How can a teenager know which job is the right one for them? The Migros Group’s talent matcher offers a sophisticated algorithm that helps them to find the perfect job. By answering some simple questions, they find out not only what their dream job is but also what their personal profile is: How do I act in various situations? Do I like working with other people? What kind of personal relationships do I cultivate?

Good usability thanks to a well-thought-out back end

The challenge with the talent matcher was ensuring continuation if the page has to be refreshed or if the session is interrupted. You should be able to start answering the questions on your mobile while you are out and about and then, if your battery dies, continue from where you left off when you next use the talent matcher, without needing to log in. JavaScript was used to create a server-side-rendered single-page app (SPA). Thanks to cookies, a state was created that was not dependent on the individual session, which makes previous data entries available again later. The results are saved using the unique ID and can be retrieved at a later time, all while still ensuring data is secure and protected. This user-friendly solution is a combination of innovation and pragmatism. The target group here is formed of digital natives who are used to having a high level of digital convenience, which is why this function was decisive in the success of the talent matcher.

Chatbot

The new platform may not have all the answers, but it does have most of them. Mino Chat allows you to chat with Mino, the Migro Group’s Apprenticeship Hub’s little mascot. Adapted to this target group of digital natives, the chat’s content is full of emoticons and is written in a humorous style.Mino Chat is a chatbot that guides users through the questions asked. It also provides information about events nearby as well as offering the opportunity to save an application deadline.

High performance even with significant visualisation

Digital natives primarily use mobile devices, which is why the project took a mobile-first approach: creating a modern, target-group-oriented hub for use on mobile phones. 3D renderings and animations are a core element of the website, and lots of different videos have been integrated. Nevertheless, the content is responsive (can be used regardless of the end device) and the graphic elements have been optimised for mobile devices. The video and image formats respond to the different sizes of the devices. This means the platform works well in all major browsers, even if they do not support WebGL. Moreover, content is guaranteed to be found by search engines: thanks to the server-side rendering of the SPA, all content is indexable by search engines. In spite of the amount of functions and visual content, accessibility is guaranteed. Of course, a valid client code is required.

High content quality thanks to CMS functionality

In addition to interactive services such as conversing with the chatbot or receiving an appropriate apprenticeship course recommendation from the talent matcher, visitors to the platform have access to a broad range of content: short video clips entertain visitors and make playful fun of certain careers. As this content and the entire structure are defined in the CMS, and the front end exclusively uses this content and structure, there can be no dead links. All pages have also been tested multiple times by the target group.

Technical innovation remains the focus

The Migros Group writes that other services are in the pipeline, all tailored to the needs of this digitally demanding target group. In the future, there will be a taster apprenticeship finder and an application coach.