База знань
EN UA

Налаштування дизайну веб-сайту та мобільних додатків

Дизайн сайту та мобільних додатків може бути налаштований індивідуально залежно від переваг проекту. Додаткові параметри зовнішнього вигляду виконуються на панелі керування в розділі "Налаштування".

🎬Огляд, як налаштувати дизайн вебсайту та застосунків за посиланням.

Зміст

  1. Шаблони
  2. Макети
  3. Налаштування зовнішнього вигляду веб-сайту
  4. Конструктор головної сторінки веб-сайту
  5. Мобільні додатки

Шаблони

Інтерактивні шаблони доступні за нижченаведеними посиланнями, і дозволяють ознайомитися із зовнішнім виглядом веб-сайту на різних пристроях.

Десктоп-версія

Мобайл-версія

Макети

Всі макети веб-сайту доступні у Figma за цим посиланням.

Для їх детального перегляду та використання необхідно авторизуватись у Figma. Ви можете скопіювати їх в окремий проект, щоб самостійно розробити дизайн свого веб-сайту.

Налаштування зовнішнього вигляду веб-сайту

Незалежно від дизайну вашого веб-сайту, ви можете швидко змінити вигляд деяких елементів безпосередньо з панелі керування. Наприклад, кольорову схему сайту можна змінити у розділі Налаштування => Інтерфейси => Схема кольорів.

** Колір ключових елементів **. Відповідає за колір привітальних екранів в мобільному додатку, активних елементів інтерфейсу: фону привітальних вікон застосунку, основних кнопок, активних кнопок, обраних елементів списків. Цим кольором буде пофарбована кнопка "Показати ресторани" (для мультибрендів) або "Показати меню" (для монобрендів) на головній сторінці веб-сайту.

** Колір допоміжних елементів**. Відповідає за колір другорядних елементів інтерфейсу користувача: лейбла акції, колір блоку відображуваного замість обкладинки акції, колір каунтерів в картці товару і в бічному меню, колір піна розташування користувача і куля кур`єра на екранах з картою, а також за колір зображення з сумою на сторінці кешбека.

** Колір тексту ключових та допоміжних елементів. ** Відповідає за налаштування кольору тексту ключових і допоміжних елементів. Цим кольором буде виділено текст на кнопці "Показати ресторани" (для мультибрендів) або "Показати меню" (для монобрендів) на головній сторінці веб-сайту.

Також самостійно Ви можете змінювати іконки і логотипи. Це можна зробити Налаштування => Інтерфейси => Веб: Графіка

** Іконка лого (маленька). ** Логотип сервісу, який відображатиметься на панелі управління.

** Favicon. ** Логотип сервісу, який відображатиметься у вкладці браузера перед назвою кожної зі сторінок веб-сайту.

** Велика іконка лого. ** Логотип сервісу, який відображатиметься у сніпеті, при надсиланні посилання на веб-сайт у месенджерах чи соцмережах.

Конструктор головної сторінки веб-сайту

Головна сторінка веб-сайту складається з блоків, кожен із яких можна налаштувати відповідним чином. Щоб змінити налаштування блоків перейдіть Налаштування => Інтерфейси => Головна сторінка

Докладніше див. тут.

** Блок Header. ** Цей блок відображається у верхній частині всіх сторінок веб-сайту.

** Блок Стартовий екран **. Цей блок містить зображення або коротке відео, яке буде відображатися клієнтам під час відкриття головної сторінки веб-сайту. Також у цьому блоці міститься кнопка "Показати меню"/"Показати ресторани" та короткий текст.

** Блок Міні слайдер. ** Цей блок може містити зображення з посиланнями на меню компаній, категорії товарів (страв) або спеціальні пропозиції для клієнтів.

** Блок Максі слайдер. ** Цей блок містить зображення з посиланнями на інформацію для клієнтів (особливості сервісу, акції або спеціальні пропозиції).

** Блок Додатки. ** Цей блок відповідає за відображення інформації про мобільний додаток сервісу на головній сторінці веб-сайту.

** Блок Доставка та оплата. ** Цей блок відповідає за відображення інформації про доставку та оплату на головній сторінці веб-сайту.

** Блок Footer.** Цей блок відображається у нижній частині головної сторінки веб-сайту. У блоці містяться опис сервісу, посилання на акції міста, а також посилання на соцмережі та правила використання сервісу.

Мобільні додатки

При необхідності можна налаштувати такі елементи мобільного додатку:

  • Колір додатку.
  • Іконка додатку. Векторні зображення без градієнтів.
  • Іконка Push-сповіщення додатку. Векторні зображення одного кольору.
  • Splash-екран додатку. Зображення під час завантаження додатку.
  • Логотип компанії.

У разі виникнення питань щодо дизайну веб-сайту та мобільних додатків, ви можете зв'язатися зі службою підтримки Dots Platform.

Посилання на цю статтю: тут.

← Повернутися до бази знань