Сегодня в номере: как добавить контраст на сайт и простой трюк для создания цветовой палитры в Sketch, как спасти свою личную жизнь, работая по 24 часа в сутки, и приложения для повышения концентрации.
Создаем контраст с работой – отдыхаем и пьем ароматный кофе…
5 приемов для добавления контраста на сайт
5 Ways to Boost Contrast in Your Web Design
Контраст обеспечивает дифференциацию между элементами, делает дизайн более индивидуальным, заметным и особенным.
Контраст в дизайне создается несколькими способами, используя разные типы элементов. Сегодня мы рассмотрим пять самых распространенных.
Увеличьте или уменьшите
Слишком много элементов одинакового размера будут сливаться в одно. Простое решение – сделать один из элементов больше остальных, например, призыв к действию или главное обращение. Пользователь заметит его сразу же, зайдя на страницу.
Добавьте текстуры
Учитывая господство минимализма и материального дизайна, текстуры сегодня встречаются крайне редко. Но добавив их на отдельный блок на сайте в качестве фона, вы создадите необходимый контраст, которого не хватало. Поэкспериментируйте и с самими текстурами: попробуйте совместить гладкие и грубые.
Измените форму
Изменение формы или ориентации элемента поможет достичь желаемого эффекта. Например, на картинке выше больше всего в глаза бросается круг, потому что все остальные предметы – прямоугольной или квадратной формы, и он на их фоне отличается.
Поиграйте с составляющими на странице. Отойдите от квадратов – сделайте фотографии или главные элементы круглыми. Это может быть сложно, но результат будет очень интересным.
Добавьте или уберите цвет
Изменяя оттенки, добавляя или убирая цвета, вы можете изменить общее настроение дизайна. Цвет может сделать вещи большими или маленькими, смелыми или подавленными. Используйте следующие приемы:
- Смешайте теплые, холодные и нейтральные цвета;
- Измените основной цвет путем добавления оттенков и тонов;
- Переплетите темные и светлые тона;
- Добавьте монохромные объекты.
Сделайте что-то необычное
Неожиданная форма или деталь может добавить контраста на сайт. Но учтите, что неожиданность в дизайне должна не только контрастировать, но и гармонировать с остальными элементами.
Смешивайте сложные и простые стили типографики, включите анимацию, измените ориентацию текста – одним словом, креативьте!
Контраст позволяет сфокусировать внимание пользователя на главных вещах, основном сообщении или призыве к действию. Простые приемы, описанные выше, помогут найти правильное решение для вашего сайта.
Простой трюк для создания цветовой палитры
A Simple Trick For Creating Color Palettes Quickly
А сейчас мы покажем вам простой трюк, как создать цветовую палитру в Sketch.
Создайте три квадрата. Один квадрат высотой 240pt и 240pt в ширину.
Теперь переименуйте эти слои на Красный, Зеленый и Синий. Давайте изменим заливку Красного слоя на # FF6161, Зеленого — на # 4F953B и Синего — на # 0076FF. Выделите эти слои и нажмите клавишу «A», чтобы выбрать инструмент для холста. Теперь выберите опцию Around Selection. Переименуйте холст в «Цветовая палитра».
Теперь добавим оттенки, разделив наши квадраты на три равные части каждый. Создайте два прямоугольника на верхней части квадратов, которые имеют ту же ширину, что и холст. Высота должна быть в нашем случае 80pt.
Совместите один прямоугольник в верхней части холста и залейте белым цветом. Совместите второй к нижней части холста и залейте черным цветом. Теперь измените непрозрачность до 20% — таким образом, мы будем иметь три различные оттенка красного, зеленого и синего. Давайте переименуем эти два слоя, чтобы найти их потом.
Мы собираемся разделить эти квадраты снова — на этот раз по горизонтали. Создайте прямоугольник, который имеет ту же высоту, что и квадрат. Его ширина – тоже 80pt. Выровняйте по горизонтали прямоугольник в центре Красного квадрата. Теперь давайте дублировать этот прямоугольник и выравнивать его справа от Красного.
Теперь самое интересное. Измените заливку этих двух слоев к чему-то энергичному. Мы будем использовать желтый (# FFE200). Измените непрозрачность среднего прямоугольника до 40%, а правого — до 80%. И, наконец, измените режим смешивания этих двух прямоугольников для наложения.
Теперь мы разделили прямоугольник на девять равных частей. Теперь просто дублируйте эти два прямоугольника и переместите их в зеленый и синий квадрат, чтобы закончить цветовую палитру.
Финальный результат:
Sketch – одна из самых популярных программ для создания дизайна интерфейса. Простой трюк создания собственной палитры позволит вам всегда держать под рукой нужные цвета.
Как спасти свою личную жизнь, работая по 24 часа в сутки
5 Methods To Make Sure 24-Hour Work Access Doesn't Ruin Your Personal Life
Фрилансеры работают практически 24 часа в сутки. Это и благословение – для амбициозных работников, и проклятие – для тех, кто хочет вести хоть какую-то личную жизнь. Ведь на нее времени совершенно не остается!
Ниже – полезные советы, как уберечь вашу личную жизнь от круглосуточной работы.
Возьмите под контроль электронную почту
Выключайте электронную почту, если вы не работаете. И найдите в себе силы не проверять ее каждые пять минут с мобильного телефона – а еще лучше, удалите ее оттуда. Иначе соблазн посмотреть, не пришло ли новое задание, будет просто непреодолимым
Включите автоответчик
Если вы беспокоитесь, что пока ваша почта выключена, вы пропустите что-то важное, настройте автоответчик. Пусть людям приходит сообщение о том, в какие часы вы будете в сети, и по какому телефону звонить, если дело сверхсрочное.
Следуйте установленному распорядку
Установите для себя четкие принципы: работать ли в выходные дни и по вечерам. Если да, то в какое время и в каких ситуациях. Следуйте им беспрекословно.
Планируйте выходные
Когда мы свободны, возникает соблазн сесть поработать над очередным проектом. Планируйте свои выходные так, чтобы для работы не оставалось времени.
Используйте возможности круглосуточного доступа в Интернет
Прислушайтесь к себе: в какие часы ваша работоспособность мала? Посвятите их домашним делам. А когда ваши силы находятся на пике – вы легко выйдете в сеть и продуктивно поработаете.
Эти простые советы, которым, возможно, вы уже следуете, помогут вам находить время для семьи и личной жизни, не в ущерб фрилансу.
Приложения для повышения концентрации
11 Apps to Help You Find Your Focus
Иногда концентрация уходит прочь, и просто невозможно сосредоточиться в работе над новым проектом.
Сотни вещей отвлекают наше внимание: СМС на телефоне, соцсети, электронная почта и многое другое.
Предлагаем вам список приложений, которые помогут вернуть концентрацию и продуктивно поработать (а иногда даже спокойно поспать!)
Аудиоприложения
Noisli 2.0: Воспроизводит звуки природы и окружающий шум. Можно настроить на две цели: сон или концентрацию.
Brain.fm: Приложение использует искусственный интеллект, который сам подбирает музыку. Есть режим концентрации, сна и отдыха.
Headspace 2.0: Инструмент для медитации. Поможет преодолеть стресс, беспокойство, вернуть внимательность.
Приложения, которые блокируют помехи
Panda Focus Mode: Введите ваши самые важные ежедневные задачи, и увидите их всякий раз, когда открываете новую вкладку.
Hocus Focus: Это приложение будет автоматически скрывать окна, которые были неактивны в течение определенного периода времени, оставляя только те, которые вы используете.
Freedom: Инструмент блокирует помехи на всех ваших устройствах. Если весь Интернет отвлекает вас, неважно, с компьютера или со смартфона, вы можете блокировать всю эту чертову штуку, если захотите.
Forest: Приложение использует геймификацию, чтобы помочь вам сфокусироваться на том, что важно в жизни.
Выбирайте, что вам по душе, включайте, и пусть ничто не отвлекает вас от работы…
… даже наша подборка свежих статей. До скорых встреч!
0 комментариев