Matter Design Digital Agency + Builder.io a natural partnership
Matter. Uses Builder.io to Empower Their Enterprise Clients with Dynamic Scalability, Powerful Flexibility, and Complete Control.
CMS
A headless CMS anyone can use to create custom shopping experiences
Optimization
Built-in high-speed A/B testing to increase iteration and drive repeatable growth
Targeting
Customize experiences based on criteria (e.g items in cart, new vs. return customers, etc)
Start Building
Award-winning e-commerce agency, Matter Design & Digital (Matter.), has been leading their clients into the next generation of e-commerce by introducing them to advanced headless system architectures. Headless frameworks enable e-commerce websites to be powered by multiple microservices, taking a non-linear approach to website configuration.
Builder.io has become one of Matter.’s preferred microservices, powering experience and content management for enterprise clients, like Videopro, with the vision to extend to further e-commerce builds.
“Builder is extremely flexible and enables us to build out an admin to suit the requirements of our projects (and clients). We use it for a range of capabilities like global content and settings, page content that populates pre-defined templates we manage within the code, and an incredibly powerful visual no-code page builder that gives the client infinite control over the marketing pages they want to create,”
explains Matter.’s Lead Developer Ash Durham
With Builder, Atoms is moving faster and iterating more. Site updates that used to take days if not weeks of custom development, now take minutes and are as simple as drag and drop.
“Almost immediately, Builder solved more than half the battle for us.”
Dawa Sherpa, Head of Engineering at Atoms
How Builder works with Matter. to enable scalability for Videopro
Jamming with Matter.’s proprietary front-end accelerator
Jamming with Matter.’s proprietary front-end accelerator Builder is connected via an API that runs through Matter.’s JAMM.™ framework and displays on the user’s browser. JAMM.™ is Matter.’s own proprietary take on the JAM front-end accelerator (JAM stands for JavaScript, APIs, and Markup). It represents a system architecture based on client-side JavaScript, reusable APIs, and prebuilt Markup. JAMM.™ enables their team to build the connections they require into the microservices that make up each individual tech stack — for example, connections between Builder.io and BigCommerce.
Matter. proposes the headless architecture solution to businesses who are looking for scalability and flexibility. A headless framework allows best-of-breed applications to be used in a microservices architecture, rather than just a selection of products that happen to be from the same vendor but may not be a fit for the project requirements.
Giving Videopro complete control over their site
Videopro was looking for complete control over the editability of the homepage, landing pages, and product widgets. The ability to create custom draggable widgets in the Builder UI gives the client some powerful control over their pages and what they can include on the pages they create.
"Builder has made their drag-and-drop interface really developer and end business user-friendly. We’re able to directly hook Builder into the live site to power experiences and functionality. This means what you see in the Builder admin is exactly what you'll get once the work is published and displayed on the site"
Ash explains.
Matter.’s best-in-class widgets, easily accessible to all their clients
Traditionally, CMS platforms are self-aware and only include content on a page that the CMS has. Builder works in harmony with Matter.’s JAMM.™ framework and allows them to share any piece of content they need from Builder via custom widgets. For example, Matter. can create a featured products widget that a client can drag onto any page which references live data from their e-commerce platform. Because this data is dynamically populated via the e-commerce platform, when a client updates their featured products, the page that includes this widget is automatically updated with the new products.
Full flexibility: the new norm
Other examples of CMS flexibility using Builder are:
featured or latest blog posts
defining SKUs for a list of products and dynamically displaying each SKU’s product information
selecting a category and displaying the list of data attached to that category from another platform
Provided the data is available to the JAMM.™ framework, Matter. can make it available in Builder.io to be used by the client as they see fit.
Matter. aims to continue to promote the advantages of headless architecture and the benefits Builder can offer to their e-commerce clients. As Ash explains, “Builder is a real one-stop shop for site content and experience management that is infinitely configurable to any requirement.”
If you have any questions about the headless system architecture or Builder configuration for your store, contact the team at Matter Design & Digital here.
If you’re an agency partner and would like to learn more about leveraging Builder as part of your client solutions, reach out to the Builder team here.
“For a small digital-first company, we’ve unblocked a really critical resource - our engineers.”
“For a small digital-first company, we’ve unblocked a really critical resource—our engineers.”
Atoms is a direct-to-consumer online footwear retailer, that is behind one of the most comfortable shoes on the market. The brand is committed to ultimate comfort and exceptional customer experience.