Задача
Ко мне обратился директор сети «Шаверма бар». Необходимо было разработать интернет-магазин компании с подробным описанием товаров, формой заказа и подключением платежной системы для оплаты.
Так же важным аспектом было удобство посетителя сайта, чтобы пользователь мог максимально быстро и легко сделать заказ
Так же важным аспектом было удобство посетителя сайта, чтобы пользователь мог максимально быстро и легко сделать заказ
Результат
- разработан интернет-магазин;
- добавлено 110 товаров;
- подключена платежная система PayKeeper;
- настроена базовая SEO - оптимизация.
Запуск сайта: 14.07.2023 г.
Шрифт и цвета
Для заголовков и текста был выбран шрифт Nunito для соответствия с имеющимся логотипом.
Корпоративные цвета черный и желтый использовались в дизайне сайта как основной и второстепенный соответственно. Так же был добавлен оранжевый цвет, как акцентный. Акцентный цвет использовался для иконок, лейбла и количества товара в корзине
Корпоративные цвета черный и желтый использовались в дизайне сайта как основной и второстепенный соответственно. Так же был добавлен оранжевый цвет, как акцентный. Акцентный цвет использовался для иконок, лейбла и количества товара в корзине
Логотип
#FDCF01
#FF5C00
#131313
Фотоконтент
У заказчика было подготовлено множество профессиональных фото, отснятых специально для меню. Эти изображения стали основой дизайна, задали настроение всему сайту и значительно упростили работу над макетом, сделав его ярким и аппетитным
Особенности проекта: модификации
На момент разработки сайта (июль 2023 г.), создать интернет-магазин с тёмной темой на платформе Тильда стандартными решениями было нельзя. Фон окна корзины оставался белым (большая проблема, учитывая, что весь сайт на темном фоне, а шрифт — жёлтый).
Поэтому был написан программный код, чтобы поменять стили. Так же были добавлены модификации для карточек товаров. Всего было использовано более 10 модификаций, несмотря на то, что главная страница сайта имеет очень небольшое количество смысловых блоков (5 шт, включая шапку и подвал).
Ниже представлены изображения стандартных блоков в двух вариантах: без каких-либо изменений и с применением CSS-модификаций
Поэтому был написан программный код, чтобы поменять стили. Так же были добавлены модификации для карточек товаров. Всего было использовано более 10 модификаций, несмотря на то, что главная страница сайта имеет очень небольшое количество смысловых блоков (5 шт, включая шапку и подвал).
Ниже представлены изображения стандартных блоков в двух вариантах: без каких-либо изменений и с применением CSS-модификаций
Юридические страницы
Помимо обязательных страниц с политикой конфиденциальности и ошибкой 404, для интернет-магазина были предусмотрены дополнительные разделы: «Доставка и оплата» и договор оферты. Эти страницы необходимы для корректной работы сайта, соблюдения требований и информирования пользователей
Подключение платёжной системы
Для реализации онлайн-оплаты на сайте была подключена платёжная система PayKeeper (партнёр Альфа-Банка). В рамках интеграции на сайте также были размещены логотипы международных платёжных систем, что является обязательным требованием и дополнительно повышает доверие со стороны пользователей
Весёлая страница с ошибкой 404
Я люблю делать 404-ю страницу неформальной и с характером. В этом проекте фотосессия в кафе дала отличную базу для креатива: благодаря готовым фотографиям получилось легко создать яркий и запоминающийся визуал
Результат работы: проект завершён
Несмотря на то, что дизайн был реализован достаточно легко, техническая часть проекта потребовала более глубокой проработки. Этот кейс наглядно показывает, как с помощью модификаций можно значительно расширить стандартные возможности Tilda. В результате был создан полноценный инструмент для приёма заказов, который одновременно усиливает имидж компании
