Отдыхаем с пользой: как прокачать дизайнерские навыки с помощью игр 

Игры на цвета 

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

Color Method 

Color Method — игра, в которой можно отточить навыки идентифицирования цветовой палитры. Она разделена на 6 блоков: оттенок, насыщенность, комплементарность, аналогичность, а также выбор по 3 или 4 цветам.

Что нужно делать: вам придется найти похожий цвет внутри основного круга. Время на выполнение одного задания — 10 секунд. После прохождения вы получите оценку по 10-балльной шкале. Подойдет тем, кто хочет быстро подбирать цвета и оттенки. 

Kolor 

Еще одна игра на определение цветов — Kolor. В ней тренируются внимательность и скорость. 

Что нужно делать: попробуйте выбрать тот цвет, который соответствует предложенному на экране. Сначала уровни будут легкие и очевидные. Но с каждым новым испытанием сложность увеличится, а различие в вариантах станет минимальным. 

What the Hex?

Если хотите узнать базу HEX, то пройдите онлайн-игру What the Hex. Она научит вас разбираться в шестнадцатеричном коде цвета. 

Что нужно делать: на экране дано HEX-значение. Вам предстоит угадать, какой цвет скрывается под этим кодом. Игрок может самостоятельно выбрать сложность уровня, а именно — сколько цветов хотите видеть на экране в диапазоне от 2 до 48. 

Поэтому можете начать с простого и понять логику системы. Затем увеличивайте количество вариантов ответа. 

Игры для тренировки навыков типографики 

Подобные игры полезны для распознавания шрифтов и подбора необходимого. Для специалистов крайне важно, чтобы текст был максимально читабельным и понятным. 

I shoot the serif 

I shoot the serif — игра на понимание различий шрифтов с засечками и без. Хорошо подойдет начинающим дизайнерам, которые только осваивают типографику. 

Что нужно делать: нужно стрелять в буквы с засечками, то есть в Serif. За каждый правильный ответ получаете очки, а за неправильные — уменьшение количества времени. Перед началом игры можно выбрать уровень: Junior, Middle или Senior. 

Сложность игры заключается в том, что шрифты постоянно усложняются, а время на поиск ограничено. 

Typewar

Чтобы было проще разбираться в популярных шрифтах, потратьте время на игру Typewar. 

Что нужно делать: определять, какой шрифт указан на экране. Из возможных вариантов — Times New Roman, Helvetica Neue, Verdana, Optima, Futura, Didot и другие. Если не получается отгадать, то можно нажать кнопку «Skip». На первых этапах придется выбирать из двух шрифтов, а затем количество увеличится.

Kerntype

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

Что нужно делать: перемещать буквы таким образом, чтобы расстояние между ними стало гармоничным и соответствовало стандартам типографики. В каждом уровне представлено слово или набор букв с неправильным кернингом, который нужно исправить. В конце покажут правильный вариант и оценят по 100-балльной шкале ваш вариант. 

Игры на композицию

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

Can’t Unsee

Can’t Unsee — игра, в которой участники оценивают свои навыки в области дизайна интерфейсов UI и UX.

Что нужно делать: в каждом раунде игрок видит два варианта одного и того же элемента и должен выбрать лучший с точки зрения дизайна. Главная задача — обращать внимание на композицию, типографику, контраст, иерархию, стилизацию и другое. По мере прохождения варианты становятся сложнее, а отличия менее заметными. 

It’s Centred That

Дизайнерам важно понимать, где находится центр композиции. Практиковаться в этом можно в игре It’s Centred That. 

Что нужно делать: искать центр. Все просто: вам даны геометрические фигуры, и нужно понимать, посередине ли находится точка. Выбирать нужно лишь из двух ответов — «да» и «нет». Однако уровни усложняются, когда количество фигур увеличивается. К тому же точка может находиться близко к центру, но все-таки не в нем.

Игры про векторную графику 

Для графических дизайнеров тоже есть онлайн-игры. Они помогают экспериментировать с различными стилями, техниками и композициями векторной графики без риска ошибиться на реальном проекте.

The Bézier Game

Освоить инструмент «Пера» и принципы работы с кривыми можно в The Bézier Game. 

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

Pixactly

Помимо создания объектов, графическим дизайнерам важно понимать размеры и пропорции. Игра Pixactly как раз тренирует глазомер и технику верстки. 

Что нужно делать: нарисовать объект по заданным размерам. Даны вводные ширины и высоты фигуры, а вам необходимо ее создать. Затем покажут, насколько вы близки к правильному ответу. 

The Boolean Game

Игра The Boolean Game научит использовать булевы операции, которые предназначены для создания и редактирования 2D-фигур в графических редакторах. 

Что нужно делать: повторить фигуру, которая указана на экране. Вам необходимо перемещать геометрические фигуры так, чтобы они соответствовали финальному объекту. 

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

Если ошиблись в операции, то наглядно увидите, что именно сделали не так.

Shape Type

Еще попробуйте векторную игру Shape Type. Ее задача — помочь вам улучшить навыки письма через кривые Безье.

Что нужно делать: вернуть правильную форму букве. Перетаскивайте опорные точки, чтобы придать объекту верный вариант. В каждом уровне написано, какой шрифт от вас хотят получить. В конце можно узнать, на сколько процентов совпал ваш вариант, и сравнить обе буквы. 

Игры про основы HTML и CSS

Flexbox Froggy

Flexbox Froggy — увлекательная онлайн-игра, которая помогает изучить основы CSS Flexbox, используемого для распределения элементов в веб-разметке. 

Что нужно делать: перемещать лягушек, используя CSS код таким образом, чтобы они заняли определенные позиции на игровом поле. Пользователям предоставляется набор CSS правил, которые они могут применять к животным, чтобы достичь желаемого распределения. Если лягушка окажется у кувшинки своего цвета, то код верный. 

Главное об играх для дизайнеров 

1. Игры помогают прокачать навыки выбора цвета, создания шрифтов или глазомера. Используйте их для того, чтобы быстрее замечать ошибки в своих и чужих проектах. 
2. Игры — хорошо, но не стоит забывать об изучении базы. Если вы хотите достичь высокого уровня в профессии, то проходите курсы, смотрите обучающие видео и читайте книги.