Как сделать текстовый квест за два часа

С помощью Twine.

Самый простой и одновременно универсальный способ — бесплатный редактор Twine. Он требует минимум усилий — просто пиши тексты и соединяй их переходами. И тут же игру можно запустить в браузере, показать друзьям или продюсеру, чтобы взять за душу и выбить грант на разработку.

Пример страницы из текстового квеста, сделанного в Twine​
Пример страницы из текстового квеста, сделанного в Twine​

Скорость разработки текстового квеста в этом инструменте ограничена фактически только вашей скоростью по созданию собственно текста. Тестовый пример к этой статье в 1900 слов и 12000 знаков с пробелами я написал за 2 часа (ссылка в конце) . Примерно столько же я потратил на черновик этой самой статьи.

Да, редактуру и вычитку лучше проводить по отдельной колонке расхода времени, иначе это морально вас может убить. А, может, сделает сильнее.

Суперсила Twine

Сила Twine в том, что он позволяет увидеть связи между узлами текстового квеста в виде схемы.

​Редактор историй показывает схему связей между локациями
​Редактор историй показывает схему связей между локациями

Когда-то я писал текстовые игры как обычный код в текстовом редакторе. Там приходилось решать кучу вопросов:

  • все ли узлы связаны переходами;
  • все ли задуманные выборы реализованы, то есть ведут к какому-то тексту;
  • нет ли у меня «потеряшек» — висячих узлов, в которые невозможно попасть.

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

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

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

Итак, Twine — это комбинация трёх инструментов в одной программе:

  • менеджер проектов, то есть разных игр;
  • графическая схема узлов в игре;
  • собственно текстовый редактор, в котором набирается текст и специальный команды.

Где взять

На сайте Twinery.org лежат свежии версии для Windows, MacOs и Linux — никто не уйдет обиженным. Их надо скачать, установить и запустить. Это продукт с открытым кодом, если интересуетесь - можете заглянуть на GitHub проекта, но для разработки собственно текстовых игр это не нужно — главное, запустить редактор историй. Здесь и далее я буду описывать работу с Windows-версией. И, кстати, тут есть тёмная тема!

Тёмная тема, язык и подготовка к работе

При открытии Twine выглядит примерно так. У вас, скорее всего, он будет светлым.

По умолчанию Twine включает светлую тему
По умолчанию Twine включает светлую тему

Чтобы включить тёмную/светлую тему, надо кликнуть на иконке луны или солнца внизу справа.

Чтобы выбрать русификацию или адаптацию под другой язык, нажмите на кнопку Language и выбирайте. Есть украинский, китайский, испанский... всего 20 локализаций. Это влияет только на внешний вид самого редактора, текстовая игра будет на том языке, на котором вы будете набирать текст, что видно на скриншоте.

Внимание: каждая локализация хранит свои текстовые игры в отдельной папке, поэтому если вы начали писать проект под одним языком, а затем решили включить в Twine какой-то другой — не пугайтесь тому, что ваши игры исчезли. Это поведение характерно для последней версии (2.3.5), по которой написана статья. В будущем, возможно, это исправят.

​Stories и Истории —  исходники для разных локализаций Twine (не игр!) лежат в разных папках
​Stories и Истории —  исходники для разных локализаций Twine (не игр!) лежат в разных папках

Файлы проектов в Twine хранятся под Windows в директории «Документы» для текущего пользователя. У меня были разные эксперименты: одни я делал под английским интерфейсом, другие —под русским, поэтому первые сохранились в папке Stories, вторые — в «Истории». И, да, китайский интерфейс создаёт на вашем компьютере папку с иероглифами. Это не проблема, просто забавно.

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

Как создать текстовую игру в Twine

Основной формат игр, доступных в этом редакторе — это набор локаций, которые можно соединять переходами. Это базовый костяк возможностей, он реализован на уровне редактора, то есть доступен во всех форматах.

Ах, форматы! Я забыл сказать, что Twine — прекрасно расширяется с помощью разных форматов, которые можно воспринимать как микро-движки с собственными языками и возможностями. Для начала работы выбор формата не имеет значения. Если вы описываете локации или ситуации, и соединяете их выборами, то сеть переходов будет работать во всех форматах.

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

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

Для начала можно выбрать любой формат — его можно поменять потом.

Чтобы начать новую историю, нажмите на кнопке «+История» (+Story).

Как сделать текстовый квест за два часа

Введите имя игры-истории и нажмите «Добавить». Всё, вы в редакторе истории.

Редактор истории

Он выглядит как огромный лист миллиметровки, на котором лежат листочки. В начале там будет только один «Безымянный параграф».

Как сделать текстовый квест за два часа

Параграф — это локация в бродилке или один кадр в диалоге. Короче, это базовый узел в сети, из которой будет сплетена игра.

Кликните дважы на нём, чтобы отредактировать его. Откроется окно с несколькими полями. Вам нужно только два: верхнее для названия и нижнее для описания.

Как сделать текстовый квест за два часа

