Онлайн-игры идеально подходят для освоения новых инструментов, отработки незнакомых техник и развития основных UI/UX-навыков, а также помогают дизайнерам идти в ногу со стремительно развивающейся индустрией.
Успешные дизайнеры постоянно повышают квалификацию и учатся чему-то новому. Однако найти дополнительное время для обучения в течение рабочей недели не так-то просто. Онлайн-игры — увлекательный и познавательный способ отточить имеющиеся навыки и приобрести новые. Благодаря интерактивным захватывающим (и часто бесплатным) онлайн-играм вы можете прокачать такие технические аспекты дизайна, как выравнивание, типографика и теория цвета.
Онлайн-игры не только обучают нас новым дизайн-приемам, но и поднимают настроение, повышают творческий потенциал и помогают более эффективно использовать основные принципы дизайна. Всякий раз, когда у меня есть свободное время или я сталкиваюсь с серьезной проблемой в работе, я играю в одну из этих игр, что позволяет взглянуть на ситуацию свежим взглядом.
Тренируйте глазомер
Выравнивание — это фундаментальный принцип дизайна, который определяет визуальную композицию, обеспечивает юзабилити и читабельность.
Игра It's Centred That отлично подходит для тренировки глазомера и помогает быстро выявлять ошибки в расположении элементов. Ваша задача — определить, находится ли точка в центре фигуры. Это простая концепция, но игра довольно сложная, потому что точки зачастую располагаются совсем близко к центру.
Игра развивает композиционное мышление, заставляя вас анализировать геометрические фигуры и находить опорные точки в пересекающихся и смежных формах.
Узнайте больше о шрифтовом дизайне
Понимание нюансов применения шрифтов помогает дизайнерам установить визуальную иерархию, обеспечить разборчивость текста и лучше передать его смысл.
Игра "I shot the serif" (игра слов: дословно переводится “я застрелил шрифт с засечками”, имеется в виду выражение “I shot the Sheriff” — я застрелил шерифа) проверяет, насколько быстро вы сможете распознать шрифты с засечками. В самом начале вы видите две буквы, одна из которых — с засечками. Вы должны “выстрелить” в последнюю, кликнув по ней до того, как закончится время. По мере продвижения вперед вы будете одновременно видеть все больше и больше букв, из-за чего находить буквы в нужном стиле и “стрелять” по ним становится сложнее.
Эта игра будет держать вас в напряжении! Я играю в нее каждую неделю и всегда удивляюсь, насколько сложной она становится после нескольких раундов.
Typewar — еще один шрифтовой тренажер, который бросает вызов вашей способности идентифицировать шрифты. В каждом раунде на экране появляется буква, а вы должны выбрать правильное название шрифта из двух представленных вариантов.
Отвечая на вопросы, вы получаете или теряете очки, а их количество зависит от того, сколько игроков правильно ответили на тот же вопрос. Мгновенная обратная связь, статистика в режиме реального времени и знакомство с малоизвестными шрифтами — отличная мотивация, чтобы продолжать обучение.
Научитесь определять правильный кернинг на глаз
Один из способов улучшить читаемость цифрового текста — настроить правильный кернинг, или расстояние между символами. Кернинг часто остается вне поля зрения дизайнеров, поскольку он предопределен в каждом шрифте. Однако полезно знать, как корректировать кернинг, если взаимное расположение символов кажется вам неправильным, либо если вам нужно создать уникальный логотип или шрифт для клиента.
Игра Kern Type поможет вам отточить навыки работы с кернингом: вы проверите, насколько хорошо у вас получается правильно расставлять буквы в словах. За каждое слово игрок получает определенное количество баллов, максимум — 100. Вы можете переключаться между тремя режимами просмотра: ваше решение, оптимальный кернинг и их комбинация для сравнения.
Я постоянно возвращаюсь к этой игре, ведь набрать 100 баллов действительно трудно. Она напоминает мне, что нам всегда есть, куда расти.
Перейдите на новый уровень в работе с цветом
Прокачав свои навыки работы с цветом, вы сможете принимать более грамотные и осмысленные дизайн-решения в своих проектах. Color — это игра, в которой вам предстоит идентифицировать оттенки и уровень насыщенности, а также комплементарные, аналогичные, триадные и тетрадные цветовые комбинации.
На экране мы видим интерактивный цветовой круг, в центре которого расположен тот или иной цвет / цвета. Вы должны определить, что это за цвет, уложившись в 10 секунд. Задача усложняется, когда вам нужно подбирать оттенки для триадных и тетрадных цветовых схем.
Совершенствуйте технику работы с векторными объектами
Такие инструменты, как Figma, Sketch и Adobe Illustrator, позволяют дизайнерам создавать векторную цифровую графику, которая масштабируется без потери качества — в отличие от пиксельных изображений, теряющих разрешение при увеличении. Однако рисование и работа с векторными фигурами и кривыми может быть непростой задачей.
Игра Boolean Game познакомит вас с булевыми операциями, предназначенными для быстрого создания и изменения 2D-фигур в векторных графических редакторах. На экране появляется фигура, которую нужно повторить. Через несколько секунд форма превращается в контур. В левой части экрана располагаются несколько фигур, которые можно перетащить внутрь контура, чтобы воспроизвести заданную форму.
В нижней части экрана представлены четыре булевы операции: объединение, вычитание, пересечение и разность. Когда игрок нажимает кнопку "Продолжить", запускается пошаговая анимация, показывающая, как выбранная булева операция меняет фигуры. Если она выбрана неверно, анимация поможет вам наглядно увидеть свои ошибки.
Shape Type — еще одна “векторная” игра, которой стоит дать шанс. Задача игрока — придать буквам правильную форму, перетаскивая различные опорные точки. При этом вы можете получить максимум 100 баллов.
Как и в Kern Type, вы можете переключаться между тремя режимами просмотра, чтобы сравнить свой результат с оригинальной формой. Shape Type не только позволяет совершенствовать навыки рисования векторных фигур, это отличный способ детально рассмотреть анатомические особенности различных шрифтов.
Последняя игра, которая позволит вам усовершенствовать свои навыки работы с векторными объектами, — The Bézier Game. С ее помощью вы сможете освоить инструмент “Перо”, чтобы создавать более профессиональную графику.
Вводные уроки демонстрируют, как использовать элементы управления, такие как alt и shift, для позиционирования опорных точек и манипуляций с их “усиками”. Игра научит вас рисовать простые геометрические фигуры, а также более сложные формы, такие как сердце и автомобиль, используя минимальное количество опорных точек, или узлов. Чтобы вам было интереснее, количество доступных узлов для каждого уровня ограничено, а на экране постоянно ведется их обратный отсчет.
Я люблю эту игру, потому что она наглядно показывает, как продуманное положение опорных точек и правильные углы наклона их ручек помогают создавать более плавные линии и кривые.
Освойте основы написания кода
О чем бы ни шла речь — о карьерном росте или о продуктивном взаимодействии с разработчиками — понимание основ HTML и CSS делает дизайнера важнейшим активом многопрофильной команды. Более того, знания в области фронтенда помогают дизайнерам на заигрываться и создавать решения, которые можно реализовать на практике.
Игра Flexbox Froggy шаг за шагом обучает вас основам написания кода. Вы познакомитесь с CSS flexbox, моделью разметки CSS3, которая упрощает позиционирование UI-компонентов, позволяя настраивать выравнивание, расстояния между элементами и переносы элементов на веб-страницах с помощью всего одной-двух строчек кода.
В игре вы пишете CSS-код и таким образом помогаете озорному лягушонку и его приятелям перемещаться по экрану. Над редактором кода располагается мини-руководство, содержащее различные команды, которые вы можете использовать. По мере того как вы пишете код в левой части экрана, соответствующие изменения происходят в правой. Лягушка достигла кувшинки? Значит, вы все сделали правильно.
Получите новые знания о UI/UX
Онлайн-игры помогают дизайнерам расширять свои знания в области UI/UX и проектировать эффективный опыт взаимодействия, который повышает конверсию и ROI (окупаемость инвестиций).
Игра Can't Unsee позволяет проверить, насколько хорошо вы знаете основные дизайн-концепции, такие как иерархия, контраст, выравнивание, типографика и стилизация. На экране появляются два компонента, ваша задача — выбрать более правильный и удобный для пользователей вариант.
Компоненты могут выглядеть одинаково для нетренированного глаза, но опытный дизайнер должен уметь различать их, обращая внимание на небольшие различия, например, неправильно выровненный текст или неравномерные отступы.
Извлеките максимум пользы из онлайн-игр
Я часто поражаюсь тому, как быстро развивается индустрия дизайна. Иногда идти в ногу с новыми инструментами и методами становится слишком трудно и это давление начинает негативно сказываться на моих творческих способностях.
Я делаю свою работу лучше всего, когда подхожу к проблемам с долей детской непосредственности, вот почему мне так нравятся эти игры: они позволяют учиться и практиковаться, сохраняя при этом ощущение игры и чуда.
Какую бы цель вы ни преследовали — сменить профессию, повысить квалификацию или освоить новый UI/UX-метод — онлайн-игры для дизайнеров помогут протестировать и развить ваши художественные и технические способности. Как однажды сказал Пабло Пикассо: "Я всегда делаю то, что не могу сделать, чтобы научиться делать это".
