Как браузърната игра да се усеща добре: обратна връзка, обучение и финални екрани

В PN Scripts сме пуснали над 100 безплатни браузърни игри: малки аркадни, логически, карти, ритъм и стратегии, които вървят в раздел на браузъра на лаптоп или телефон. Толкова много игри ни научиха на нещо неудобно. Една игра може да е завършена, без грешки и честна, а играчите пак да я затворят след двадесет секунди. Разликата между игра, която хората оставят, и игра, която играят отново, рядко е в основната идея. Тя е в първите десет секунди, в отговора на всяко действие, в темпото на трудността и в екрана, който се появява в края на рунда. Тази статия е списъкът, който вече прилагаме към всяка игра, с примери, които можете да изиграете.

#1. Научете играча за десет секунди, без стена от текст

Никой не чете екран с правила в браузърна игра. Нашето правило е новият играч да разбере какво да прави до десет секунди след като натисне „Старт“. Какво работи:

• Призрачна ръка. Анимирана ръка или пръст показва първия ход и изчезва, щом играчът го направи. В Skyfennel, вертикален шутър, призрачна ръка показва управлението с плъзгане, а враговете не стрелят през първите шест секунди, за да се научи играчът да се движи, преди нещо да може да го уцели.
• Подсказки направо на игралното поле. В Cragdrift, игра с лунен модул, кръг около площадката показва SAFE или TOO FAST, докато се спускате, а на първата луна стрелка сочи площадката. Играчът научава правилото, като го види, точно когато е важно.
• Първо ниво, което не може да се загуби. Mossdelve, шестоъгълен „миночистач“, води първото отваряне; Stitchwold, японска кръстословица (нонограм), започва с първи картинки с подсказки.
• Еднократни съвети, които се появяват веднъж, когато ситуацията възникне за първи път, и повече никога.

Тестът е прост: дайте играта на човек, който не я е виждал, не казвайте нищо и гледайте първите десет секунди.

#2. Всяко действие има нужда от отговор

„Juice“ е думата, с която разработчиците на игри наричат обратната връзка, която прави действието осезаемо: малък изблик от частици, число, което изскача и отлита, звук, кратка светлина, леко разклащане на камерата при удар. Нищо от това не променя правилата. Всичко от това променя усещането от играта.

• Удар, улов или съвпадение трябва да имат звук, картина и число едновременно. В Clattermoss, игра на флипер, всеки удар в бъмпер показва изскачащи точки.
• Покажете причината и следствието. Rillgate, логическа игра с тръби, показва потока на водата на живо, докато поставяте тръбите, и отбелязва отворените краища, така че грешката се вижда, преди да ви е струвала нещо.
• Награждавайте малките стъпки. В Rungwick, игра със словесна стълба, всяка вярна стъпка пуска искри.
• Нека е кратко. Обратна връзка, която трае по-дълго от действието, става забавяне. Повечето от нашите траят няколкостотин милисекунди.

Всички звуци в нашите игри се синтезират в браузъра с Web Audio API, така че обратната връзка не струва нищо като размер за изтегляне. Не забравяйте клавиша за звука и се уверете, че не пречи на играта: в игрите с писане и думи буквите P и M трябва да стигат до играта, вместо да я паузират и да спират звука.

#3. Вдигайте трудността постепенно и показвайте напредъка

Игра, която е трудна от самото начало, губи начинаещите; игра, която остава лесна, губи всички останали. Какво правим ние:

• Започваме под нивото на играча и вдигаме едно нещо наведнъж: скоростта, после броя на враговете, после нова механика.
• Даваме на кратките сесии цел: медални времена в Skidlark, картинг, в който се състезавате и със собствения си „призрак“; целеви времена и скъпоценни камъни в Halfglow, платформена игра.
• Предлагаме ежедневно ниво или карта. Много от игрите ни, от Swaybloom до Puttlewick, имат такова и то дава на играчите причина да се върнат утре.
• Правим настолните игри настройваеми. В Duskturn, игра на реверси, компютърът става по-силен всеки път, когато натиснете „Напред“.

#4. Началният екран е трейлър

Статичен начален екран с бутон „Играй“ пропилява момента, в който посетителят решава дали да остане. Кратък демонстрационен режим зад заглавието показва играта в движение: на началния екран на Duskturn компютърът играе срещу себе си, зад заглавието на Signalbrook, игра със светофари, вече тече трафик, а на началния екран на Starsow се бият четирима компютърни противници. Играчът е видял играта още преди първия клик.

#5. Един ясен финален екран

Краят на рунда е мястото, където играчът решава дали да играе пак или да си тръгне. Добрият финален екран казва какво се е случило (резултат, най-добър резултат, какво е постигнал играчът), предлага „Отново“ като очевиден първи бутон, а след това „Напред“ или „Меню“.

Най-честата ни грешка тук не беше в логиката, а в рисуването. Няколко игри рисуваха собствен надпис с резултата върху платното, докато общата обвивка на играта показваше своята карта с резултата отгоре, и играчът виждаше два панела един върху друг. Автоматичен тест, който изиграваше всяка игра до края, отчиташе всички като успешни, защото играта наистина стигаше до състоянието си за резултат. Открихме проблема едва като разгледахме снимки на всеки финален екран, включително на екран с размера на телефон, където картата покрива цялото платно. Правилото, което ползваме сега: само един панел, за който отговаря едно парче код.

#6. Телефонът не е малък лаптоп

• Зони за докосване поне 44 на 44 пиксела. Където пъзелът има нужда от малки клетки, както в Stitchwold, помага лупа под пръста.
• Без информация, която се вижда само при посочване с мишката.
• Управление, което работи с палец: зони за докосване отстрани на екрана или игри с един бутон като Gustling, където задържате, за да се издигнете, и пускате, за да се спуснете.
• Тествайте докосването отделно. В игра с дузпи открихме, че прицелът реагира и на докосвания извън вратата; сега се заключва само върху нея.

#7. Тествайте като играч и гледайте резултата

Всяка наша игра има автоматичен тест: браузър без екран я отваря, проверява дали няма грешки в конзолата, пуска я с Enter, изиграва я с прост вграден бот до екрана с резултата и я пуска отново с докосване на екран с размера на телефон. Това хваща сривовете. Не хваща игра, която не е забавна, съвет, който закрива бутона за старт, или два панела един върху друг. За тях някой трябва да изиграе играта и да разгледа всяка снимка. При прегледа преди пускане на четири серии една четвърт от игрите бяха задържани по тези причини и повечето се върнаха едва след поправка.

Ако искате да видите тези идеи на практика, всички наши игри са безплатни на games.pnscripts.com и в itch.io. За 3D в браузъра прочетете браузърни игри с three.js и WebGL, а за планирането на собствена игра как се планира прототип и вертикален срез на игра.

#Често задавани въпроси

Какво означава „juice“ в дизайна на игри?

Обратна връзка, която прави действието осезаемо и възнаграждаващо, без да променя правилата: частици, изскачащи числа, звуци, леко разклащане на екрана, проблясвания и плавни движения.

Колко дълго трябва да е обучението в браузърна игра?

Колкото се може по-кратко. Целта е играчът да направи първия смислен ход до десет секунди, а останалото да научи, когато всяка ситуация се появи за първи път.

Може ли прекалено много ефекти да развалят играта?

Да. Ефекти, които траят по-дълго от действието, забавят играта, а постоянното разклащане на екрана изморява. Нека обратната връзка е кратка и съразмерна на събитието.

Наистина ли игрите на PN Scripts са безплатни?

Да. Всички се играят безплатно в браузъра, без акаунт и без покупки в играта.