Наш канал в

Представьте, что у вас есть проект, и вам нужно создать для него цветовую палитру. Возможно, вы захотите протестировать несколько палитр, и сделать это быстро.

Я создал файл Sketch, поэтому, как только вы поместите свои цвета палитр в символы, вы можете быстро увидеть много разных макетов для них. Вы можете скачать пример здесь.

Как это работает?

  • Создайте moodboard (например, Pinterest)
  • Выберите одно или несколько фото вmoodboard
  • Загрузите каждую фотографию в Adobe Color CC, (или аналогичную) и получите пять цветовых палитр.
  • Откройте Sketch-файл, перейдите к символам и измените их цвета: вы должны сделать это для цветовых и текстовых символов: «Color 1», «Color 2», «Color 3», «Color 4» and «Color 5» для каждой из ваших палитр. То же самое для символов основного текста и вторичного текста.
  • Перейдите на страницу 1 и узрите магию

Пример с портретом «Мона Лиза»

«Мона Лиза; итальянское: Monna Lisa или La Gioconda – портрет кисти Леонардо да Винчи периода итальянской эпохи Возрождения, который был описан, как «самая известная, самая посещаемая, самая популярная, самая пародируемая работа в мире искусства». Это также одна из самых ценных картин в мире». 

 Цветовая палитра для картины «Мона Лиза» такова:

Пример с портретом «Мона Лиза»

Итак, у меня в файле Sketch есть следующие символы:

Экономия времени при выборе цветов в Sketch - 1

Когда у меня есть цвета, я вижу разные макеты. Я сделал несколько, но можно было сделать больше:

Экономия времени при выборе цветов в Sketch - 2

Это может сэкономить ваше время при выборе цветов, а также может стать началом дизайн-системы. Вы также можете проделать это со стилями.

Скачать пример можно здесь.

Подпишитесь на рассылку

Раз в неделю мы будем присылать на почту дайджест с лучшими материалами

Похожие записи

Полное руководство по дизайну iOS 9 в Sketch

iOS сильно выросла в течение последних лет. С ее iOS 9 апгрейдом, Apple представил новый системный шрифт под названием San Francisco, 3D Touch и многозадачность на iPad. В Xcode вы найдете Stack Views, фантастический инструмент для более адаптивных макетов, гораздо проще Auto Layout.

Самое подробное руководство по дизайну в Sketch

Работая со Sketch последние три года, я освоил ряд ключевых техник, которые значительно улучшили мой рабочий процесс. Так как я, помимо рисования, также обожаю прототипировать и кодить, мне нужен инструмент для быстрого выполнения дизайн-проектов и легкой генерации исходников. Sketch вместе с его плагинами и другие инструменты для прототипирования полностью справляются с этой задачей. Часть 1 Часть 3 Часть 4

Серия уроков Sketch (часть1 из 5): Настройка Sketch

Первое что нам следует изучить, это настройка Sketch. Если вы только начали создавать дизайны для веб и являетесь новичком в Sketch или Photoshop, или вы просто разработчик, желающий включить UI-дизайн в свой репертуар, эти простые уроки по настройке идеально подойдут для быстрого ознакомления с работой Sketch. Часть 2 Часть 3 Часть 4 Часть 5