Шукаємо виконавця з досвідом від 3 років з великим портфоліо, який зробить дизайн сайту в figma.
Сайт Інтернет-магазину доставки продуктів харчування власного виробництва (загалом до 200 позицій в 6 продуктових категоріях).
Потрібно відмалювати дизайн сайту у Figma.
Вже є концептуальний вектор, в якому стилі це має бути реалізовано (додаю посилання на скріншоти внизу сторінки).
Весь проєкт розбиваємо на етапи:
- Головна
- Каталог продукції + Картка товару
- Кошик + Кабінет користувача
- Стаціонарні сторінки (про нас, партнерство, контакти, оплата та доставка інфо)
- Блог (новини, рецепти)
👉 На першому етапі (тестове оплачуване завдання) потрібно відмалювати Головну сторінку з хедером та футером.
Після успішного виконання далі будемо рухатись поетапно.
👉У ваших пропозиція вказуйте:
1. ціну та строк виконання 1 етапу (тестового завдання – головна сторінка)
2. орієнтовну (рамкову від… до…) ціну всього проекту (всі сторінки)
Загальна інформація про сайт
Сайт:
- інтернет-магазин продуктів
- власне виробництво
- працює для 3 ЦА:
- роздріб (сім’ї)
- бізнес (опт)
- HoReCa (ресторани)
Структура сайту:
- Головна
- Акції
- Продукція (каталог)
- роздріб (для дому)
- бізнес (опт)
- HoReCa (ресторани)
- Про нас
- Партнерам
- Доставка
- Контакти
- Блог
- Кошик + Оформлення
- Кабінет + Регистрація + Авторизація
Цілі дизайну
- чітко розділити аудиторії
- показати якість продукції
- викликати довіру
- швидко вести до покупки / заявки
- зробити сучасний, «дорогий» вигляд
Концепція
Основна ідея: продукти для кожного формату споживання
Сайт має виглядати як:
- сучасний food-бренд
- виробник (не просто магазин)
- надійний постачальник
______________________________________________________________________________________________
Структура головної сторінки
1. HERO блок (ключовий – вже є наброски по цьому)
- слайдер (3 сценарії)
- таби/аккордеон (перемикання ЦА)
- великий візуал
- текст під ЦА
- CTA кнопка
3 сценарії:
1. СІМ’Я (емоційний, теплий домашній вайб) – доставка для дому
2. БІЗНЕС (стабільність партнерство ) – доставка для торгівельних точок
3. HORECA (професійність якість ) – доставка для ресторанів
Важливо:
- різні кольори для кожної ЦА
- різні CTA
- різні тексти
2. Блок категорій
Мета:
швидкий доступ до відповідного каталогу
Категорії:
- свіже м’ясо
- ковбаси
- делікатеси
- заморожені продукти
- кондитерка
- хліб та випічка
Дизайн:
- карточки категорій
- фото продукту (або іконка категорії) + назва категорії
- hover ефект
3. Переваги
Формат: іконки + текст (текст надається)
4. Популярні товари (або акційні)
Формат: карточки товарів – горизонтальний слайдер
5. Блок B2B (1. для бізнесу 2. HoReCa)
Мета: конверсія B2B
- текст про переваги
- кнопка "Стати партнером"
6. Про виробництво
- Виробництво продуктів харчування – текст+фото
- цех
- процес
- якість
7. Блог / рецепти
- плитка статей
- фото + заголовок
9. Footer
_____________________________________________________________________
Візуальний стиль
Загальний стиль
- світлий фон
- акценти кольором
- багато повітря
- чиста типографіка
Кольори (орієнтир)
- рожевий → сім’я
- синій → бізнес
- помаранчевий → HoReCa
Шрифти
- сучасний гротеск
- хороша читабельність
UI стиль
- округлення
- великі кнопки
- плавні форми
Адаптив
Компоненти (Design System)
У Figma зробити:
- кнопки (всі стани)
- карточки
- таби
- аккордеон
- інпути
- хедер
- футер
UX вимоги
- зрозумілий шлях користувача
- мінімум зайвого
- акцент на CTA
- швидке сканування
Очікуваний результат
- Figma файл
- desktop + mobile
- компоненти
- логічну структуру
Важливо
- це не просто красивий сайт
- це e-commerce + B2B
- дизайн має продавати
Додатково (буде плюсом)
- анімаційні ідеї
- hover сценарії
- UX підказки
Ключове
Дизайн має:
- чітко показувати різні ЦА
- бути сучасним
- викликати довіру
- вести до покупки або заявки
Посилання на начертки:
https://drive.google.com/drive/folders/1MjEO1woIuFv721YdxF8oUdafH1-NfXPD
Всі вихідні тексти та зображення надамо окремо
Behance
