-
Notifications
You must be signed in to change notification settings - Fork 10
About Synergy
Synergy allows you to create, style and interact with modular and configurable UI components
The primary goal of Synergy is to allow for the creation of sane and abstract user-interfaces that are isolated from all content and substance. These user-interfaces should be easily modifiable and manipulatable with no risk of unexpected or unwanted side-effects. Synergy makes it easy to understand your entire project's UI from a bird's-eye view, giving you the freedom you need whilst constraining everything else.
This makes Synergy the perfect tool for creating front-end styleguides (or Living Styleguides) using a series a Presentational Components forming a reusable component library (ideal for use with Design Systems).
Synergy is just a practical application of certain theories and philosophies. One of the main philosophies includes the way UI elements are viewed. In a world of HTML and CSS, this could equate to something as simple as a "naming convention" (e.g. BEM), but in a world of abstract UI Modules, an idea with more depth is needed.
Put simply, the way Synergy views a UI is a series of Modules
that are composed of Components
, both of which can have Modifiers
.
See the Modules, Components & Modifiers page for more information
The main component of Synergy is the Lucid React library. This handles the creation and rendering of Synergy Modules (using React) and is also used for styling them (using JavaScript). For styling Synergy Modules with Sass, the Cell Sass library is used.