ML Novator

ML Novator is an online shop that provides high-end computer hardware with a unique ability for customers to configure the products themselves.

Migration from Magento 1.x to Magento 2.x with 1-Second Page Load

ML Novator develops, manufactures and integrates IT hardware fororganisations. Their e-store provides high-end computer hardware allowing customers to fully customise product configurations themselves.

Our client wanted a complete re-design of the site, in addition to moving from Magento 1 to Magento 2. We re-wrote all M1 features to M2, performed a full database migration, extended the M2 API extensively and developed online payment solutions for the Estonian market from scratch.

Magento 2.x frontend as a single-page application

Our client was after speed and performance and that’s what we focused on. We achieved a lightning fast 1 to 2-second page load by implementing the Magento 2.x front-end as a SPA (single page application). It’s a true state-of-the-art solution and it’s one of the most exciting projects we’ve built in a while! As a surprise bonus, it’s possible to browse the site offline.

A SPA (single-page application) means that when you first land on the page all necessary resources and code is loaded in one go. The frontend is more like a regular HTML page and data is synced between the front- and backend using multiple databases, API’s and so on. This keeps the back- and front-end completely separate, so product catalogue size, order volumes and any admin work won’t slow down the page.

Automation & Intelligence

At first glance, ML Novator looks like any standard e-commerce site with configurable products. But the project is packed with complex product management solutions and custom functionality in the back and front-end.

Automated product creation and component imports

All products are bundled, consisting of smaller components like cables, screws etc. Automated imports for components are set up daily. All data is synced from completely separate 3rd party warehouse systems. On import, additional product information is attached (images, descriptions, support info etc). Components are grouped by type (processor, memory etc) and divided into categories (hardware, software etc). Finally, all components are associated with bundle products and displayed as configurable options in the front-end.

Custom Functionality Layers

To further automate the system, we created a new layer of ‘include and exclude rules’. This enables associating multiple components to one another while keeping these invisible in the front-end. For example, a person will never see details of wiring for specific hard drives and associated parts are added/removed automatically. In the backend, all separate details are still visible to the merchant to fulfil orders.

Automatic Component Cross-Compatibility

All components are automatically cross-compatible which is achieved by defining special rules in admin. This enables you to always combine the right types of products with compatible components. The merchant will get a neat list of ALL components associated with an order and will just need to assemble everything on arrival to their warehouse.

Advanced Automated Shipping Options

The exact component arrival times and assembly times for end-products are calculated automatically. The checkout process is customised with a delivery date picker and you’ll only be shown available dates from the time the order is fully assembled. Even if you order multiple different products. After orders are placed deliveries are booked with the shipping provider automatically.

Key development points:

  • Development on Magento 2.x CE.
  • Database migration from M1 to M2
  • Frontend as a single-page application
  • Automated product creation
  • Custom ‘include & exclude’ rules
  • Automatic component cross-compatibility
  • Advanced automated shipping options

Technologies used:

  • PHP5, JavaScript, CSS3
  • Magento CE
  • WordPress
  • Axapta
  • Advanced Configuration Module
  • Other custom modules
  • 3rd party integrations
  • Git
  • Capistrano