So Carpe Diem developed the concept a component-based design, to allow each character to have their own individual builder, put together with existing base components.
With this approach we not only added the new functionality, more simply, but added value by providing a sustainable model without impacting on the existing codebase for other characters.
Due to the component format and the addition of a theming system, Toxic Fox can quickly iterate new character builders as and when required.
As the existing system was built using React, we decided to use the same language and utilised Next.js as a framework to remove most of the boilerplate code from the existing builder, and to create each builder as a page, that can then be deployed statically to be served into the site via Amazon S3.
As part of the project, the eCommerce site was also moving from Magento to a Shopify instance. This meant applying their brand to their template and, crucially, integrating the new builder into the Shopify system.
As the builders are now individual static pages, these can be served into the product pages with an iFrame, allowing users’ choices to be saved against the products in their basket.