VONJAN Technology GmbH is a leading supplier of high-quality laser system components. The company offers individual consulting as well as customized product combinations and thereby supports customers in the development of new laser systems and laser applications.
"FEEL LASER" - was just one of many demands for the new website. In addition to a radiant UI, the main focus was on the presentation of products and extensive services for customers and partners.
- Digital rebranding
- User experience concept
- User interface design
- Technical concept & implementation
- Product database & interface
- Digital distribution channel
- Data collection & analytics
- Animation design
The heart of the website is an online product database with an inquiry section whose data is transferred directly via interfaces. VONJAN's target groups have very different needs - some know exactly which products they are looking for and can specify them via technical parameters, others are looking for a solution for a new laser process and need advice on determining the appropriate system components.
Thus, when designing the website, we focused on the information flows of the users so that we could meet the different needs. Products can be found and requested in different ways, e.g. classically via the navigation, via a product search and filtering, or for example via content pages with use cases.
The company's values should be reflected in the UI. A key feature in the interface is the high light-dark contrasts. They are used specifically to highlight complex information in a bundled way. The green-yellow primary color is used for interaction elements and thus guides the user through the interface. The typography underlines its technical core, the equally technical competence. Light reflections in the UI as well as an appealing start page animation visualize the world of laser components in a playful way.
The sophisticated products present us with a challenge - how do we present product data without overwhelming users, even on mobile devices? Together with the customer, we first developed a new product categorization that allows logical filtering. The revised structure helped us to create the product groups, series and models in a meaningful way both in the product information management (PIM) system Akeneo provided by us and to present them visually understandable in the UI via an interface.
The technology behind it
The content management system Neos gives the site both flexibility in terms of content and speed in processing and displaying countless products. We have implemented the administration of the products separately with the product information management (PIM) system Akeneo. The product data is created in Akeneo and then imported into Neos, including all information, media and data sheets, and displayed on the site. Thanks to the scalability of Neos, there are hardly any limits.
To make the products easily accessible to the users, a complex filtering was built with Elasticsearch and PHP, which is played out in the frontend by an extensive Vue.js plugin. Numerous user-centric filter settings help each user to find the appropriate products without losing the overview. Through Vue.js, the displayed products are updated in real time and waiting times due to page loading are avoided. The seamless integration of Vue.js and Neos allows users to create a query list and express interest in many products with one click.
