Замечали такое, что дизайн выглядит классно, но с ним все равно что-то не так?
Частая тут проблема, что в макете учли всё, кроме колористики..
Рассказал в карточках про цветовой круг – простую шпаргалку, которая помогает понять, какие цвета сочетаются между собой, и как собрать из них палитру.
Если только начинаете в дизайне, не пытайтесь добавить в макет пять разных цветов. Начните с двух. Так гораздо проще собрать цельный дизайн и не уйти в пестроту.
Как работать с референсами, чтобы не просто красть идеи
Я никогда не работаю с одним референсом.
Потому что если открыть один красивый сайт и пытаться сделать что-то похожее, незаметно повторить его полностью - изи.
Поэтому обычно я собираю референсы под разные задачи.
1. Вектор
Выбираю 3–5 работ, которые задают настроение и характер будущего дизайна.
Они лежат перед глазами почти всё время, пока я работаю. Но не копирую из них конкретные решения. Просто периодически сверяюсь, точно ли я иду в нужном направлении.
2. Композиция
Отдельно ищу примеры хорошей композиции.
Тут уже не так важен стиль. Смотрю на сетку, баланс, расположение элементов, воздух.
3. Приёмы
И ещё отдельно собираю интересные графические приёмы, которые хочу попробовать.
В итоге один референс не диктует мне, как должен выглядеть весь макет. Я беру идеи из разных источников и собираю из них своё.
Но есть важный момент: «мне нравится» – вообще не причина брать приём в работу.
Поэтому задаю себе три вопроса:
• Какую задачу решает этот приём?
• Есть ли такая же задача у меня?
• Поможет ли он получить нужный результат?
И ещё один способ работы с референсами – тупо их повторять. Именно для учёбы, а не для проекта.
Не понимаете, как сделана работа, положите её в Figma и повторите точно: шрифты, сетка, эффекты. Так копится своя библиотека решений.
Для меня это и есть «красть как художник»: не переносить чужое в макет, а разбирать, понимать, почему работает, и собирать из этого своё!
Чем я пользуюсь, когда закончились идеи для дизайна
Закинул свой личный пак с 8 ресурсами для поиска быстрых решений
Тут всё: для UX, анимации, 3D, мокапов и просто сильных референсов. Так что моя рекомендация – сохранить)
• Spline – 3D прямо в браузере: сцены, объекты, интерактив для лендингов
• Mobbin – тысячи скринов реальных приложений, когда нужен UX-референс
• Refero – UI/UX-паттерны и конкретные решения для интерфейсов
• Jitter – быстрый моушн для UI, постов и презентаций
• shots.so – мокапы, чтобы презентовать свою работу
• godly.design – свежие референсы сайтов и типографики
• designspells – небольшие визуальные и motion-приёмы для прокачки макетов
• Land-book – база лендингов по индустриям и стилям