By Martin Holoubek
11.11.2019
As a design agency, we are particularly pleased when our designs are honored, and so our latest project - the website relaunch of ECD-Performance - has made it way up the Awwwards and CSS Design Awards web design charts and enjoys great popularity among the jury and the users. We will show you how we have built up the design and structure of the website and which technologies are being used in the following article.
The story
ECD-Performance stands for Exclusive Car Detailing - Performance and is the undisputed expert when it comes to exclusive and high-quality vehicle refinements, both in the interior and in the exterior. On the one hand, the German craft workshop focuses on the refinement of components with Alcantara, carbon and nappa leather, on the other hand it is about optimizing the engine management, the installation of high-quality aerodynamic parts and brutally sounding exhaust systems. The long-standing and mutually satisfactory cooperation between us and ECD-Performance is primarily based on common values and the same mindset in terms of design, quality, customer service and advanced thinking.
That's why it was time to give the current web presence a fresh look, with modern animations, up-to-date content and the latest technologies - and so we approached the project with joy and a vision.
Design & Experience
Der Designstil basiert voll und ganz auf unserer neuen Designlinie, die eine Vielzahl an modernen Designelementen , außergewöhnlichen Animationen, unkonventionellen Layouts sowie eine neuartige, zukunftsoriThe design style is fully based on our new design line, which includes a variety of modern design elements, exceptional animations, unconventional layouts, a novel, future-oriented user experience, and fresh, more aesthetic ways of digital communication. Minimalism and exclusivity run through the entire presentation in unison and make, together with the aesthetic animations & micro interactions as well as the appropriate choice of colors and harmonious compositions, a lasting impression. To make the experience even smoother, we have slowed down the scrolling behavior on desktop devices - a somewhat controversial method, since the scrolling speed should in principle be natural and should be left to the respective operating system or browser - but this can be used to specifically create an experience that conveys a sense of depth and floating content.
Technology & Development
Under the hood there's also a lot going on. Our in-house, self-developed PIXIT framework, in conjunction with the popular Bootstrap framework in it's fourth version, is responsible for the visual stuff - that is, providing all design, layout, and control elements, animations, and client-side functionality/logic. Since the system is modular, we can only integrate the required modules and thus increase the performance. For modern & fluid animations we use the animation framework GSAP (GreenSock Animation Platform), as it allows you to create simple yet complex animations that work on almost any device. For "Scroll based animations" ScrollMagic is excellently suited, together with GSAP this results in a dream team for modern animations. In addition, we use our own framework modules for Menu/Navigation, Slider, Imagebox, Imagegrid, Parallax, etc. As the Content Management System (CMS) Wordpress comes into play - with only the necessary plugins installed - so optimal performance and easy manageability, both for the client and also for the agency, are guaranteed.
"Dude, that's really nice, I'm totally speechless!
The design and the animations convince me to 200%!"
-Andre Bender - CEO, ECD-Performance
Those were the first words of the client when he saw the first screens of the redesign - which makes us very happy. After a few more steps of content maintenance, texting, adaptation and optimization of the modules, the overall optimization of the website as well as the testing and bug fixing were then taken on. Just in time for the Essen Motor Show 2018 ECD-Performance was live and could present itself from its best side and with its best site. After further optimizations in live operation and excellent feedback on the website, we decided to submit the project to Awwwards and then CSS Design Awards, giving the website and the client a great presentation platform and making us lucky design award winners.
We look forward to what's coming and thank you for the great support!