Немного об интерфейсах видеоигр

Почему-то трендовый UI-дизайн как-то еле-еле добирается до видеоигр: в большинстве до сих пор творится что-то вроде едрёных скинов для Винампа из нулевых. Также замечаю разницу в интерфейсах эксклюзивно консольных проектов и мультиплатформенных. Скажу точнее: если игра, в числе прочих, выходит на компьютере, вероятен сложный и сильно модальный интерфейс. В качестве примеров этому будут последние Ведьмак и Фэлаут.

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

Destiny_20160228230756

Destiny_20160228230845

Мне очень нравится интерфейс Destiny. Это тот случай, когда консольные ограничения делают лучше. Элементы большие, они явно реагируют на ховеры и клики. Получаешь уровень — тебе кайфно залезть в меню и распределить очки, одеть шмотку. А ведь Destiny, на минуточку, мультиплеерная РПГ — замороченность их интерфейсов воспета в легендах.

А теперь посмотрим на мультиплатформу. Вот Фэлаут.

Fallout 4_20160228231907
Fallout 4_20160228232022

Мелко. Сфокусировать внимание сложно. Экран с талантами хоть и симпотичен, как картинка, но пользоваться им, как интерфейсом тяжело: глаза разбегаются, слишком много всего сразу.

Совсем всё грустно в Ведьмаке.

Велен

Велен

Как же сложно. Тексты мелкие. На одном экране можно сделать кучу всяких действий вообще всеми доступными кнопками. Грешным делом думаешь, может стоило всё-таки добавить курсор? В геймпадовом Destiny вон курсор, управляется легко, но оно и понятно — элементы здоровые. Не представляю, как в Ведьмака играют сидя на диване перед телевизором. Интерфейс-то чисто компьютерный, аки вебсайт (и сайт таксебешный, акценты одновременно везде и всюду). Получение уровня или нового обмундирования порой воспринимается, как препятствие — ведь тебе снова придётся разбираться в этой свалке информации.

Жду, что в будущем нас ждут адаптивные интерфейсы: под разные платформы будут разрабатываться свои версии менюшек. До этого дорос UI-дизайн вообще, верю, что тренд доберётся и до видеоигр.

Кстати говоря, всё это мысли по поводу интерфейсов. Как игры все три проекта замечательные… Ну разве что Ведьмак мне чуть меньше нравится, но про это в другой раз :)

Мысли о проработанном стаже

Почему-то я с самого начала понял, что занимаюсь в ВУЗе какой-то ерундой и мне там явно не нравится. Чётко понимал: я могу зарабатывать на жизнь дизайном. Понятия не имею откуда взялась эта уверенность.

Моей первой полнорабочедневной работой стала вёрстка еженедельного журнала о животных. Внезапно. Первый раз в жизни я приходил на работу к 9 утра, обедал в час и топал домой в 6 вечера. И мне сразу не понравилось. В голове были очень невесёлые мысли. Вот ты учишься в школе — ты знаешь, что после 11 класса это закончится и «всё изменится». Поступаешь в ВУЗ, в голове держишь — после 5 курса всё закончится и опять «всё изменится». Но вот я вышел на работу и… и осознал: всё, больше ничего не изменится, в 9 на работу, в 6 домой и так до конца. Удручающая идея.

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

С первого дня cразу же принялся упарываться. Приходить раньше и работать. Не ходить на обед и работать. Задерживаться после работы, чтобы работать… Но Влад поставил мне голову на место. Кто бы мог подумать, у меня оказывается есть целый час на обед! Его я с упоением прогуливал в Михайловской роще. Шок: если мне не здоровится, я могу смело сказать об этом главному и отпроситься домой. Совсем охренеть — оказывается ты имеешь право получать зарплату вовремя и в полном объёме! Всем этим удивительным истинам научил меня Влад. Я частенько подмечаю у соотечественников синдром задержавшегося крепостного права. Ох, если бы не Влад, возможно, я бы пополнил эти нежелательные ряды. Уважать себя, как сотрудника — вот что такое для меня Влад. Тут я позволю дисклеймер: естественно, это всё справедливо при условии, что ты действительно прилежный сотрудник, который так же строг к себе, как и к условиям труда — теперь, когда это точно ясно, не будем больше к этому возвращаться.

