Почему UI-дизайн — это интересно?

Часто UI/UX уходит на второй план. Мы решили восстановить справедливость и рассказать, какая сила кроется в хороших интерфейсах.

Эскизы UI для Ori and the Will of Wisps от Алексея Яковлева

Серый кардинал

Интерфейс — мостик между игрой и пользователем.

Тем не менее, особого внимания на удачный интерфейс вы не обратите — он не бросается в глаза.  Вместо этого ненавязчиво помогает игроку, заботится и поощряет. От главного меню до финальных титров, оставаясь в тени, он определяет наше впечатление.

UI в проектах Blizzard уже многие годы считается образцом качества.

Понравится ли игроку внешний вид интерфейса — вопрос субъективный. А вот если хромает usability (англ. удобство использования), плохо будет абсолютно всем. Особенно это касается мобильных игр, ведь у пользователя нет ни времени, ни желания долго разбираться с управлением.

Для мобильных игр особенно важен размер и расположение элементов — на них должно быть удобно нажимать. Основные кнопки помещаются “под” большие пальцы рук. Экран из GardenScapes.

Понравится ли игроку внешний вид интерфейса — вопрос субъективный. А вот если хромает usability (англ. удобство использования), плохо будет абсолютно всем. Особенно это касается мобильных игр, ведь у пользователя нет ни времени, ни желания долго разбираться с управлением.

Что делают UI/UX-дизайнеры?

UX-дизайнер проектирует интерфейс, анализирует потребности пользователей, создает и тестирует прототип. Его работа проходит на грани инженерной мысли и маркетинга.

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

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

Что делают UI/UX-дизайнеры?

Для художника по интерфейсам мало красиво рисовать, нужно разбираться в ключевых темах:

  • usability*
  • дизайн
  • верстка
  • стилизация

Usability* может быть продумано геймдизайнером или UX-дизайнером, но понимать основные принципы необходимо и художнику.

Вооружившись всеми знаниями, художник становится настоящим волшебником. Он знакомит пользователя с игрой и помогает насладиться процессом. Если вы слету понимаете, как управлять персонажем и пользоваться инвентарем, если карта мира выглядит как отдельное произведение искусства — спасибо UI-художнику.

Эскиз UI для Ori and the Will of Wisps от Алексея Яковлева

Настоящие гуру интерфейсов на вес золота в любой компании — они знают, как правильно распределить информацию и управлять взглядом игрока. На помощь приходит знание психологии. Понимание настроений игрока и правильный подбор цветов и форм, создают уникальный и удобный дизайн.

Заинтересовались профессией? Знайте, UI-художника ждет увлекательный путь к идеальному оформлению. Ведь UI — не просто набор абстрактных кнопок и окон, он поддерживает сеттинг игры и красиво обрамляет историю.

NieR:Automata

У меня было несколько визуальных ориентиров для работы: UI предыдущей игры; традиционная эстетика sci-fi; сама 2B (героиня); и общее представление о роскошном и увядающем мире. Объединив все это вместе, я пришел к своей ключевой концепции UI NieR: Automata: дизайн, который будет систематическим и стерильным, но в то же время красивым. В тот момент я был твердо уверен, что лучший способ передать это — отказаться от витиеватых украшений и сосредоточиться на создании чистого, изящного и плоского дизайна. Но вскоре я понял, что, если буду придерживаться этой идеи слишком сильно, окончательный дизайн получится безвкусным.Hisayoshi Kijima о создании UI для игры NieR: Automata

Как начать?

Если вы хотите стать UI-художником, вам стоит изучить композицию, основы веб-дизайна, теорию цвета, верстку и работу со шрифтами.

А это видео поможет сделать первый шаг и составить представление о процессе создания UI-дизайна:

(Вера Величко:  Вкусный и полезный GUI: рецепты приготовления)

Create More, Create Different

Выберите цвет KAMVAS 13

Фиолетовый

Полуночно-зелёный

Космический черный

Выберите цвет HS611

Коралловый красный

Звёздный синий

Космический серый

Список поддерживаемых устройств

  • Huawei P20/P20Pro/P20RS

  • Huawei P30/P30Pro

  • Huawei P40/P40 Pro/P40 Pro Plus

  • Huawei Mate 10/Mate10 Pro

  • Huawei Mate 20/Mate20 Pro/Mate20 X

  • Huawei Mate 30/30Pro

  • HONOR Note 10

  • HONOR V20

  • HONOR 30Pro/30Pro+

  • Samsung Galaxy Note 8

  • Samsung Galaxy Note 9

  • Samsung Galaxy Note 10/10+

  • Samsung Galaxy S8/S8+

  • Samsung Galaxy S9/S9+

  • Samsung Galaxy S10/S10+

  • Samsung Galaxy Tab S4

  • Samsung Galaxy Tab S5e

  • Samsung Galaxy Tab S6