The "Red Dot" award has established itself as one of the most coveted quality seals for good design. The international jury awards outstanding design in the fields of product design, communication design and design concepts. The award winners present themselves in the newly designed online exhibition at red-dot.org. With the relaunch of the global website we make the Red Dot design universe a new experience.
The new Red Dot website focuses on the online exhibition of the award winners. The visitor experiences a gigantic pool of products and communication projects.
Thus, one of the challenges was to provide a clear overview and to find the numerous exhibits quickly in the online exhibition. Of course, the own design demands on the winning exhibits should also be reflected in their digital presentation. In addition to easy accessibility, the goal was to inspire the design-oriented user with a virtual visit to the exhibition. For this purpose, too, a particularly dynamic user experience was to be realized.
The website concept initially designed by KMS Team, which focuses on the essentials, serves as a stage for the award winners. The requirement for the implementation by PPW was a lively user guidance with flowing transitions. Full-screen videos, generous image material and micro-animations accompany the user from the start page to exhibition and information areas. Participant and press information is presented in a puristic, typographically strong form.
The sophisticated appearance had to be harmonized with the existing image material. In addition to the technical implementation, we were therefore also asked for the detailed conception of the page types as well as for sitebuilding and migration of the existing data.
The approximately 8,000 works from the areas of product and communication design form the core of the new Red Dot appearance. The central entry point to the online exhibition is the prominent search function à la Google. The used Solr technology enables a high-performance search experience. The usual list of search suggestions is typographically staged here and visually supported by corresponding background photos. The user is immersed in the design gallery by switching smoothly to the search result view. With easy-to-use filter elements, it offers the opportunity to browse the 48 award categories according to one's own interests.
Thanks to the implementation using a single-page application based on Vue.js, the new website offers a user experience familiar from web applications such as Facebook or native apps (see: hybrid vs. native apps). Content is reloaded dynamically - without waiting times or noticeable page changes. To ensure that search engines can still capture all content, the Nuxt.js framework provides easy indexing for Google Bot etc. At the same time, the user is offered a seamless and particularly dynamic browsing experience.
Additional sub-pages are provided as soon as the start page is loaded. Via a specially developed interface, the Vue.js Frontend communicates with the Solr Search, which is responsible for generating all content from the TYPO3 Backend. Images are loaded in a data-saving manner, to make the user experience as smooth as possible.
A particular challenge here: On the one hand, to meet the performance requirements of the website (keyword: mobile-first), on the other hand, to meet the demands of the design winners who want to see their work presented in the best possible resolution on the net. Numerous subtle animations in the menus, search fields or across pages round off the UX. In this way, we enable a rapid performance that both pleases the user and is honored by the search engines.