Как мы создавали gui.

Gui (Graphical user interface) - графический интерфейс для пользователя. На наш взгляд является важным аспектом восприятия игры. На его создание потребовалось немало сил и времени. В этой статье подробно расскажем как это было.

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

Как мы создавали gui., image #1

После этого плавно перешли к проработке основного вида панели с текстом.

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

Как мы создавали gui., image #2

Для дальнейшей доработки мы вдохновились эстетикой конструктивизма и добавили некоторые его элементы в дизайн.

Референсы
Референсы

Получился вот такой вариант:

Как мы создавали gui., image #4

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

Как мы создавали gui., image #5

Добавили кнопки управления (перемотка, скрыть всё, история) и прикрутили к ним анимации.

Video only available to signed-in users
Error
work in progress

Завершающими штрихами размыли верхнюю грань, добавили кнопку паузы и изменили шрифт имён персонажей. Пока имеем такой результат. Возможно, он еще незначительно поменяется к релизу игры.

work in progress
work in progress
299 views·1 share