Розробка сайту компанії Гарант Плюс Буд

Завдання

• оновлення дизайну сайту згідно з новим візуальним стилем бренду;
• створення онлайн-каталогу з деталізацією продуктів компанії;
• презентація реалізованих проєктів Гарант Плюс Буд;
• покращення користувацького досвіду (UX).

Що було зроблено

Етап дизайну:

• вивчили сайти провідних виробників бруківки в регіоні, щоб виявити найкращі практики та тенденції;
• провели аудит поточного сайту “Гарант Плюс Буд”, щоб визначити сильні та слабкі сторони;
• провели інтерв’ю з клієнтом, щоб зрозуміти потреби та очікування.
• розробили інтуїтивно зрозумілу навігацію сайту з чіткими категоріями та підкатегоріями товарів;
• оформили колірну гаму, шрифти та графічні елементи згідно з оновленим візуальним стилем компанії;
• створили зручний калькулятор для розрахунку вартості бруківки;
• додали швидкий доступ до ключових розділів, таких як послуги, реалізовані проєкти, блог з корисною інформацією і контакти компанії та партнерів;
• взяли участь у розробці всіх необхідних візуалів для продукції Гарант Плюс Буд.

Етап розробки:

• розмітка HTML для усіх основних сторінок сайту та використання CSS для стилізації основних елементів сайту;
• забезпечили адаптивність сайту для різних розмірів екранів (мобільні пристрої, планшети, десктопи);
• додали інтерактивні елементи за допомогою JavaScript, таких як: слайдери, модальні вікна, акордеони, підказки тощо;
• створили інтерактивний та зручний калькулятор для обчислення заданих параметрів користувача за допомогою JavaScript;
• реалізували корзину покупок з використанням Web APIs localStorage для збереження обраних товарів між сеансами браузера;
• розробили кастомну тему для сайту за допомогою CMS WordPress;
• використали редактор Gutenberg для створення та редагування блоків контенту;
• створили кастомні фільтри для товарів з використанням JavaScript та PHP, що дозволяють користувачам швидко знаходити потрібні товари за різними критеріями. Реалізували динамічне оновлення списку товарів відповідно до вибраних користувачем фільтрів без перезавантаження сторінки;
• налаштували інтеграцію з Telegram API для відправки повідомлень з форм зворотного зв’язку та замовлень;
• реалізували відображення інтерактивної карти на сторінках сайту за допомогою Google Maps API;
• впровадили додавання на карту маркерів, які позначають місця розташування представництв в регіонах України;
• додали інформаційні вікна для маркерів, які містять детальну інформацію про кожен магазин (назва, адреса, контактна інформація, посилання на маршрут);
• додали функціонал фільтрації точок представництв по області;
• встановили та налаштували необхідні плагіни для покращення функціоналу сайту (ACF, SEO, безпека, кешування).