CrazyPUB: звания и уровни для серверов CS2
Как мы нарисовали 18 званий и 100 иконок уровней для серверов CrazyPUB в CS2: орнамент по десяткам, десять цветов и знак проекта в каждой иконке
Звания и уровни для серверов CrazyPUB в CS2
Для серверов CrazyPUB в Counter-Strike 2 мы нарисовали 118 иконок: 18 званий и 100 уровней. Их видно в таблице счёта рядом с ником игрока, и там они совсем маленькие. Поэтому вся система построена так, чтобы уровень можно было прикинуть по форме и цвету, ещё не разглядев цифру.
Ниже рассказываем, как устроены звания, по какой логике меняются уровни и как всё это выглядит в настоящем матче.
Задача: две системы в одной колонке
CrazyPUB держит публичные серверы CS2 со своей прогрессией. У каждого игрока есть звание и уровень, и в таблице счёта они стоят в одной колонке: у одного игрока там звание, у соседа уровень.
Отсюда два требования. Во-первых, звания и уровни должны выглядеть как одна семья, иначе таблица рассыпается. Во-вторых, каждая иконка должна читаться в том размере, в котором её рисует игра, а это примерно высота строки текста.
Поэтому все 118 иконок нарисованы на одном холсте 274 на 111 пикселей, в одной палитре и со знаком CrazyPUB внутри. В таблице они стоят ровной колонкой и не прыгают по высоте.
18 званий от Silver I до Global Elite
Звания мы не придумывали заново. Это классическая лестница соревновательного режима, которую игроки знают наизусть, и ломать привычную логику смысла не было. Мы перерисовали её в стиле CrazyPUB: наклонная плашка со скруглёнными углами, мятный акцент и знак проекта полупрозрачным слоем на фоне.
Звания делятся на три группы, и у каждой своя плашка.
Silver, 6 званий. Яркая мятная плашка с тёмными шевронами. С каждым званием добавляется шеврон, а у Silver Elite и Silver Elite Master появляется кольцо.
Gold Nova и Master Guardian, 7 званий. Плашка становится тёмной со светлой обводкой. У Gold Nova внутри от одной до четырёх звёзд в скобках, у Master Guardian винтовка, а у Master Guardian Elite две скрещённые винтовки.
Верхние пять званий. Тёмная плашка с мятной обводкой и крупные эмблемы: звезда у Distinguished Master Guardian, орёл у Legendary Eagle и Legendary Eagle Master, крылатый глобус у Supreme Master First Class. У The Global Elite к глобусу добавляются скрещённые винтовки.
Из-за смены плашки группу звания видно сразу: светлая иконка означает Silver, тёмная с белой рамкой середину лестницы, тёмная с мятной рамкой топ. А точное звание внутри группы подсказывает рисунок в центре.
100 уровней: новый орнамент каждые десять уровней
100 разных иконок никто не запомнит, а 100 одинаковых плашек с цифрой не дают игроку ощущения роста. Поэтому уровни мы разбили на десятки. Внутри десятка форма одна, а с каждым новым десятком орнамент вокруг плашки становится сложнее и торжественнее.
1–10: короткие полоски по бокам.
11–20: длинные полосы, как на шевроне.
21–30: расходящиеся дуги.
31–40: дуги с маленькими звёздами.
41–50: рамка со звёздами с двух сторон.
51–60: рамка с изогнутыми листьями.
61–70: смещённые ленты со звёздами.
71–80: широкая плашка, усыпанная звёздами.
81–90: крылья со звёздами.
91–100: крылья с металлическим бликом и золотыми звёздами вокруг.
Игрок сам видит, как растёт его иконка, и знает, что ждёт его через десять уровней. А в таблице счёта по одному силуэту понятно, с кем ты играешь: с новичком с полосками или со старожилом с крыльями.
Десять цветов внутри десятка
Орнамент показывает десяток, а цвет показывает позицию внутри него. В каждом десятке орнамент и цифра проходят одни и те же десять цветов, от бледного серебра через золото и оливковый к яркому мятному. Последний уровень десятка всегда самый яркий, и этот мятный связывает уровни со званиями.
Первый уровень десятка (1, 11, 21…): #E8E4D8, светлое серебро
Второй: #E8D6A3, шампань
Третий: #E8C66A, светлое золото
Четвёртый: #E6B94F, золото
Пятый: #DDAA32, густое золото
Шестой: #C99A27, тёмное золото
Седьмой: #AFA83A, оливковый
Восьмой: #7FC66A, зелёный
Девятый: #4FE39A, светло-мятный
Десятый (10, 20, 30…): #26FEAF, яркий мятный
В итоге все 100 уровней складываются в сетку 10 на 10: по строкам меняется орнамент, по столбцам цвет. Из 20 элементов получается сто узнаваемых иконок, и ни одна не повторяет другую.
Из чего состоит иконка уровня
Каждая иконка уровня собрана из четырёх частей. Две из них одинаковы для всего набора, две меняются с уровнем.
Плашка. Тёмный восьмиугольник, один для всех 100 уровней. Он держит контраст с цифрой на любом фоне таблицы.
Знак CrazyPUB. Лежит внутри плашки с прозрачностью 10%. В игре он почти не заметен и не мешает цифре, но на крупном размере, в профиле или на сайте, иконка сразу читается как фирменная.
Цифра. Набрана шрифтом Unbounded в цвете своего уровня. Этот же шрифт стоит в брендбуке CrazyPUB, так что цифры говорят тем же голосом, что и логотип.
Орнамент. Меняется каждые десять уровней и перекрашивается внутри десятка.
У уровней 91–100 есть ещё два слоя: металлический блик на плашке и мягкое свечение за крыльями. Последний десяток должен ощущаться наградой, а не просто следующим шагом.
Как это выглядит в игре
На скрине из матча на сервере CrazyPUB в одной колонке стоят сразу оба вида иконок. Там The Global Elite, Master Guardian I, Gold Nova III и четыре шеврона Silver IV, а рядом уровни 2, 7, 8, 17 и 25.
Иконки одной высоты, выровнены по одной оси и не спорят друг с другом. Звания сразу отличаются от уровней по форме плашки, а уровни между собой по орнаменту: расходящиеся дуги у 25-го уровня не перепутаешь с короткими полосками у второго. Цифры читаются даже на полупрозрачном фоне таблицы счёта, потому что всегда стоят на тёмной плашке.
Что получилось
У CrazyPUB теперь одна система из 118 иконок. Звания остались узнаваемыми для игроков CS2, уровни продолжают их и дают видимый рост от первого уровня до сотого, а знак и шрифт проекта есть в каждой иконке.
Мы делаем графику для игровых проектов: звания, иконки наград, логотипы и фирменный стиль для серверов, сайты и оформление соцсетей. Если вашему серверу нужна своя система рангов, напишите нам, обсудим задачу и предложим решение.
Частые вопросы
Сколько иконок входит в набор CrazyPUB? 118: 18 званий от Silver I до The Global Elite и 100 иконок уровней.
Чем звания отличаются от уровней? Звания нарисованы на наклонной плашке и повторяют привычную лестницу соревновательного режима. Уровни стоят на восьмиугольной плашке с цифрой и показывают прогресс игрока на серверах проекта.
Как отличить уровни, не читая цифру? По орнаменту и цвету. Орнамент меняется каждые десять уровней, а внутри десятка цвет идёт от светлого серебра к яркому мятному.
Можно заказать такие иконки для своего сервера? Да. Мы рисуем звания, уровни и иконки наград для серверов CS2 и других игровых проектов в стиле вашего бренда. Если фирменного стиля ещё нет, можем начать с логотипа и брендбука.
В каком формате получается набор? Иконки нарисованы в векторе, поэтому их можно выгрузить в любом размере и формате, который нужен игре или сайту