Играть онлайн: https://klimaleksus.github.io/FindTwin/FindTwin.html
English readme is HERE
Чтобы скачать игру, просто клонируйте этот репозиторий.
Это простая игра, в которой вам нужно искать одинаковую картинку среди других похожих картинок.
Она написана на Javascript, и работает в браузере.
Любой современный компьютерный или мобильный браузер (проверены: Opera 12 и 36; Firefox 19 и 47; Chrome 30 и 49; стандартные браузеры Android 5 и iOS 12; не работает в Windows Internet Explorer и Anrdoid HTMLView). Также, поскольку картинки загружаются из интернета, игра потребляет трафик.
Игра оптимизирована под любой экран и соотношение сторон.
Чтобы поиграть, вам нужна мышка либо тач-скрин.
Если у вас отобразилось главное меню (вместо надписи «This game requires Javascript and modern browser!»), просто нажмите «PLAY». Вы увидите сетку из разных изображений.
Когда все они появятся, всё покроется серым, и игра начнётся.
Во-первых, убедитесь что у вас включено отображение картинок в браузере (на случай, если вы принудительно отключали его).
Во-вторых, попробуйте обновить страницу и выбрать другой источник картинок вместо «Default». Например «Random» или «TWDNE».
В-третьих, проверьте javascript-консоль браузера, и посмотрите на ошибки там. Особенно строчки Image error … – попробуйте открыть эти ссылки напрямую, и посмотрите, получится ли.
Перемещайте мышку над ячейками сетки. Каждая картинка под курсором станет видимой, а другие медленно исчезнут.
(На мобильных устройствах, можете нажать и держать палец на изображениях)
Ищите «близняшек» – то есть, одинаковые картинки, повторяющиеся дважды. Но смотрите, вторая копия будет отражённой!
Просто кликните/нажмите на каждую копию. Вы заметите белую границу вокруг прошлой выделенной ячейки.
Также, вы можете нажать-держать-тащить и отпустить мышь от одной ячейки до другой, сделав на один клик меньше. Работает и на тач-скрине.
Да сколько хотите! Игра бесконечная.
Когда новых изображений в базе больше нет, она начнёт повторно показывать предыдущие.
Не-а. Но есть статистика: ваш текущий счёт и общее время.
Она отображается в заголовке страницы (и не стирается сразу при возвращении в меню).
Нет. Просто потому что, в такой игре, обмануть будет элементарно.
Но вы же всё ещё можете посоревноваться в неё со своим братом-близнецом, или хотя бы с другом!
Нельзя. (Да и всё равно, в фоновом режиме она не потребляет много ЦП)
Чтобы вернуться в меню, нажмите Escape, или кнопку «Назад» в браузере (должно работать и на смартфонах).
При каждой новой игре, все картинки перемешиваются.
Это как раз самое интересное!
Моя стандартная база картинок – это часть потрясающей коллекции «This Waifu Does Not Exist»: https://www.thiswaifudoesnotexist.net/
Только 250 из них загружены сюда, но ещё 10 000 доступны из меню.
Это базы изображений:
Таким образом, все картинки из Random, Normal, Weird и Good залиты на http://klimaleksus2.ucoz.ru/waifu/…
Там 10 000 изображений (10% от TWDNE), все разные, сконвертированы в 256×256 для целей игры, общим объёмом в 167 Мб. Номер оригинального образца не сохранён.
Ну-с, можете отключить затухание, тогда сможете видеть сразу все картинки одновременно. Просто уберите флажок «Fade» в меню.
А ещё можете сделать сетку меньше. В меню, поменяйте 6×6 например до 3×3.
Можете выключить флажок «Animate» в меню (сохраняя игровые эффекты, но убирая частичную прозрачность кроме 50% полупрозрачной; также, не будет анимации увеличения картинок).
Не выбирайте коллекцию «TWDNE», ведь там все образцы в 1024×1024, а это слишком громоздко для такой обработки.
Ну и попробуйте другой браузер, или закройте другие вкладки, и т.д.
Да. Это же просто одностраничный HTML файл, его можно сохранить на жёсткий диск. Игра всё ещё сможет подгружать картинки из интернета, потому что они внедрены как IMG теги, а не типа HTML5 Canvas.
Ой, вы в смысле, вообще без доступа в интернет? Ладно, если у вас есть все картинки локально.
Проще всего будет положить вашу коллекцию картинок в подпапку каталога с игрой, и запустить «local_waifus.bat» (или «local_waifus.sh») чтобы создать local_waifus.js с именами файлов в JSON формате.
Файл local_waifus.js будет автоматически загружен из текущей директории, и названия ваших папок сами появятся в игровом меню (налево от базы по умолчанию).
Я выкачал их напрямую с TWDNE (и сконвертировал в 256×256 командой ffmpeg -i %i -vf scale="256:-1" -q:v 5 _%~ni.jpg), но вы можете сразу скачать уже сконвертированные мною копии здесь:
Каждый из этих архивов (RAR4) также содержит собственный “local_waifus.js” с именами файлов. Если вы скачаете несколько источников, то лучше возьмите этот скомбинированный файл (а ещё там копия и самой игры).
БОНУС: номер оригинального образца сохранён на каждом файле!
Первый способ – это использовать «локальный» подход, чтобы заполнить JSON полными ссылками вместо имён файлов.
Второй вариант – напрямую отредактировать .html-файл игры, и добавить собственную функцию в waifu_provider() → providers: (самое начало кода). Смотрите на существующие функции; ваша функция должна вернуть URL картинки по её порядковому номеру (и общее число доступных картинок, когда на вход передано «-1»).
Не скачивается.
Отражение сделано средствами CSS transform: scaleX(-1). Вторая копия каждого изображения делается через HTML .cloneNode(), то есть она не должна скачаться заново (даже если браузерная консоль это показывает), ведь браузер возьмёт закешированную версию.
Игра продолжит пытаться качать разные картинки из базы, пока у неё не получится. (Иногда она может начать брать старые из вашего кеша)
Когда вы на текущий момент остались без картинок, вместо них останутся серые ячейки, но они заполнятся сразу как восстановится интернет.
Игра хранит небольшой внутренний кеш предзагруженных изображений зарнее.
Она начнёт повторять одни и те же картинки несколько раз.
Тем не менее, вы можете соединять любую пару одинаковых изображений, даже те, которые не отражены.
Верно. Для пущей красоты, сетка на экране адаптируется под текущее соотношение сторон, и не всегда сохраняет одинаковое количество ячеек. Но разница всегда не больше 4.
Когда в текущем виде показывается меньше ячеек, чем максимальное количество для всей сетки, некоторые картинки скрыты с экрана. Но через несколько успешных объединений близняшек, есть шанс что одна из них будет обменяна местами с одним из новых появляющихся изображений. Так что вы ничего не упустите!
Конечно, это простая математика: каждая комбинация освобождает две ячейки; одна из них используется под совершенно новую картинку, а вторая станет близняшкой для одной из одиноких картинок.
Таким образом, у вас всегда будет одно и тоже количество пар на экране. Исключение лишь «скрытые» клетки (описанные выше), поэтому реальное число может слегка меняться, особенно на малых сетках.
Вообще, половина всех картинок – близняшки (то есть, 1/4 изображений имеют пару).
Ну, не официально. Думаю, в огромных сетках мало смысла, ведь все картинки станут очень маленькими; а ещё это снижает производительность.
Кстати, все подогнанные размеры сеток вычислены и выбраны вручную. Я сам собрал массив правильных размерностей, он хранится в function game_options (минимум и максимум размеров заданы в function board_resize ниже; сейчас 3 и 10).
Если вам вправду требуется определённый размер, просто меняйте код игры.
Я сделал её, после того как увидел вот эту вдохновенную картинку: thiswaifudoesnotexist-100samples.jpg (зеркало), просто так, за 4 дня.
Моей первой целью было использовать эти картинки, сгенерированные ИИ, в игре. Ведь это один из очевидных способов применения подобной базы.
Моей второй целью было сделать эту игру максимально кроссплатформенной, под любое устройство и размер экрана.
И третья цель – чтобы игра принимала любые изображения, а не только эти. Чтобы её можно было использовать как интерактивную демонстрацию других образцов картинок, сгенерированных или нет.
Это вряд ли. Но в любом случае, связаться со мной можно по aleksusklim@gmail.com
WTFPL, всегда.
Возьмите этот каноничный URL: https://klimaleksus.github.io/FindTwin/
