Кейс №3: Литературный конкурс Cappo
Кратко
Заказчик
Частное лицо
Продукт
Cappo — сайт литературного конкурса
Моя роль
Продакт дизайнер
Какие были задачи
- Придумать дизайн-концепцию и бренд международного литературного конкурса
- Разработать дизайн сайта
- Продумать логику пути пользователя и логику сбора работ на конкурс
- Сверстать сайт и заложить логику
- Локализовать сайт на четыре локали
- Реализовать возможность оплат для разных регионов
Что сделано
- Разработана концепция, бренд и стайлгайды для конкурса
- Свёрстан сайт на Tilda
- Заложена логика регистрации, авторизации участников, приёма конкурсных работ
- Заложены четыре локали: RU, EN, IT, FR
- Реализована возможность оплаты тремя разными способами
- Продумана логика сбора взносов за участие
Результат
Реализован сайт, полностью обслуживающий процессы международного литературного конкурса. Сайт позволяет участникам регистрироваться, оплачивать взносы за участие, отправлять свои работы на рассмотрение комиссией, читать работы других участников.
Администраторы и комиссия конкурса получает уведомления о новых конкурсных работах в бота Telegram, все работы собираются на Google Drive и в TildaCRM, оплаты проходят тремя разными способами. Сайт в дальнейшем будет функционировать сезонно — темы конкурса будут меняться, а библиотека работ расширяться.
Администраторы и комиссия конкурса получает уведомления о новых конкурсных работах в бота Telegram, все работы собираются на Google Drive и в TildaCRM, оплаты проходят тремя разными способами. Сайт в дальнейшем будет функционировать сезонно — темы конкурса будут меняться, а библиотека работ расширяться.
Не кратко
Ситуация
Заказчик пришёл с идеей создать международное сообщество для любителей писательства, где участники могли бы обмениваться опытом, читать и публиковать рассказы разных жанров и участвовать в конкурсах с ценными призами. Призовой фонд формируется за счёт взносов участников, и для подачи рассказа на конкурс необходимо внести небольшой взнос. Победителей определяет жюри, состоящее из опытных литераторов. Проект был задуман как международная платформа, поддерживающая четыре языка: русский, английский, итальянский и французский. Особое внимание уделялось французским и итальянским элементам, так как заказчик проживает во Франции и активно взаимодействует с коллегами из Италии.
Задача
Разработать сайт для международного литературного конкурса.
Основные подзадачи:
Основные подзадачи:
- Создание визуальной концепции бренда и разработка стайл-гайда,
- Проектирование пользовательского пути от регистрации до отправки рассказа,
- Обеспечение удобной навигации и функциональности сайта,
- Подключение различных способов оплаты,
- Локализация контента,
- Обеспечение лёгкого управления контентом для администраторов.
Действие № 1: Определение объёма задач и сроки
Заказчик хотел начать раскрутку проекта до конца года. Учитывая это, на первом этапе было решено сосредоточиться на запуске конкурса, отказавшись от создания полноценного сообщества. Платформа должна поддерживать четыре языковые локали (русский, английский, французский, итальянский) и три способа оплаты: один для России, другой для зарубежных пользователей, и третий — оплата криптовалютой. Всё это должно быть в единой и консистентной дизайн-обёртке.
Я предложил:
Я предложил:
- Использовать Tilda: так мы и успеем в срок и охватим нужный функционал.
- С учётом ограниченного времени отказаться от макетирования.
- Для простого контента взять базовые блоки конструктора, а ключевые элементы создал с помощью Zero-блоков.
- Разбить функционал последовательные блоки: регистрация, внесение вступительных взносов, подача работ на конкурс, возможность делиться или скрывать свои работы.
Действие № 2: Дизайн-концепция и бренд
Первым шагом стало создание концепции бренда и стайл-гайдов для конкурса, который получил рабочее название Cappo (сокращение от «Капучино»). Я исследовал происхождение этого слова и, опираясь на его значение, собрал мудборд с помощью нейросетей, чтобы отразить ключевые настроения проекта. Дизайн должен был передавать атмосферу дружелюбия, уюта и ощущение «кофе-брейка» в кругу единомышленников, но при этом иметь нотку статности, напоминая закрытые клубы в Великобритании.
Итоговый логотип представляет собой две кофейные чашки, соединённые волнистой линией, которая образует букву «Т» — символ текста. Чашки символизируют дружбу и общность, а сочетание коричневого и синего цветов подчёркивает идею контраста. Логотип был дополнен эффектом зернистости для придания винтажного стиля. Все элементы дизайна были собраны в стайл-гайд и отправлены заказчику, который быстро утвердил концепцию.
Действие № 3: Разработка сайта на Tilda
Дизайн сайта разрабатывался сразу в Tilda без предварительных макетов. Основной акцент был сделан на функциональности — оплаты и локализация стали приоритетами. Главный экран и меню были созданы с помощью Zero-блоков в бенто-дизайне с крупными акцентными кнопками. Сначала заказчика смутили размеры элементов, но после демонстрации рефернсов он принял концепт.
Иконки были стилизованы под обожжённую глиняную игрушку с мягкими формами и пастельными цветами. Эти иконки будут меняться в зависимости от темы конкурса, поэтому я отдельно сохранил промпт для их генерации.
Иконки были стилизованы под обожжённую глиняную игрушку с мягкими формами и пастельными цветами. Эти иконки будут меняться в зависимости от темы конкурса, поэтому я отдельно сохранил промпт для их генерации.
Информационные блоки, рассказывающие о правилах конкурса, работах участников и призах, были реализованы с помощью стандартных блоков Tilda. Работы участников и новости были добавлены через функцию потоков, что позволяет администраторам легко добавлять новые посты. Для каждой локали были созданы отдельные потоки, чтобы не смешивать контент на разных языках.
Действие № 4: Процесс подачи заявки и регистрации
Одной из сложнейших задач было создание бесшовного процесса регистрации, оплаты и подачи рассказов. Сайт автоматически определяет язык браузера или геопозицию пользователя и перенаправляет его на соответствующую локаль (Россия, Италия и т.д.), что позволяет настроить интерфейс и методы оплаты под нужную аудиторию. В Tilda настроены правила перенаправления, чтобы обеспечить плавный переход между локалями.
Для каждой локали доступны три способа оплаты: один для российских пользователей, другой для международных и оплата криптовалютой, что делает процесс удобным для участников из разных стран.
Для каждой локали доступны три способа оплаты: один для российских пользователей, другой для международных и оплата криптовалютой, что делает процесс удобным для участников из разных стран.
После нескольких итераций я разработал оптимальный сценарий, который выглядит следующим образом:
- Знакомство и регистрация: пользователь заходит на сайт, знакомится с информацией и нажимает «Участвовать». Система перенаправляет его на страницу регистрации, соответствующую его локали. После регистрации он попадает в нужную группу и видит страницу с подтверждением данных и кнопкой для внесения взноса.
- Оплата участия: пользователь выбирает один из трёх способов оплаты. После успешного платежа его перенаправляют на страницу успеха с повторной идентификацией (авторизация + локаль).
- Подача рассказа: при корректной авторизации и оплате пользователь получает доступ к форме подачи рассказа. Он загружает файл, добавляет комментарии, соглашается на обработку данных и выбирает, публиковать ли рассказ на сайте. После отправки работы он может вернуться на главную страницу или завершить процесс.
- Управление заявками: каждая заявка получает уникальный идентификатор, который сверяется с идентификатором оплаты, что обеспечивает безопасность. Все данные автоматически загружаются в CRM Tilda, а администраторам поступает уведомление в Telegram. Файлы рассказов хранятся на защищённом Google Диске.
Действие № 5: Думаем о скам-тревожности
После первого обсуждения возникла ключевая проблема: как избежать восприятия сервиса как скама. Мы решили эту задачу следующим образом:
- Визуальный дизайн: сайт оформлен аккуратно и прозрачно, чтобы избежать ощущения проекта «на коленке», который может исчезнуть после получения средств.
- Официальные методы оплаты: реализованы три способа оплаты, каждый с юридической поддержкой. Для России было создано отдельное юрлицо, данные которого можно проверить в реестре. Международные платежи проходят через юрлицо в Италии, что подтверждено соответствующими документами.
- Юридическая легитимность: заказчик предоставил нотариально заверенное разрешение от итальянских госорганов на проведение подобных конкурсов, что укрепляет доверие к проекту.
- Прозрачная информация: на сайте есть статья с детальным описанием конкурса, ссылками на политику конфиденциальности и контактами. Публикация рассказов участников помогает создать ощущение активного и надёжного сообщества.
- Гарантированный возврат: предусмотрена возможность возврата средств, если призовой фонд не будет собран, что повышает уверенность пользователей.
- Небольшие взносы: сумма взноса установлена на уровне, который не вызывает сомнений при принятии решения об участии.
Результат
Сайт готов, системы оплаты подключены, локализация произведена. Процессы оплаты протестированы для всех трёх способов. Проект принят заказчиком.
На данный момент времени заказчик закрывает последние юридические вопросы и дооформляет документы, после чего юр. Данные будут внесены на сайт и он пойдёт в релиз.
На данный момент времени заказчик закрывает последние юридические вопросы и дооформляет документы, после чего юр. Данные будут внесены на сайт и он пойдёт в релиз.
Связаться со мной
Отсюда через форму
Denya Design,
©
Другими способами
