Розробка дизайну для блогу
Яка основна мета має виконувати блог?
Професійний блог у галузі освітлення, LED-технологій, автоматизації та монтажу проектів.
Мета — надавати експертний контент для широкої та професійної аудиторії, інформувати про рішення, навчати та мотивувати до взаємодії з інтернет-магазином, формувати довіру та стимулювати заявки.
Який стиль дизайну ви віддаєте перевагу?
мінімалістичний
модний і сучасний
корпоративний
Приклад: сучасний корпоративний стиль з елементами мінімалізму та акцентом на візуальний контент, структурованість, читабельність і довірливий UX.
⚠️ Важливо: дизайн блогу має бути візуально узгоджений з основним сайтом інтернет-магазину LEDStore (ASSE). Шрифти, кнопки, відступи, поведінка інтерактивних елементів — мають бути стилістично сумісними.
Які основні розділи або функції мають бути на блозі?
Головна сторінка блогу
Сторінка статті
Фільтрація за категоріями
Пошук по записах
Бічна панель з віджетами: підписка, категорії, популярне
Блоки “Рекомендуємо” та “Популярні матеріали”
Форма підписки
Коментарі (за бажанням)
CTA: «Записатися на консультацію», «Завантажити чеклист»
Адаптивність під пристрої
Яку кольорову палітру та шрифти ви хочете використовувати?
Кольори:
Фон:
#FDFDFDТекст:
#2A2A2AБрендовий акцент:
#C69D6D(колір логотипу блогу)Додатковий акцент:
#0066FF(якщо застосовно в рамках поточного дизайну)
Шрифти:
Основний: Inter або Roboto
Ті ж, що й в інтернет-магазині (якщо відрізняються — дотримуватися їх)
Які елементи дизайну мають бути на головній сторінці?
Слайдер / Hero-блок з обраними статтями
Горизонтальний список категорій
Мережа карток постів (thumbnail, заголовок, дата, автор, короткий опис)
Блок “Популярні статті”
Рекомендовані статті
Бокова колонка з віджетами
CTA-блок внизу (наприклад: «Отримайте безкоштовну консультацію»)
Чи мають зображення та відео бути частиною дизайну?
Так.
Приклад:
Великі зображення у картках та вгорі статей
Підтримка вставки відео, галерей, схем монтажу
Можливість міні-галерей та технічних прев’ю у статтях
Який адаптивний дизайн потрібен?
Приклад: Повноцінна адаптація:
Десктоп (≥1280px)
Планшети (≥768px)
Смартфони (≥320px)
Мобільна версія з вертикальною логікою, swipe-слайдером, дропдауном категорій, доступною навігацією.
Чи є приклади блогів, які вам подобаються?
https://jnews.io/default/ — базова логіка відображення контенту
Вкажіть будь-яку додаткову інформацію, яку вважаєте важливою.
Дизайн має бути виконаний у Figma
Ознайомитися з блогом https://ledstore.fi/blog
Важливо: блог — частина інтернет-магазину LEDStore https://ledstore.fi, дизайн має бути узгоджений з візуальною системою магазину
Потрібно підготувати:
Головну сторінку блогу (десктоп + моб)
Сторінку статті (десктоп + моб)
UI Kit: кнопки, кольори, картки, форми, іконки, типографіка
Дизайн буде впроваджений у фронтенд на Svelte, дані надходять через REST API з WordPress
Компоненти мають бути модульними та легко переносимими у верстку
Какую основную цель должен выполнять блог?
Профессиональный блог в области освещения, LED-технологий, автоматизации и проектного монтажа.
Цель — предоставлять экспертный контент для широкой и профессиональной аудитории, информировать о решениях, обучать и мотивировать к взаимодействию с интернет-магазином, формировать доверие и стимулировать заявки.
Какой стиль дизайна вы предпочитаете?
минималистичный
модный и современный
корпоративный
Пример: Современный корпоративный стиль с элементами минимализма и акцентом на визуальный контент, структурность, читаемость и доверительный UX.
⚠️ Важно: дизайн блога должен быть визуально согласован с основным сайтом интернет-магазина LEDStore (ASSE). Шрифты, кнопки, отступы, поведение интерактивных элементов — должны быть стилистически совместимыми.
Какие основные разделы или функции должны быть на блоге?
Главная страница блога
Страница статьи
Фильтрация по категориям
Поиск по записям
Sidebar с виджетами: подписка, категории, популярное
Блоки “Рекомендуем” и “Популярные материалы”
Форма подписки
Комментарии (по желанию)
CTA: «Записаться на консультацию», «Скачать чеклист»
Адаптивность под устройства
Какую цветовую палитру и шрифты вы хотите использовать?
Цвета:
Фон:
#FDFDFDТекст:
#2A2A2AБрендовый акцент:
#C69D6D(цвет логотипа блога)Доп. акцент:
#0066FF(если применим в рамках текущего дизайна)
Шрифты:
Основной: Inter или Roboto
Те же, что и в интернет-магазине (если отличны — придерживаться их)
Какие элементы дизайна должны быть на главной странице?
Слайдер / Hero-блок с избранными статьями
Горизонтальный список категорий
Сетка карточек постов (thumbnail, заголовок, дата, автор, краткое описание)
Блок “Популярные статьи”
Рекомендованные статьи
Боковая колонка с виджетами
CTA-блок внизу (например: «Получите бесплатную консультацию»)
Должны ли изображения и видео быть частью дизайна?
Да.
Пример:
Крупные изображения в карточках и вверху статей
Поддержка вставки видео, галерей, схем монтажа
Возможность мини-галерей и тех. превью в статьях
Какой адаптивный дизайн нужен?
Пример: Полноценная адаптация:
Десктоп (≥1280px)
Планшеты (≥768px)
Смартфоны (≥320px)
Мобильная версия с вертикальной логикой, swipe-слайдером, дропдауном категорий, доступной навигацией.
Есть ли примеры блогов, которые вам нравятся?
https://jnews.io/default/ — базовая логика отображения контента
Укажите любую дополнительную информацию, которую вы считаете важной.
Дизайн должен быть выполнен в Figma
Ознакомиться с блогом https://ledstore.fi/blog
Важно: блог — часть интернет-магазина LEDStore https://ledstore.fi, дизайн должен быть согласован с визуальной системой магазина
Необходимо подготовить:
Главную страницу блога (десктоп + моб)
Страницу статьи (десктоп + моб)
UI Kit: кнопки, цвета, карточки, формы, иконки, типографика
Дизайн будет внедряться во фронтенд на Svelte, данные приходят по REST API из WordPress
Компоненты должны быть модульными и легко переносимыми в верстку