Огляд проєкту
Datona — це мінімалістичний сайт агентства, який я створив на WordPress із використанням Breakdance Pro та ACPT. Стек навмисно залишився легким, але водночас достатньо гнучким, щоб сайт був простим для клієнта і в роботі, і в подальших оновленнях.
Клієнт не передав мені повністю готовий дизайн у Figma. Натомість я отримав набір референсів, загальний напрям і кілька побажань щодо тону та простоти. Моє завдання полягало в тому, щоб зібрати з цього цілісний інтерфейс і віддати спокійний, сучасний сайт без зайвого візуального шуму.
Основний виклик
Найскладніше тут було зберегти мінімалізм і не перетворити сайт на статичну візитку. Клієнту потрібен був чистий фронтенд, але при цьому він хотів кращу взаємодію довкола послуг і звернень, ніж просто одна контактна форма для всіх.
Окремим завданням була й структура контенту. Портфоліо мало оновлюватися без зайвого втручання в макети, а контактні дані компанії повинні були змінюватися в одному місці й автоматично оновлюватися по всьому сайту.
Як я це реалізував
За структуру контенту відповідав ACPT. Я створив окремий тип записів для елементів портфоліо, щоб клієнт міг додавати й редагувати роботи агентства через адмінку WordPress, не торкаючись макетів або коду. У цьому проєкті елементи портфоліо не ведуть на внутрішні кейси, а відкривають живі зовнішні сайти, тому такий підхід виявився логічним і простим для користувача.
Ті самі інструменти я використав і для контактних даних. Окрема сторінка налаштувань дозволяє оновити телефон, email чи адресу один раз, після чого зміни автоматично підтягуються в усі потрібні місця на сайті.
З боку взаємодії я побудував покроковий сценарій звернення на модальних вікнах. Замість того щоб одразу показувати одну універсальну форму, сайт допомагає людині спочатку обрати потрібний напрям, а вже потім переходити до конкретнішого варіанту контакту. Частину логіки я зібрав на можливостях Breakdance, а там, де потрібно, доповнив невеликим власним JavaScript.
Результат
У підсумку Datona отримала спокійний і сучасний сайт, який не тільки добре виглядає, а й залишається практичним у щоденному використанні. Портфоліо легко оновлюється, контактні дані керуються централізовано, а сам процес звернення відчувається продуманішим і приємнішим, ніж на типовому сайті агентства.
Навіть дрібні деталі на кшталт hover-ефектів і руху в окремих секціях додають сайту життя, не ламаючи його мінімалістичного характеру.