Из моего опыта название параграфа — это ерунда. Это то, что нужно только внутри редактора для переходов. Можно писать что угодно: хоть цифры, хоть кириллицу. Я советую только делать их короткими, потому что их так удобнее будет вставлять как ссылки в других параграфах.

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

Объём текста в параграфе теоретически не ограничен. Но длинные простыни в наш век — на любителя. Кроме того, их придётся проматывать на экране мобильника. Решайте сами.

​Объём текста в описании не ограничен. Кстати, ссылки на другие параграфы можно давать прямо в тексте
​Объём текста в описании не ограничен. Кстати, ссылки на другие параграфы можно давать прямо в тексте

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

Как добавить переход к другой локации

Чтобы добавить переход, действие или выбор в диалоге, введите двойные квадратные скобки, а внутри напишите название параграфа, к которому надо перейти. Вот так

[[Облизать муравьиную тропу]]

Как только вы это сделаете, Twine тут же создаст второй параграф с этим именем. А если такой параграф уже есть, просто соединит их переходами.

Если вы послушались моего совета и начали писать параграфы с компактными именами, да ещё с цифрами и сокращениями, то для того, чтобы выбор содержал человеческий текст, надо писать по шаблону

[[Текст выбора|название параграфа, куда идти]]

Пример:

[[Облизать муравьиную тропу|ants]]

Жмите на крестик в верхнем углу и закрывайте параграф. Теперь в редакторе лежит несколько узлов будущей игры. Их можно перетаскивать как угодно.

Чтобы удалить неудачный или лишний параграф, используйте клавишу Delete или иконку с корзиной из всплывающего меню, которое появляется при наведении мышки на параграф.

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

Тестовый запуск игры

Тут все банально — нажмите «Запустить» или «Тестировать» в редакторе истории.

Как сделать текстовый квест за два часа

Игра откроется в вашем браузере.

Как сделать текстовый квест за два часа

Если что-то измените в игре — запускайте заново.

Экспорт игры, публикация и показ друзьям

Чтобы экспортировать игру в HTML, в редакторе истории нажмите на названии игры внизу и выберите «Опубликовать в файл». После этого укажите путь и название с расширением .html

Как сделать текстовый квест за два часа

Получится обычный HTML-файл, который можно заархивировать и отправить друзьям или выложить на свою страницу (к примеру, на бесплатный хостинг GitHub Pages).

С помощью магии, то есть знакомых программистов, этот файл можно даже превратить в .exe файл и опубликовать в Steam (преценденты были), но я говорю об этом только для того, чтобы показать, какие возможности открывает Twine.

Многие сценаристы используют Twine для разработки диалогов или визуальных новелл на других движках, вплоть до Unity и Unreal — просто они экспортируют данные, описывающие сеть переходов и параграфов, в формат JSON. Это тоже монетка в копилку ваших представлений о возможностях проекта.

Дерзайте

От скачивания до запуска своей первой игры на Twine проходит очень мало времени. Можно уложиться в несколько часов. Это, конечно, будет очень небольшая игра — скорее шутка или эксперимент. Но эти несколько часов могут оказаться очень захватывающими.

Я начал набрасывать пример к статье — игру-квест «Лорд-титан» про безумный магический мир после ужасных катастроф, и не успел обернуться, как пролетело два часа. Да, для полноценной игры это мало. Нужно как минимум восемь часов, по моим прикидкам, чтобы сделать что-то законченное. Ну или быть гением минимализма. Я не гений, факт.

Если вам интересны текстовые игры типа квестов из «Космических рейнджеров» — это готовый инструмент для создания подобных забав.

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

137137 показов
105K105K открытий
11 репост
117 комментариев

Обращаюсь к автору статьи.
Об этой программе знаю уже давно, однако в ней столько тонкостей, что мне трудно разобраться в ней. Как предположим фон сделать или как картинку под текстом вставить и тп. Автор мог бы развивать эту тему и сделать несколько статей, рассказывающих о функциях программы (это мой личный совет и одновременно просьба;)

Ответить

я вот и думаю, что сначала надо рассказать про картинки, как добавлять

как программист могу сказать, что надо открыть в Chrome дебаггер, посмотреть схему элементов и изменить в таблице стилей нужный CSS-селектор

не-программистам тяжелее - надо курить конкретный выбранный мануал по выбранному формату.

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

Потом подумаю о музыке.  

Ответить

Немного саморекламы: я тут сделал немножко туториалов по твайну и планирую делать еще: https://www.youtube.com/channel/UCY4MqFFkoDDzuRUtryNmgeQ

Что касается самой программы, то использовать десктопную версию не советую: очень уж глючная. В баг-репортах сплошные проблемы именно десктопных версий. Преимуществ перед веб-версией я так и не заметил. А для онлайн-версии я сделал кое-какие ништяки: https://chrome.google.com/webstore/detail/twine-enhancer/lchnjmjklognlfocknklbbmpdbfidahj

Ответить

Еще вот такой туториал написал когда-то: https://blinovvi.blogspot.com/p/ifj1art1online.html

Ответить

Огромный респект тебе дружище за твой труд!!!

Ответить

отлично, если понравится - можно вставлять видосы в статьи?

Ответить

Комментарий недоступен

Ответить