Всем привет,
Делаем проект tokendobra.ru.
На нём есть несколько основных страниц:
- Главная
- Страница организации
- Страница с картиной
- Страница с оформлением заказа
- Страница (FAQ, Правила, Конфиденциальность).
- Страница с подтверждением заказа

Постановка проблемы:
На данный момент существует две проблемы
1 - Почти каждая страница имеет свои стили и очень много дублирования. Что усложняет верстку. При изменении стиля одинаковых компонент на разных страницах требует изменения стилей одновременно в нескольких местах + стили могут иметь мелкие отличия, не заметные на глаз.
2- Каждый компонент имеет свой стиль.

Что нужно сделать:
Разработать новую систему дизайна не на базе элементов, а на базе слоев (layouts) и стандартных блоков, (в том числе popup) и элементов, с предсказуемым поведением на разных мобильных устройствах. С общей системой шрифтов, отступов, размеров, выравнивания. Так чтобы можно было легко создавать страницу, добавлять блок, и только в крайних и редких случая, специфицировать стили отдельных внутренних элементов. И каждый новый элемент легко встраивается в другую страницу.

Порядок действий:
1 - Классифицировать существующие элементы на сайте
2 - Разделить их на уровень абстракции
3 - Создать одну страницу html + saas. которая содержит все элементы сайта, построенные на новой системе верстки
4 - Отладить их работу под различное media

Результат:
Документ с описание системы дизайна и верстки.
html + sass со всеми элементами сайте