Reliable and "steel" looking landing page for a Germany-based manufacturer

Project scope

The MD company is located in Germany and is engaged in the professional production of spare parts for engines of large vessels. They came to us with the request to develop a sleek, contemporary, single-page website that emanated trustworthiness and highlighted their expertise and attention to detail.

The employer provided photographs, video materials, and text content for all sections of the site, as well as 3D models in .CAD format.

Solution

After carrying out the research process: offering references in stylistic solutions (colors, fonts, shapes, materials, and animations), as well as receiving feedback from the MD Trade team, it was decided to create a site in dark tones with metallic shades, using bold typography and introducing 3D models marine engine components.

This combination of interface elements made it possible to create a feeling of reliability and professionalism, and the recreated animated (and, no less important, optimized for the Web) model of the engine assembly made it possible to show the depth of understanding of the process of creating spare parts and the expertise of the MD company. To enhance the effect, a looped silent video was also used with the process of production and design of spare parts.

An interesting feature of this site is also a 3D model of the globe, demonstrating the scale and geography of the company’s work, as well as an animated custom cursor with the color of iridescent polished metal.

Technology

In the process of creating the site, programs such as Figma, Blender, and Adobe After Effects were used. The site engine was the Webflow platform with the addition of custom CSS, and HTML JS code. To animate and integrate 3D models, WebGL technology was used, as well as the Three.js library.

‍Employer's Insights

Please describe your company and position.

I am the Director of MD Trade & Spares GmbH.

Describe what your company does in a single sentence.

Specialists in the supply of main engine spares for MAN 48/60 and Pielstick engines

What specific goals or objectives did you hire Digital Butlers to accomplish?

• Design and create a new website
• Website was to be high tech and class leading

How did you find Digital Butlers?

Online Search

Why did you select Digital Butlers over others?

• High ratings
• Company values aligned

How many teammates from Digital Butlers were assigned to this project?

2-5 Employees

‍

Describe the scope of work in detail. Please include a summary of key deliverables.

To provide a new website design for our business. The website was to show technical expertise and use of 3D modeling on the landing page. To look very different from all of our competitors and the rest of the industry. To provide a "wow" effect to any visitors landing on the page.

What were the measurable outcomes from the project that demonstrate progress or success?

The project was to be delivered on time and on budget. Great feedback from our team in the design stage and then customers at launch.

Describe their project management. Did they deliver items on time? How did they respond to your needs?

Excellent feedback loop. Videos sent on Friday's with updates as to where they are and what is to be done

What was your primary form of communication with Digital Butlers?

• Virtual Meeting
• Email or Messaging App

What did you find most impressive or unique about this company?

Communication. They've provided different designs, showing their desire to make it as good as possible.

Are there any areas for improvement or something Digital Butlers could have done differently?

No