← Усі роботи
Веб-студія · СайтApricode · веб-студіяЗапущено

Apricode

Новий сайт веб-студії Apricode. UX/UI дизайн я зробив як фриланс-проєкт, а розробила сайт сама студія.

01 — Проєкт
Apricode
Роль
UX/UI дизайнер
Обсяг
UX/UI дизайн

02Контекст

Apricode — веб-студія. Вона робить сайти на WordPress і Shopify, Telegram-ботів і Mini Apps та індивідуальні рішення.

Студія замовила в мене дизайн власного сайту. Це був фриланс-проєкт у липні 2026. Розробила сайт сама студія, тож моя частина — лише дизайн.

03Проблема

Старий сайт студії більше не влаштовував замовника.

  1. P1Сайт для клієнтів, які хочуть сайт на WordPress чи Shopify, Telegram-бота або Mini App чи індивідуальне рішення, тож кожен із цих напрямів мав бути зрозумілий із першого погляду.

04Дослідження

Методи

  • Подивився сайти конкурентів
  • Вивчив референси, які дав замовник

05UX

Інформаційна архітектура

Основний шлях

  1. 01Головна
  2. 02Вибір послуги
  3. 03Перегляд проєктів
  4. 04Запустити проєкт
  • На сайті чотири напрями послуг: WordPress, Shopify, Telegram-боти й Mini Apps та індивідуальні рішення.
  • Сайт доступний англійською, латиською та українською.

06Дизайн

Світла сторінка з одним помаранчевим акцентом і моноширинним шрифтом.

  • Фон#F5F5F5
  • Акцент#FC561D
  • Шрифт — IBM Plex Mono: студія виглядає як місце, де дизайн і код працюють поруч.
  • На першому екрані — спокійна каркасна сфера з одним коротким повідомленням, а помаранчева кнопка запуску проєкту завжди під рукою.
  • На сайті є анімації, зокрема анімований блок «Next step» унизу з фразою «Let’s start your project».
  • Я зробив дизайн під вимоги замовника та його власне бачення сайту.

07Розробка

Спроєктував я · зібрала команда розробки

Сайт зібрала сама студія.

  • Я передав дизайн, розробка була на боці студії.

08Фінальний продукт

Головна: одне чітке повідомлення на першому екрані й кнопка «Запустити проєкт» одразу.
01Головна: одне чітке повідомлення на першому екрані й кнопка «Запустити проєкт» одразу.
Проєкти: картки з типом роботи й тегами, щоб відвідувач одразу бачив, що студія вже робила.
02Проєкти: картки з типом роботи й тегами, щоб відвідувач одразу бачив, що студія вже робила.
Про студію: хто вони, одним коротким абзацом.
03Про студію: хто вони, одним коротким абзацом.
Сторінка послуги: що студія робить у цьому напрямі, простими словами.
04Сторінка послуги: що студія робить у цьому напрямі, простими словами.
Анімований блок «Next step» унизу: «Let’s start your project».
05Анімований блок «Next step» унизу: «Let’s start your project».
Відкрити сайт

09Результат

  • Сайт працює за адресою apricode.co.
  • Він доступний англійською, латиською та українською.
  • Через сайт надходять заявки, і клієнти залишають відгуки.

Наступний крок

Потрібен такий підхід у вашій команді?

Написати мені LinkedIn

Повна зайнятість, віддалено · Контракт · Аутстафінг / агенція