With its strategy "Charité 2030 - Rethinking Health," Charité is continuing to drive the future of health care and research. For the future strategy, Charité rebranded their project website with the creative agency Juno. The goal: To present the visionary plans to the public in an expressive way. For this, we developed interactive 3D visualizations that make the planned construction work come to life.
Interactive 3D architecture models underline the Charité's vision
The Charité is strengthening its position as a driving force of healthcare with the future vision "Charité 2030". To present the future strategy to the public in an appealing way, Charité developed a project website with the creative agency Juno. The focus of the planned measures is the development of the four campuses. We developed 3D architectural models of the four campuses that expressively showcase the planned construction work on the website. The models not only show the architecture in 3D with helpful information for the users, but also animate the structural changes via an interactive time slider.
From cubage to a digital 3D model - buildings recalculated
Smoothly slide into the future - Interactive 3D applications on the website
Interactive elements on the website inform and activate users and help make topics more tangible more quickly. In order to communicate the structural changes on the campuses up to the year 2050 in an appealing way, we developed interactions on the visualizations. Each mouse position on the building models is assigned its own action, such as displaying an information window or coloring a building.
A special feature of our 3D visualizations are the animations of the buildings, which can be controlled by the user with a time controller. With the time controller, the structural changes over the years are animated. Buildings are colored, "grow" out of the ground or "disappear" from the floor plan again. With the WebGL application and the almost direct interface to the graphics card, we are able to display millions of triangles simultaneously and let the animations run smoothly in the browser.
Using the power of 3D models on your website
Based on data from architectural drawings, we created an individual and interactive 3D visualization for the Charité, which animates the structural changes on the campuses based on three.js and WebGL and informs users interactively.
This kind of interactive 3D visualization is rarely used by companies on websites. Thanks to the WebGL application, however, we are now able to display and play complex models with animation effortlessly in the browser. This project has shown us that you don't necessarily need the right data format to be able to develop a sophisticated 3D display. Ultimately, we can develop a 3D model ourselves based on raw data by processing the data accordingly in 3D authoring.