Кейс / 03

Кінематографічна вітрина восьми консольних тайтлів, серверлес-прийом пітчів і база преси та інфлуенсерів для релізних розсилок.

РольДизайн, розробка, SEO й воронки — самостійно
ПеріодЖивий сайт компанії
  • HTML5
  • CSS3
  • Vanilla JS
  • Google Apps Script
  • Apache
  • Search Console

Задача

Одна вітрина мала заслужити довіру двох аудиторій.

Гравцям був потрібен швидкий каталог із відчуттям консольних ігор. Інді-розробникам — доказ, що видавець уважно представить їхню гру й професійно опрацює пітч.

Відповідь навмисно пряма: виразний чорно-бурштиновий сайт, платформено-автентичні шляхи до магазинів і власні форми заявок — без CMS, application server і регулярного рахунку за хостинг.

Система

Олдскульна інженерія, доведена до продукту.

Статична доставка лишає сайт дешевим і швидким. Невеликі самописні скрипти відповідають за взаємодію, а Google Apps Script дає рівно два бекенд-процеси, потрібні бізнесу.

01

Вітрина

  • Каталог восьми ігор від шести партнерських студій, кожна з власним кінематографічним хіро.
  • Автентичні store bars Nintendo, Xbox, Steam і PlayStation.
  • Адаптивна хореографія каталогу, scrollspy-навігація й копіювання контактів.
02

Релізний маркетинг

  • Форма пітчу з лімітом платформ, лічильниками, honeypot-захистом і форматованою HTML-доставкою.
  • Заявки преси й інфлуенсерів одразу додаються в базу на основі таблиці, з якої працюють цільові розсилки ключів, асетів, embargo-новин та анонсів релізу.
  • Власні форми замінили зовнішні посилання без появи сервера.
03

Продакшн-гігієна

  • Robots, індекс сайтмапів, image sitemap і метадані кожної сторінки.
  • Pretty URLs, TLS і трирівнева політика кешування Apache.
  • Свідомо без build tooling; на всьому сайті лише дві JS-бібліотеки.

Продакшн-сценарії

Шлях релізу майже без інфраструктури.

Сайт не лише показує обкладинки: він перетворює нову гру, пітч розробника та медіаконтакт на робочі процеси видавця.

01Новий тайтл → консольна вітринаКожна гра отримує платформено-автентичну сторінку без runtime-застосунку.
  1. Підготувати кінематографічне хіро, обкладинку, історію, фічі й кредити розробника.
  2. Підключити доступні Steam, eShop, Xbox і PlayStation через знайому візуальну мову кожної платформи.
  3. Додати метадані й записи image sitemap та віддати результат через статичну політику кешування Apache.
02Пітч розробника → inbox студіїНативна форма замінює зовнішній сервіс, не додаючи власного сервера.
  1. Розробник обирає до трьох консольних портів і заповнює валідований пітч.
  2. Захищений honeypot-полем маршрут Google Apps Script форматує заявку.
  3. Студія отримує читабельний HTML-лист, готовий до рішення про видавництво.
03Media partner → релізна розсилкаОдна заявка стає повторно використовуваним контактом преси чи інфлуенсера.
  1. Журналіст або автор каналу залишає імʼя, медіа, посилання й контакт на сайті видавця.
  2. Google Apps Script додає профіль у базу преси на основі таблиці.
  3. Відібраний список працює для цільових розсилок ключів, пресасетів, embargo-новин та анонсів релізу.

Інтерактивні превʼю

Від ігрового постера до релізної розсилки.

Перший сценарій відтворює хореографію каталогу, другий показує, як безкоштовні воронки пітчів і media partners живлять робочий inbox та базу розсилок видавця.

R1

Каталог і магазини

Наведіть курсор або фокус на обкладинки, щоб розгорнути бурштинові лінії, а нижче пройдіться чотирма зміщеними кнопками платформ.

Справжні обкладинки · автентична палітра платформСтатичний сайт без фреймворків: самописний CSS, вісім ігор, девʼять хіро-відео та image sitemap — хостинг за копійки.

Цифри

Навмисно мало що хостити й підтримувати.

Ці цифри варто читати навпаки: суть у тому, як мало інфраструктури потрібно повному каталогу й двом робочим воронкам.

виданих ігор / студій-партнерів
8 / 6
Публічний каталог
магазини на один тайтл
4
Максимальне покриття платформ
хіро-відео
9
Каталог та сторінки ігор
серверлес-воронки / хостинг
2 / $0
Google Apps Script
рядків самописного CSS
~1 000
У двох stylesheets

Що це доводить

Простота корисна, коли вона свідома, а не недороблена.

01

Сайт може лишатися статичним

Сильна артдирекція, адаптивність і правильне SEO не вимагають фреймворку чи runtime-сервера.

02

Серверлес там, де потрібен

Два маленькі бекенди форм автоматизують структуровану передачу, не перетворюючи сайт на важкий стек.

03

Ігрова презентація в контексті платформ

Кожен тайтл веде в правильний магазин знайомими кольорами й рухом платформи.