Мы делаем очень сложные системы, но далеко не всегда можем даже представить насколько сложными они являются на самом деле, из-за этого не прорабатываем свои интерфейсы достаточно хорошо.
Есть разные экраны: мобильные, планшеты, ноутбуки, десктопы
Разные приложения требуют разной плотности информации и интерфейсов
Плюс есть люди с нарушениями зрения, им требуется более крупный интерфейс.
А значит нам нужна регулировка размерности компонентов, изменение размеров шрифтов и отступов, чтобы настроить как размер шрифта для более крупного текста, так и увеличить плотность интерфейса, чтобы уместить больше элементов на экране.
Есть разные цвета: есть просто компоненты и группы, они могут быть разных вариантов, primary, secondary, tertiary. Эти компоненты могут располагаться на разных поверхностях: default, primary, secondary, а значит нельзя оставлять цвета компонентов как есть, в нужно красить специально под цвет фона. Помимо этого есть дневная и ночная тема, компоненты тоже должны быть перекрашены, а если есть изменённый фон и компоненты на нем, то их также нужно перекрасить в ночной теме, чтобы яркий белый цвет не бил по глазам.
Каждый вариант содержит 16 цветов, у нас есть 3 варианта компонентов, три цвета фонов и два оформления, ночное и дневное, получается 18 разных вариантов и 288 цветов всего. А люди с нарушениям зрения будут лучше себя чувствовать если создать для них отдельное оформление, а ещё лучше по одному на каждый тип нарушения цветового зрения.
Нам нужно создать систему компонентов, где каждый компонент может быть отрисован в разных размерах отступов и шрифтов, а также в разных цветах, чтобы увеличить визуальный вес, его можно расположить на поверхностях разных цветов, чтобы создать акцент на группе компонентов сразу, а также переключить в темную или светлую тему… ах, да цвета всех компонентов в системе не предустановленны заранее и могут быть изменены, хоть по желанию пользователя.
Если коротко о том, как будет работать Woly UI.
Есть идеи как реализовать такую систему?