Потрібно внести правки в існуючий дизайн сайту, покращити візуальну частину та довести його до єдиного сучасного преміального стилю.
На даний момент близько 85% сайту вже готово — структура, сторінки та логіка реалізовані.
Основна задача — дизайн-опрацювання, покращення та уніфікація стилю без кардинальних змін структури.
Основний фокус — мобільна версія.
Посилання на Figma: https://www.figma.com/design/eSlaWQ85UulGPLKe5OoQiS/Express-Bean-1
- Загальний стиль сайту
Потрібно зробити дизайн більш цілісним, сучасним та преміальним.
Шрифт
Шрифт вже використовується, і базова ієрархія є.
Потрібно:
- перевірити ієрархію (розміри, товщини, відступи)
- дати рекомендації та покращити
- врахувати наші побажання
Також запропонувати 1–2 альтернативи, якщо це покращить дизайн.
Кольори
Основні кольори вже визначені:
- зелений (як у логотипі — для кнопок і акцентів)
- білий (для тексту і світлих блоків)
- темно-сірий / графіт (для фону)
Потрібно:
- зробити чітку систему кольорів
- визначити точні відтінки
- показати, де який колір використовується
Важливо
Ми поки що не визначилися зі стилем:
Варіант 1: темний сайт (графіт + білий текст)
Варіант 2: світлий сайт (білий + темний текст)
Потрібно:
- порадити найкращий варіант
- або показати 1–2 приклади
Орієнтир по стилю:
https://www.rijo42.co.uk
- Main page та Machines page
Сторінки вже є, потрібно покращити вигляд.
Що зробити:
- зробити фон більш “живим” (текстура, градієнт — матеріали є)
- покращити подачу машин
- зробити дизайн більш преміальним
Куби під машинами:
- інтегрувати в сцену
- додати тіні і глибину
- зробити вигляд як студійна презентація
- Sectors page
Що зробити:
- Редизайн сторінки:
- варіант з трьома машинами (приклад 3.1 прикріплений):
центр — Cafféra P3
зліва — Cafféra F1
справа — Cafféra P5 - або варіант з однією машиною (Cafféra P3) і тематичним фоном (офіс або кафе)
Потрібно спробувати обидва варіанти.
- Підібрати фото для сектора Vending Operators.
За потреби покращити фото для інших секторів (особливо Restaurant).
- Case studies
Головна сторінка:
- Редизайн сторінки
- кнопку “Read the full case study” замінити на “Find Out More”
- зробити горизонтальний скрол (5 кейсів)
Сторінка кейсу:
Структура (приклад 4.2):
Референс:
https://www.liquidline.co.uk/case-studies
Питання:
- де краще розмістити логотип клієнта
- Нижній CTA блок
Потрібен редизайн.
Що зробити:
- зробити як контактну форму (аналог існуючої по наповненню, але з іншим дизайном)
- додати кнопку Call Us Now
- прибрати Book a Demo
Стиль:
- простий
- чистий
- викликає довіру
- Machines page (Featured Models)
Що зробити:
- машини не повинні “висіти”
- додати куби / підставки
- узгодити з загальним стилем
- Machine categories
Сторінки:
- Bean to cup
- Coffee to go
- Hot chocolate
- Tea
- Payment systems
Що зробити:
- зробити редизайн сторінок без зміни структури
- привести до єдиного стилю
- прибрати зайві елементи
- Our Range (на категоріях) (приклад 8.0)
Що зробити:
- як у Rijo42
- чисто і мінімалістично
- чітка ієрархія
- акцент на продукт
Загальні вимоги
- мінімалістичний дизайн
- сучасний вигляд
- преміальна подача
- адаптація під мобільні
- чітка ієрархія тексту
- акцент на конверсію (CTA)
ВАЖЛИВО
Це не редизайн з нуля.
Потрібно допрацювати існуючий дизайн і зробити його більш цілісним та візуально сильним.