Concept
We started planning the relaunch of the website in September last year. The goal was to take the existing functions to version 11 of the TYPO3 system and further optimise them. Due to an extensive rights and role system, many editors for the individual departments and thousands of content and news data records, a lot of data had to be managed and migrated. Much has also changed in terms of the frontend and usability. But let's start from the beginning - or rather, from the front.
Design
The modern responsive web design, provided by the agency Triplesense Reply, offers a clear, well-arranged layout with strong colour areas and intuitive operation, and reflects the professional appearance of the TUM as a university of excellence and a pioneer in research. Special highlights are the dominant video header on the homepage and the use of the logo as an image mask on the target group pages - you can find out more about these in the UX & UI section.
modern Frontend
The frontend was completely redesigned and rebuilt in the course of the relaunch in order to establish the most modern standards and leave behind old burdens. Among other things, this means implementation without requireJS (pure "vanilla" JavaScript), as well as the use of CSS Logical Properties and native CSS variables. As a special "treat", an interactive WebGL module will soon be added, which is currently still under development. We don't want to give too much away yet, but this much can be said: the website will soon be three-dimensional.
UX & UI
As for every other German university and college, the BITV applies to the TUM website - the online presence must therefore be as accessible as possible. We achieved this through extensive testing and adaptation of colour and text combinations, operating elements and forms, as well as numerous other features. The user experience was also improved for the main navigation: in its stylish overlay, it can display up to four levels of menu depth and is intuitive to use. In order for users to maintain the necessary overview and reach their destination as quickly as possible, the navigation elements can also be narrowed down with keywords via a search field.
The main search itself, which is based on SOLR as in most of our projects, has also received a new overlay. Here, the search results are displayed with detailed information (category, navigation path, preview image and publication date, if applicable). They are divided into groups of six and provided with a pagination.
Another highlight is the target group entry, which offers a different entry page with specifically tailored entry points depending on the selection. With a total of 8 pages for prospective students, current students, employees, alumni, specialists and executives, founders, cooperation partners and finally the press and media, each visitor group can find the information relevant to them at a glance. Here, the TUM logo (as already mentioned above) is used as an image mask and - in combination with the individual background colours - forms a striking design element for its respective target group.
Studyfinder
How do you structure 167 study programmes and break them down for prospective students? The answer: our TYPO3 extension Studyfinder. With an extensive filter and a search above the list of results, the range of courses can be individually limited to help prospective students find the ideal courses.
Statute Database
The statute database is a collection of over 1500 statutes, regulations and official announcements that the university makes publicly available. On the website, this was realised through a connection to TUM's DMS interface, allowing the data to be retrieved from the database in real time. Matching statutes can also be linked on the respective degree programme pages. You can get a detailed insight into this solution in our article Statutes database: Customised DMS integration for TUM.
Curious?
Here you can take a look at the new TU Munich website for yourself:
