Услуги

  • Сайты
  • Контент
  • Продвижение
  • Битрикс24
  • Приложения
Все услуги Оплата
Битрикс24
Все услуги Оплата

Поиск

  • Разработка интернет-магазина под ключ
  • Разработка сайтов
  • Разработка леднигов
  • Разработка на битрикс24
  • Разработка на Вордпресс

Разработка лендинга для сбора донатов

О проекте

После полномасштабного вторжения российских войск в Украину работа волонтёров активизировалась во всех уголках мира. К команде Webnauts обратился член «Волонтёрской команды Вадима Мелихова» Наталья Сай, которая проживает в США. Перед ней стояла цель: помочь волонтёрам Харькова собрать средства в поддержку ВСУ и для помощи людям, оставшимся жить в самых опасных районах Харькова и регулярно подвергающимся обстрелам и бомбардировкам.

С начала войны волонтёры не прекращают:

  • доставлять гуманитарную помощь в Харьков;
  • распределять и разносить продукты питания людям, живущим в домах и бомбоубежищах;
  • доставлять людей, нуждающихся в медицинской помощи, к врачам или на главный вокзал для эвакуации;
  • готовить и передавать готовую еду воинам ВСУ, а также обеспечивать продуктами питания два военных офиса.

На момент обращения к нам, волонтёры испытывали острую необходимость в финансовой поддержке. Наша команда предложила быстрое и оптимальное решение — разработку лендинга для сбора донатов волонтёрам в Украине.

Задача

Волонтёрам нужен был небольшой и понятный пользователю сайт, основная цель которого — сбор средств на нужды харьковчан и военных. Для этого нам необходимо было рассказать о существовании самой волонтёрской организации, о работе, которую они проводят, а также обязательно обеспечить интеграцию с платёжными системами. Таким образом, каждый, у кого есть возможность финансово поддержать организацию, смог бы быстро и легко перевести средства в любой валюте, включая и различные виды криптовалюты, на счета членов организации.

Реализация

Наша команда не раздумывая откликнулась на просьбу Натальи и с большим энтузиазмом принялась за проект. В кратчайшие сроки сверстали одностраничный сайт с применением CSS / HTML / JS и языка PHP, с дизайном, полностью соответствующим предварительно отрисованному макету. А также сделали его адаптивным под всевозможные мобильные устройства.

Одностраничный сайт = посадочная страница = лендинг. Такой формат для сайтов, где отсутствует разветвлённая структура, сегодня достаточно популярен. Всю информацию умещают на одну страницу, и пользователь просматривает её в рамках одной сессии.

Выбор одностраничника был обусловлен тем, что именно такой тип сайта позволяет ёмко изложить важную информацию и сделать акцент на самом важном. В нашем случае — это донаты.

Создание дизайна

Так как тематика сайта связана с войной и её последствиями, мы не стали изощряться в дизайне, тратя время на сложности и изыски. Учитывая пожелание заказчика, старались, чтобы сайт получился аккуратным, понятным и простым в использовании. Поэтому при разработке дизайна отдали предпочтение простой и лёгкой стилистике. Цвета сайта были подобраны с определённым символизмом:

  • белый — ассоциировали с добром, которое несут самоотверженные волонтёры,
  • синий и жёлтый — цвета украинского флага — как символ того, что помощь предназначена народу Украины,
  • а то, что сам сайт получился светлый и прозрачный, говорит о таких же намерениях участников организации и о том, что оказанная помощь будет доступна всем, кто так в ней нуждается.

Весь одностраничник условно можно разделить на 7 небольших блоков:

  1. «Волонтёрская команда Вадима Мелихова» — краткое описание о том, чем занимается команда,
  2. «Что мы делаем» — более подробный рассказ о видах помощи, оказываемых волонтёрами,
  3. «Поддержать волонтёров», сделав взнос — основной целевой блок с кнопками платёжных систем для финансовой помощи,
  4. «Галерея» — отрисована и реализована с полным фото- и видеоотчётом о работе команды,
  5. «Тактическое снаряжение» — своеобразный месседж от друзей-волонтёров из США с призывом собрать помощь украинским военным,
  6. «Помощь семьям беженцев» — с призывом «Связаться с нами» для оказания помощи семьям беженцев из Харькова,
  7. «Команда волонтёров» — фотогалерея самоотверженных и бесстрашных членов команды Вадима Мелихова.

Разработка

Серверную часть сайта наши разработчики написали с помощью языка программирования PHP.

PHP — C-подобный скриптовый язык общего назначения с открытым исходным кодом. Его используют для создания динамических веб-ресурсов и поддерживают практически все хостинг-провайдеры. PHP код может внедряться непосредственно в HTML и обладает широкими возможностями и большим набором встроенных инструментов для разработки веб-приложений.

С помощью простого редактора кода и стандартизированного языка разметки документов HTML наши разработчики наполнили шаблон, структурируя контент на странице. И, используя язык разметки CSS, применяемый для визуального оформления ресурса, отформатировали содержимое сайта, сделав его привлекательным для пользователей. Также задействовали сборщик проектов Gulp.

Gulp — это таск-менеджер, написанный на языке программирования JavaScript, который автоматизирует часто используемые задачи при веб-разработке, помогая тем самым ускорить процесс разработки.

С помощью этой программы мы смогли достаточно быстро упорядочить и превратить набор отдельных файлов в одностраничный сайт, логически структурированный и выстроенный в секциях.

Мультиязычность

Так как сайт изначально был рассчитан на украинскую и западную аудитории, мы сделали его двуязычным — всю необходимую информацию пользователь может прочесть на украинском или английском языке. В данном случае мультиязычность мы реализовали путём создания двух страниц на разных языках в рамках нашего сайта. Необходимый язык можно выбрать с помощью переключателя в верхней части веб-ресурса, рядом с меню.

Добавление форм для взносов

Основной блок проекта находится практически в центре одностраничника.

На синем фоне размещены белые крупные кнопки, с указанием различных видов платёжных сервисов и ссылками на формы для того, чтобы донаты можно было вносить в любой валюте и удобными способами:

  • Credit Card — оплата банковской картой,
  • PayPal — крупнейшая дебетовая электронная платёжная система, обеспечивающая бесконтактные платежи в 25-ти видах валют,
  • Crypto — оплата криптовалютой. Здесь вы можете в зависимости от вида валюты
    скопировать номер подходящего электронного кошелька, чтобы сделать перечисления.

Итог

В результате проделанной работы мы в достаточно сжатые сроки отрисовали и сверстали двуязычный одностраничный сайт (лендинг) для сбора донатов получателям в Украине. Подключив к нему платёжные системы, быстро реализовали задачу, поставленную заказчиком-волонтёром. Данный функционал уже показал свою эффективность и отлично справился с возложенной миссией: первые поступления не заставили себя долго ждать. Спасибо всем и каждому, кто верит в Украину и поддерживает, чем может, в это страшное для нашей страны время.

Комментарии

Подписаться
Уведомить о
guest
0 комментариев
Межтекстовые Отзывы
Посмотреть все комментарии

Интересует создание лендинга — сайта-одностраничника для донатов и других задач?

Оставьте ваш номер телефона, — наш менеджер свяжется с вами в ближайшее время, чтобы обсудить детали.

Над проектом работали

0
Оставьте комментарий! Напишите, что думаете по поводу статьи.x