А потом Влад уволился. И я стал работать в офисе совсем один. Совсем-совсем. То было какое-то время в параллельной реальности, сложно что-то вспомнить оттуда. Помню, что на свою первую зарплату купил отличные наушники Sennheiser HD 280 Pro. Они и по сей день служат мне верой и правдой, ни разу не ломались, до сих пор свожу в них музыку. Наверное, когда они сломаются, пройдёт моя внутренняя эпоха.

HD280Pro

Тот журнал про животных в последствии закрылся, но я в обиде не остался. Директор позвала меня работать в издательство Водолей, где она работала главбухом. В Водолее мне предстояло готовить к печати две еженедельные газеты — «Авторынок» и «Рынок Недвижимости». Две еженедельные газеты за одну неделю. В ту пору я научился работать очень быстро. Если Eminem поёт про себя Rap God, я мог смело называть себя Photoshop God. Нет, не подумайте, мы не рисовали там нечто прекрасное, как раз наоборот. Сейчас я говорю именно о скорости, технологичности и оптимизации работы.

Сожалею вот о чём. Тогда я ещё не понимал, что с людьми надо дружить. Я приходил на работу, строго на строго обособлялся ото всех сотрудников и уходил домой. Только много позже я понял, насколько же оказывается может быть хорошо, если дружить с людьми. Но это всё было потом.

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

Я устроился в томскую фирму Userstory. Гасподь, как же меня там драли. Я не успевал ничего. Я рисовал ужасно. Я не знал ничего. Страшно представить, я пришёл в веб-студию и хлопал пустыми глазами, когда мне говорили, что иконки должны быть пиксель-пёрфект. Не, не, не, представьте, я садился рисовать новую страницу и делал её вообще любой ширины. 960? 1200? Лол, я просто рисовал прямоугольник на глазок, как понравится — вот моя сетка. Однажды я пришёл на работу, а проектный менеджер, Женька, говорит:

— Переноси компьютер на этаж ниже, будешь теперь около меня сидеть.
— Зачем?
— Будем тебя дрочить.

Женька сказал, Женька сделал. Гасподь. Как же. Меня там. Драли. Глаза были на мокром месте. Домой уходил где-то в 11 вечера. Почти всегда. Арт-директор стоял за спиной и крыл матом медлительность моей работы. Я говорил, что считал себя невероятно быстрым в Фотошопе? Я стал ещё быстрее. Тем не менее, в Userstory я долго не продержался, не выдержал темп. Жалко вот что — даже на тот момент я не понял, насколько это нужная вещь быть в ладах с сотрудниками: насколько это облегчает это жизнь и даже делает её веселее.

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

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

А потом, совершенно случайно, свершилось прекрасное. Меня позвали на собеседования в какую-то фирму на главпочтамте. Я даже названия не запомнил. Директор после телефонного разговора вообще показался каким-то наркоманом. Совершенно не на что не рассчитывая пришёл туда. То была студия Avaj.
Ну короче Аважику я пел дифирамбы ни раз и не два. Если всё что со мной происходило до этого было чисто технической прокачкой, то Аваджей прокачал на другой порядок. Впервые в жизни я осознал, какой же кайф дружить с коллективом. Ну и самое главное, я узнал секрет™. Эту мысль я уже писал, но напишу ещё, ещё и ещё.

Хороший результат — это не цель. Приятный процесс + результат — вот это цель. Тебе не нужно пилить на износ всего и вся вокруг гениальный продукт, это не та цель. Но если люди вокруг тебя счастливы: и арт-директор, и технари, и клиент — вот это цель. Удовольствие от работы, срок выполнения работы — такие же параметры крутости конечного продукта, как и всякий там трендовый дизайн.

Рабочие неудачи перестали попадать внутрь меня. Я начал уходить домой с совершенно спокойной душой. Уж не знаю, есть ли связь, но и приходить на работу я стал совершенно без напрягов, без понедельников.

Таков мой главный, приобретённый скил за пройденный стаж: кайф от работы с людьми. А дизайн нафиг шёл азаза задрался уже блин в Фотошопике 6 лет рисовать нужно в артдиры переучиваться скока можна уже ололо.

