А что, так можно было? Бумажный дизайн и немного триДЭ.

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

Для начала просто покажу результат. Ниже один и тот же 19-й уровень: призма и зеркало стоят в одинаковых клетках, лучи идут по тем же маршрутам.

Слева прежний вид, справа новый
Слева прежний вид, справа новый

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

Нужон бабушка, ох как нужон
Нужон бабушка, ох как нужон

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

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

Зеркало, расщепитель, стена и призма крупным планом
Зеркало, расщепитель, стена и призма крупным планом

Вся эта графика рисуется кодом на Canvas. Корпус, стекло и блики складываются из простых фигур и градиентов. Для такого небольшого поля этого хватает, а сами рисунки остаются связаны с игровыми элементами.

Еще немного игровых элементов
Еще немного игровых элементов

А что там с триДЭ?

Долго думал и решил постепенно вводить элементы триДЭ, но так, чтобы это не сломало текущий геймплей и было, по сути, минорным изменением. Теперь, при нажатии кнопки рядом с кнопкой музыки, игровое поле из 2d становится триДЭ.

Вот она, кнопочка
Вот она, кнопочка

При нажатии на кнопку игровое поле становится таким.

Тот же 19-й уровень в триДЭ
Тот же 19-й уровень в триДЭ

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

Пощупать новый облик можно прямо в браузере: сыграть в Reflection.

А теперь вопрос к вам: в каком ракурсе легче проследить путь луча? И какой прибор в новом оформлении сложнее всего отличить с первого взгляда? Интересно, где внешний вид уже помогает, а где мне ещё стоит покрутить рисунки.

На этом, братаны и братишки, пока всё. Короткие заметки о разработке и очередную порцию графомании складываю в Telegram-канал «Между версиями». Увидимся в следующей части.

11