MA Style Guide

Consistent styles to provide a limited set of templates for building pages. Includes a CSS framework and some HTML styles.

Patterns

Atoms (UI visual_guide) -> Groups (Groups of visual_guide) -> templates (template blocks) -> Pages (groups of template blocks). Interfaces should be built using consistent templates.

Makers Academy logo

Atoms

Atoms are individual UI visual_guide. They can be combined together to make Groups.

Makers Academy logo

Groups

Groups are collections of Atoms. They can be dropped into templates to create Templates.

Makers Academy logo

Templates

Templates are collections of Groups. They can be used as templates, and define the high-level structure of Pages.

Templates

Groups

Atoms

Other

Other things pertinent to the website redesign.