Як ми створили лендінг "Щелепи" для благодійного Фонду Сергія Притули

Про проєкт

“Щелепи” — лендінг для збору коштів на розвідувальний БпЛА Shark-M та українські баражуючі боєприпаси. Мета збору — 200 млн гривень на закупівлю високоточного озброєння, яке дозволяє виявляти та знищувати критичні цілі на відстані понад 150 км. 

Завдання

Нашим завданням було створити не просто інструмент для збору донатів, а лендінг, який переконує в цінності кожного внеску. І головне — мотивувати аудиторію підтримати збір, показавши зв’язок між донатом і конкретними результатами на фронті.

Сайт звертається до двох цільових груп: приватних донорів в Україні та бізнесу — як українського, так і міжнародного. Тут важливо було донести, що кожен може впливати на перебіг подій — особисто чи публічно.

Окрім базової функції донату, сайт мав чітко комунікувати:

• це збір, який допоможе швидко виявляти та знищувати ворога ;

• кожна гривня працює на ураження конкретної цілі;

• підтримка проєкту прямо впливає на ситуацію на фронті.

У візуальному та інформаційному наповненні ми прагнули створити ефект залучення: щоб користувач не просто прокрутив сторінку, а залишився та виконав цільову дію – задонатив.

Ще одне завдання — пояснити просто та зрозуміло, як працює зброя. Людина має не просто бачити назви, а чітко усвідомлювати, для чого потрібне та як працюватиме це озброєння на передовій. 

Візуальна концепція

Візуальна концепція лендінгу з’явилась після перегляду банера збору з виразним слоганом і зображенням БпЛА Shark-M — він одразу задав правильний напрям. Ми зберегли та розвинули його настрій у стилістиці культових фільмів “Щелепи”, “Pulp Fiction” та попкультури 80–90-х. Це впізнавана візуальна мова, яка поєднує брутальність, енергію й напругу, а також — органічно міксується з яскравими контрастами, великими заголовками та драматичними образами.

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

Для того, щоб надати лендінгу відчуття глибини й руху, ми використали ефект parallax scrolling та велику кількість анімацій. Завдяки цьому користувач поступово занурюється у динамічний сюжет: від першого екрану зі щелепами акули до наступних сцен, які розкривають всі деталі збору.

Дизайн лендінгу побудований на контрасті форм, кольорів і текстур. Шрифти у стилі Тарантіно нагадують газетні заголовки та ідеально підходять для коротких меседжів — жирні, з чіткою геометрією. Колірна палітра поєднує жовтий, червоний, чорний, білий та синій. Ця яскрава комбінація допомагає чітко розділити блоки контенту й підтримати загальний ритм сторінки. Зернистість, плівковий ефект і грубі текстури додають дизайну глибини та фактурності, а також — логічно поєднуються зі стилістикою ретро-постерів.

Архітектура та функціонал

Перший екран лендінгу — hero-блок з ключовим меседжем, прогрес-баром та зручною кнопкою для донату. Далі — опис мети збору та візуальні блоки, що демонструють, як працює комбінація БпЛА Shark-M і баражуючих боєприпасів. Потім користувач бачить відео з прикладами уражень, інформацію про виконавців та бізнеси, які долучилися до ініціативи. Завершують структуру сторінки екрани з реквізитами для переказу, FAQs та статистикою збору, яка оновлюється в реальному часі.

Функціонал лендінгу орієнтується на зручність взаємодії: можливість задонатити кількома способами, зрозуміла послідовність контенту, підтримка української та англійської мов. 

Проєкт реалізовано на базі нашої low-code платформи Spiro. Це гнучка й багатофункціональна система для розгортання кастомних рішень будь-якої складності для бізнесу та запуску startup-проєктів. 

Серед можливостей Spiro — зручне управління контентом, швидке налаштування мовних версій, аналітики та інтеграцій з різними платіжними системами та методами: Monobank, LiqPay, PayPal, SWIFT чи перекази в криптовалюті. 

Платформа підтримує контроль прав доступу для різних ролей користувачів та безпечне адміністрування з логуванням дій. Spiro — гнучкий інструмент для швидкої реалізації функціонала, адаптованого під конкретні задачі. Low-code платформа легко масштабується та забезпечує стабільну роботу при збільшенні навантаження та обсягів даних.

Результати

Цей проєкт поєднав кінематографічний дизайн з інтуїтивною структурою та зручною механікою збору коштів. Замість звичного формату ми створили динамічну історію, де кожен користувач — активний учасник, а донат — точка впливу на перебіг подій.  

Для FreshTech “Щелепи” — це особливий проєкт. На четвертому році повномасштабної війни важливо не втрачати здатність діяти та знаходити способи бути корисними. Ця ініціатива дала нам можливість долучитися до спільної справи та підтримати Збройні Сили України.

Друзі, збір на БпЛА Shark-M та українські баражуючі боєприпаси триває! Це зброя, яка знищує ворожу техніку, і кожен донат — це мільйонні втрати ворога. Переходьте на лендінг, щоб долучитися до збору та зробити свій внесок в майбутнє України 🇺🇦