Интернет-магазин Goldfish

1. Вводная задача от заказчика, проблематика, цели

Наша задача состояла не столько в проектировании интернет-магазина, сколько в детальной проработке сервиса для быстрого и удобного поиска и фильтрации карточек, понятного и простого для очень специфической целевой аудитории — фанатов игры.

Необходимо было создать актуальную базу всех когда-либо выпущенных карточек игры Magic: The Gathering в удобном интерфейсе, отражающем необходимые параметры, а также собрать подходящую систему фильтров.

2. Описание реализации кейса и творческого пути по поиску оптимального решения

Каждая из нескольких сотен тысяч карточек, выпущенных за 18 лет существования игры, обладает особым набором характеристик. Необходимые нам мы взяли через API из фанатской базы Scryfall. Там же мы обнаружили все параметры выпущенных карточек.

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

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

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

С ID авторов-иллюстраторов тоже возникла проблема — в API они не отображались корректно, и нам пришлось отдельно придумывать как связать поля, чтобы поиск по художникам заработал. В итоге для отладки поиска мы решили сопоставлять художников скриптом.

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

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

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

В интерфейсе есть несколько вариантов действия: «Купить», «Заказать поиск» (если карточки нет в наличии), «Оформить предзаказ» (если карточка еще не вышла). Этот параметр, а также состояние физической карточки продавец настраивает самостоятельно в режима администратора.

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

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

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

3. Результаты сотрудничества

После долгих доработок, оптимизации поисковых алгоритмов и фильтров нам удалось запустить кастомный интернет-магазин Goldfish, который прежде всего стал удобным сервисом для поиска актуальной информации и цен на все когда-либо выпущенные карточки, некоторые из которых можно купить в один клик. Такой подход обеспечил дополнительный трафик пользователей — фанатов, которые прежде всего ищут актуальную информацию о карточках, а уже потом, при случае, их покупают.

Больше всего времени мы потратили на точечную проработку проблем, возникших при поиске и фильтрации пересекающихся параметров.

Сегодня сервис Goldfish уже помогает фанатам игры в России пополнять свои коллекции.