Career choice portal for teenagers, parents and companies
Our team is revolutionizing career choice in the canton of Zurich by developing a user-friendly portal with interactive elements, personalized content and “headless” architecture.
The web application gives students, parents, teachers and career counselors easy access to information and thus provides optimal support in choosing a career.
Project
An innovative career choice portal for everyone
Phase 1 + 2
Together with the Department of Education of the Canton of Zurich, we have designed and implemented a portal on the topic of career choice, which is now also accessible outside of school for a wider audience such as teenagers, parents, teachers and careers advisors. The portal runs technically via a so-called “headless” CMS, which collects data from various sources via different interfaces so that the content is always up-to-date and even easier to maintain.
Companies in focus
Phase 3
In the third phase, an area was added for companies to present themselves. Thousands of young people use the career choice portal to find out about professions and search for apprenticeships.
In addition, trial apprenticeships and apprenticeship positions are displayed and interested parties can use their login to make an inquiry directly on the trial apprenticeship profile.
Career choice blog and radar
Phase 4
The blog contains tips and templates for choosing a career, trial apprenticeships and apprenticeships. In addition, students can find out their dream job in a fun way using the careers radar. We also created an overview with information for teenagers to find out which baccalaureate school suits them best. Read more
Finally, we made various optimizations for even better user guidance.
Initial situation
The career choice app for teenagers looking for a career in the canton of Zurich has been around for 5 years. Until now, the app could only be downloaded to a mobile or tablet device from the Apple App Store and the Google Play Store.
Secondary school pupils were able to use the mobile app to obtain all kinds of information on careers, including trial apprenticeships, and pupils from the third year onwards were able to find out about companies offering apprenticeships.
This native mobile app has been a good basis for informing young people in recent years. However, the demands on the app have grown in the meantime – among other things, teachers want to incorporate information from it into their “career choice” lessons.
However, as there is a general “cell phone ban” in the classroom, a desktop version of the app was requested that can be accessed on the school computers.
The information should also be made available to a wider audience: The target groups of teachers, parents, careers advisors and mentors should also have access to the information in order to provide teenagers with the best possible support in the career choice process.
The Department of Education of the Canton of Zurich has therefore commissioned us to expand the existing career choice app to meet the new requirements.
Web App Development
A PWA and web application for desktop, publicly accessible via berufswahl.zh.ch.
The career guidance portal developed is a progressive web app (PWA) that is optimized both as a web application for desktop computers and for mobile devices. The PWA can be accessed via the berufswahl.zh.ch website and offers a user-friendly, easy-to-understand interface for students, parents, teachers and careers advisors to find and make optimum use of information about professions, apprenticeships and trial apprenticeships.
React.js Development
React.js offers fast rendering, modular code, reusability of components, efficient performance, easy scalability and great community support.
Single-Page-Applications
Single page applications are fast, user-friendly and interactive. They enable a seamless user experience with optimized loading times and an appealing design.
Progressive-Web-Apps
Progressive web apps offer cross-platform compatibility, fast loading times, offline functionality, low memory requirements, automatic updates and convenient installation.
Highlights
New concept for user guidance and information architecture
The new user guidance concept ensures that each target group (teenagers, parents, teachers, careers advisors) is presented with the information that is most relevant to them.
The information architecture has been redesigned to facilitate access to content that helps users quickly find the information they need and provide a better navigation experience.
Clever registration and login concept for teenagers and teachers
Registered users receive personalized content based on their interests and test results.
These include suitable professions, companies to try out and the associated information events. The careers advisor responsible for the school in question is also displayed to enable direct contact.
Personalized content
As soon as the teenagers have registered, the portal shows the person responsible for careers advice in the relevant school. Contact for a consultation can be made directly with a click.
If the teenagers have already completed the interest test, suitable professions, companies to try out and the corresponding information events are displayed according to the identified interests or occupational fields.
Company profile
In the section for companies, companies can present themselves free of charge on the career choice portal and thus engage in apprenticeship marketing.
Thousands of young people use the career choice portal to find out about careers and look for apprenticeships.
Companies can:
- Create your individual company profile
- Advertise apprenticeships and trial apprenticeships
- Publicize their company’s events
Schnuppern (trial apprenticeships) made easy
The number of introductory apprenticeship positions is displayed directly in their own section. Thanks to their login, students can easily contact the companies and arrange a trial apprenticeship.
Discover professions through play
The careers radar is more than just a source of information. It is a playful companion for teenagers on their journey to discover their career interests. Every interaction is saved in the personal profile, resulting in an individual ranking of the top 3 occupational fields.
Job radar
Through interactive elements, young people can explore occupational fields in an entertaining way and discover their interests in a fun way.
Personal ranking
Continuous gaming leads to an individual ranking of the top 3 professional fields, which enables a targeted focus on particularly interesting career paths.
Tips
The career choice blog is the source for inspiring insights and valuable tips on the way to a well-founded career choice. Connected to a dynamic platform that helps teenagers shape their professional future.
From application tips and successful interview strategies to checklists and CV templates – the blog offers practical tips to help you prepare for entering the world of work in the best possible way.
“Headless” architecture
Automatic connection of content via various interfaces.
Content from various data sources
The portal contains a wealth of information on professions and companies that offer trial and apprenticeship positions, as well as various information events, including registration options. All this data is already stored in various databases and is available there.
We have therefore designed the application so that it periodically retrieves the relevant content via several interfaces and saves it in its own backend (WordPress). This means that only a small amount of additional content needs to be maintained manually in the CMS.
The content that is displayed via the interfaces from other databases is automatically always up-to-date and does not have to be managed any further – a major simplification.
Sustainable and expandable
The portal is equipped for the future and allows for future expansion and other topics related to career choice without any problems. This is partly because we have chosen a “headless” architecture for the implementation. This means that the content is detached from the presentation of the portal (front end) and can therefore function independently – currently tailored to the corporate design of the Canton of Zurich.
More on technical implementation in this article: “CMS – traditional or headless?”
Technologies
WordPress Development
Customized WordPress development for user-friendly websites, individual functions and appealing design.
Schnittstellen & Migrationen
Interfaces & migrations enable smooth data transfers and system integrations for efficient business processes and improved collaboration.
Headless WordPress
Headless WordPress separates frontend and backend for more flexibility, better performance and individual design options in web development.
A responsive design and mobile first approach in web development
In today’s digital world, most users access content across different devices, screen sizes and platforms. To create an optimized user experience and ensure that websites and applications display correctly on all devices, the use of responsive design and a mobile-first approach in web development is essential.
New user journey
The user journey of the young target group now looks as follows:
In the classroom
The teenagers are familiarized with the career choice portal by their teacher. In the classroom, on a desktop computer, the pupils are instructed about the career choice roadmap. Each young person can click through the interest test, which is the first step towards personalization in the classroom.
At Home
The teenagers can find out about the careers suggested on the basis of the test results and discuss them with their parents or mentors if necessary.
On the go
The portal is accessible on all devices and screen sizes via a browser. This means that young people can find out about careers, upcoming events or apprenticeship positions at any time and register accordingly.
Login via Magic-Link
Login without password
So that teenagers don’t have to remember a password, the web application sends a link to log in to the email address provided. This allows registered users to log in securely, quickly and easily.
New for teachers
Teachers are pleased
The portal has been available to teachers in the canton of Zurich since the start of the school year in summer 2019 as a supplementary tool for career choice lessons and has been very well received so far.
The portal for the classes is really brilliant! Visually, in terms of content and structure, it’s simply superb!
Teacher biz Urdorf
«I really appreciate the transparent and fair way required works!»
Marc Gander Odermatt
Next case study
Ringier Advertising Dashboard
With 73 brands, over 100 advertising formats and millions of users, Ringier Advertising offers an impressive variety for advertising customers.
Our goal was to create a user-friendly solution for the marketing of media titles and marketplaces. Working closely with the Ringier Advertising team, we created an innovative website based on WordPress.
Other Projects
A couple more of our client projects.
-
Workshops and prototype for an insurance premium calculator
We conducted workshops for an insurance start-up and implemented an interactive prototype of a premium calculator in a design sprint.