Ашановский автобус

Когда на местности появляется человек-дизайнер, он причинятет улучшения окружающей среде. Это даже не активное действие — это свойство дизайнера. Чинить реальность: сейчас плодотворнейшее время.

Мы в Красногорске любим бесплатный автобус до Ашана. Хитрость в чём: он как бы до Ашана и Леруа Мерлена, но ещё рядом станция метро Мякинино, Крокус и Вегас (торгово-развлекательные комплексы). Полезный маршрут.

Но есть косяк: расписание автобуса доступно только на плакатах в самом Ашане и на остановке рядом. Автобуса нет в Яндекс.Транспорте и в Яндекс.Расписании. У него и номера нет, чтобы где-нибудь числиться. Короче, в 2016 году у красногорцев должно быть доступное в интернете расписание автобуса.

Решил выполнить такой этюд. Тем более, что я рад искать мимолётные встречи с веб-разработкой: конкретно в этот раз понадобилось немного javascript.

bus

Само собой, расписание имеет и мобильную версию. Ради неё всё и затевалось. Две недели тестил на себе, вроде без ошибок.

Из интересного по ходу разработки. Дал сотрудникам посмотреть раннюю версию, а там время ближайшего автобуса красилось не в зелёный, как сейчас, а в оранжевый. Я был уверен, что все поймут… Оказалось, люди думали, что это обозначение отменённого рейса. Перекрасил в зелёный — понимаемость стала 100%. Такая она, сила цвета.

Иконки

Его слоупочество, ваш покорный слуга, недавно выяснил, что Фотошоп теперь умеет выдавать svg-графику. Отпраздновал это событие, нарисовав сет иконочек для файлов всяких расширений. Ну вы знаете, в интернете так мало иконочек под файлы разных расширений.

icons

Но если без сарказма, то совершенно бесплатных и вкусняшных иконочек с открытой до неприличия лицензией не так уж и много. Посему решил освоить Iconfinder, завёл аккаунт и отныне буду постить свою выпечку туда. С премьерой меня.

Сей сет доступен в нескольких размерах и в векторе. Сайт зачем-то нагенерировал ещё вариантов меньше 36×48, их использовать не рекомендую.

Живые картинки

Куб весело использовать для «живых» картинок. Можно передавать такие микродвижения, при этом суть изображения остаётся. API плеера позволяет спрятать интерфейс — даже если «живость» ещё не успела прогрузиться, человек всё равно увидит картинку.

Понятно, что это чисто ради пыщ-вау. В качестве более полезного применения, можно придумать показ модели чего-либо со всех сторон, например, товара в интернет-магазине.

Канал с такими картинками запросто делается «личным» и не засоряет никому ленту.

Денежные переводы

Делать было совершенно нечего, решил попрактиковаться на тестовом задании школы стажёров Дизайн-бюро Артёма Горбунова. А то, на самом деле, когда долго фотошоп не открываешь, как-то и навыки начинают пылью покрываться.

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

Задание такое: спроектируйте веб-форму денежного перевода. Это не банк, а универсальный сервис, который заранее не знает о ваших счетах, карточках и других средствах. Отправитель должен легко справиться и остаться уверен, что деньги дойдут до любимой бабушки в деревне, поиздержавшегося родственника на курорте, трудолюбивого фрилансера в Таиланде.

К сожалению или к счастью, я уже видел отличную реализацию этой задачи. Развидеть и забыть её я не могу, так что решил попытаться улучшить и без того хорошее решение.

переводT

Почему бы не попытаться уместить всю операцию в первый экран? Я, конечно, могу только догадываться о мотивах Яндекса, возможно они хотели, чтобы все шаги человека сопровождались заботливыми текстами.

На первом экране я оставил только очень важные подсказки, остальные отправил в подвал — однажды ознакомишься, больше они тебе не понадобятся.

Добавил возможность уведомить получателя о переводе СМС‑кой и сменить валюту. Мне кажется, именно этот функционал скрыт за формулировками «любимая бабушка в деревне» и «фрилансер в Таиланде» из задания.