Кейс 02 Портал і спільнота
AniXY: аніме-каталог, що виріс у спільноту з клубами й чатами
Каталог на 3 900 аніме, 45 500 серій і 74 737 персонажів — і соціальний шар навколо нього: списки перегляду, оцінки, друзі, клуби, обговорення конкретних серій. Проєкт, у якому видно, що ми вміємо будувати не сторінки, а продукт, куди люди повертаються щодня.
Скріншоти з робочого сайту anixy.fun ↗
(01) Задача
Що треба було вирішити.
Українських аніме-сайтів багато, але майже всі вони — каталог і нічого більше: подивився серію й пішов. Спільнота при цьому живе десь окремо, у чатах, які ніяк не звʼязані з тим, що людина дивиться.
Задача була зʼєднати ці дві половини в одному продукті:
- каталог, який не соромно показати: тисячі тайтлів, персонажі, розклад онгоїнгів, манґа з розділами;
- соціальний шар навколо нього — списки перегляду, оцінки, друзі, клуби за інтересами, обговорення конкретних серій;
- причина повертатися щодня, а не раз на сезон: досвід за активність, ранги, досягнення, внутрішня валюта.
Окрема складність — масштаб контенту. Десятки тисяч сторінок, які мусять швидко відкриватись, коректно потрапляти в пошук і лишатися керованими: тайтли, серії, персонажі, розділи манґи, команди озвучення, новини.
(02) Рішення
Швидкий інтерфейс на React і надійна основа на Laravel — з повноцінним SEO попри те, що це застосунок.
Інтерфейс зібрано на React: переходи між розділами миттєві, без перезавантаження сторінки. Дані й уся логіка — на Laravel. Для користувача це відчувається як застосунок, а не як сайт.
Каталог, у якому легко знайти своє
Пошук по тайтлах і людях, фільтри за жанром, роком, студією і статусом, окремі добірки й топи. Сторінка тайтлу збирає все в одному екрані: опис, рейтинги, персонажі, команди озвучення, посилання на зовнішні бази. Розклад онгоїнгів показує свіжі серії за днями виходу, а манґа має власну читалку з памʼяттю прогресу.
Спільнота, а не коментарі під відео
Списки перегляду й оцінки, друзі, приватні повідомлення, живий чат, стрічка постів з опитуваннями. Клуби за інтересами — зі своїм чатом, альбомами, подіями і модерацією. Зверху — гейміфікація: досвід за активність, ранги, досягнення, монети, магазин і реферальна програма. І покрокова гра за мотивами «Наруто» як окремий світ усередині сайту.
SEO для сайту-застосунку
Застосунки на React зазвичай провалюються в пошуку: робот бачить порожню сторінку замість контенту. Тут сервер віддає роботу готову сторінку з усіма мета-даними й розміткою ще до того, як завантажиться інтерфейс, — тож десятки тисяч сторінок каталогу нормально індексуються. Плюс окремі карти сайту під кожен тип контенту й акуратні редиректи, які не втрачають посилання при зміні адрес.
Захист без reCAPTCHA
Реєстрацію боти люблять найбільше. Замість капчі, яка дратує живих людей, — невидимі перевірки на боці форми: поле, яке заповнює тільки скрипт, і контроль часу заповнення. Той самий підхід ми використовуємо на клієнтських сайтах: жодних «виберіть усі світлофори».
Як це виглядає в роботі.
Цифри, які має цей проєкт.
У вас складніша задача, ніж «сайт із сторінками»?
Портал, кабінет користувача, внутрішня система — розкажіть, що має вміти продукт, і ми покажемо, як це зібрати.