Виявлені елементарні дизайн-частинки
Чесно кажучи, мені вже незручно в черговий раз говорити про Атомарному дизайні. Про концепції дизайн-систем сказано практично все і, здавалося б, додати вже нічого. Але постійте! Адже атоми в реальному світі з чого складаються: протони, нейтрони, електрони… чи Можна співставити зі структурою атома дизайн-функціонал, з яким ми працюємо? Я впевнений, що відповідь позитивний і ось чому…
Глобальні стилі
Пришестя в дизайн-інструменти глобальних стилів як приєднуваної сутності до будь-якого об’єкта на артборде, наштовхнула мене на метафору. Склад атома еквівалентний тим діям, які ми застосовуємо до дизайн-об’єкту: підбираємо колір, додаємо обведення, іноді ще й тінь, а потім зрізаємо кути, якщо це прямокутник.
Якщо розглянути, наприклад, кнопку як молекулу, що складається з двох атомів: фону і написи, то на фон можна впливати наступним чином:
- Додати колір (Fill). Будь фон можна зафарбувати або заповнити текстурою.
- Додати обводки (Stroke). Потім регулювати товщину, зробити пунктирною, змінити колір.
- Скруглить кути (Corner radius). Кнопки з максимально округленими кутами, здається, знову стануть популярними в осяжному майбутньому.
- Додати тінь (Shadow). В основному зовнішню, але іноді і внутрішню. Сучасні інструменти дозволяють нашаровувати кілька тіней.
Я не включив сюди поворот об’єкта і зміна розмірів, т. к. це більше про зміни в просторі
Елементарні частинки дизайн-атома
Подивіться на схему складу атома, перш ніж я продовжу:
Image copyrightsStructure of a beryllium atom: four protons, four neutrons and four electrons.
Credit: general-fmv © Shutterstock
Тепер найцікавіше. Хто-небудь вже здогадався, які властивості дизайн-об’єктів можна зіставити з частинками атома?
Нейтрони — це заливка. На візуалізації структури атома нейтрони в самому центрі. Метафора підходить бездоганно.
Протони — заокруглення кутів. Їх розташовані по кутах атома відразу асоціюється з цією властивістю в дизайні.
Нуклони дуже хочеться порівняти з обведенням. На жаль, нуклон не є часткою, а лише є назвою об’єднуючим протони і нейтрони, але це і неважливо! Отже нуколы — це тінь. Бо як обведення збирає воєдино те, що знаходиться всередині неї. Це повністю збігається з картинкою вище.
Електрон — це тінь. Вікіпедія показує мені цю картинку, що нагадує тінь. Ідеальний збіг за всіма параметрами.
Тому до дизайн-систем
Це лише доповнення до загальної теорії Атомарного дизайну при проектуванні дизайн систем. Концепція глобальних стилів однозначно викликає звикання до Figma (здається Sketch нещодавно пішов аналогічним шляхом). І завдяки такій подачі, ми — дизайнери і розробники отримали ще більше гнучкості для кастомізації якщо ефективно плануємо архітектуру майбутньої системи:
P. S.: Дизайн вимагає практики, а не теорії. Але іноді варто відволіктися від практики ненадовго, щоб структурувати накопичений досвід у нові теорії.
