The drafts for the relaunch of the co.patient website came as Photoshop files from the agency. During the development many small and big design decisions had to be made. The microanimations, for example, could only be fine-tuned in HTML.
In this web project, the layout is consistently based on Flexbox. Images and graphics are integrated wherever possible as inline SVGs or are delivered via lazy loading after the page structure is built. Therefore the website loads extremely fast despite it's features richness.
For the first time I used the CSS property mix-blend-mode, with which overlay effects like the Photoshop layer modes can be created. Have a look at the tiles and header graphics, which are overlaid with animated "color foils". For IE and Microsoft Edge a progressive enhancement was implemented, which shows the tiles and headers without background image as simple color areas.