Recently I've been busy with creating a MVC / BEM based elemental wireframe, design & development system. The system can be used 'standalone' and in companion with Wordpress. It's an advanced system (even for non-coders) to create a true modular system and components and turn them easily in working child-themes.
Overview

Modular Pattern System

By Pat Bloom on Nov 30, 2019

The MPS (Modular Pattern System) is a design and development methodology / system based on 6 so called ‘patterns’. Patterns can be seen as modular parts (on design and code level) that are assembled to bigger pieces of functional components which still can be updated without the need to rework them in other parts all the time.

As stated before, MPS (as I will call the Modular Pattern System from now) is a based on 6 patterns - from an (HTML) elementary level up to a complete publication, which is - in terms of online projects - the GUI the page the user will see and interact with.

The nice thing about the MPS patterns is that they are applicable on both the Design and Development (professions) processes and are related. Off course they have a different purpose and the phases in which they are grouped in are named different - but the intention of the patterns remain the same (starting from a elemental (e.g. a assets, design of button or code of header text) level up to a publication e.g. like a design mock-up or rendered page template (speaking in development terms).

Theoretically, the design and development patterns could be synced with each-other - but practically it’s impossible - it’s more wise to first finish the design phase before starting with the development phase. But it’s possible to let both professions have an overlap and start the development after the first design principles and partials are created - this creates a more fast and kinda revolutionary way of developing an online project!

Key is to make sure that the different phases are reviewed by the client in time so the planning can be tight - this needs a good, creative and pro-constructive approach from the project manager - a method like Scrum is very much needed to make this happen in an efficient way.

Now we know a little about the the power of the patterns - let see what they're about.

The patterns are named logically (with names that are familiar to designers and developers) - and even those new with ‘Design Systems’ will be able to learn them as they are in way pretty self explaining.

Check the Modular Pattern System website