Заказать

Pixelbuddha

Дизайнерские ресурсы высочайшего качества.
PixelBuddha маркетплейс исключительно
маркетплейс исключительно качественного контента для дизайнеров
https://pixelbuddha.net
banner-pic1 banner-pic2 banner-pic3 banner-pic4 banner-pic5

Перед нами поставили
несколько задач:

  • Разработка сайта на Laravel, как на более мощном и долговечном решении
  • Интегрировать предоставленный дизайн
Реализовать ряд важных бизнес-функций, таких как:
  • Оплата, заказы, подписки месячная и годовая (постоянный прием платежей), история заказов, история скачиваний
  • Партнерская программа
  • Защищенное превью, хранение и скачиваение платных медиа файлов и шрифтов
И другие. Терпение, сейчас все покажем!
Что выбрать?
WordPress? Laravel!

Когда клиент только обратился к нам, он нашел нас как разработчиков на WordPress. Ребята хотели работать с этой CMS, да и мы имели на тот момент колоссальный опыт разработки сайтов на WordPress.

Но, когда мы поняли масштаб задач и перспективы развития проекта, мы сразу предложили отказаться от WordPress в пользу разработки на Laravel.

Laravel choice Laravel choice

Laravel позволил:

Покрыть проект автотестами!
Спроектировать быструю и развиваемую базу данных
Сделать на порядок более быстрые выборки данных
Сделать удобную систему событий и уведомлений
Создать понятную и удобную систему разделения прав пользователей
Удобный и понятный любому разработчику роутинг
Настроить очереди для отправки писем и других (в будущем) фоновых задач
И многие другие приятные мелочи
Laravel Man

Файлы - суть проекта

Наведите на пункты
Folder arrows
Nginx
Файлы
Storage сервер
Фронтенд
Бэкенд
Web сервер
Folder arrows
API
Файлы
AWS S3
1
Пингуем storage-сервер
2
Если storage-сервер (доступен посетителю), делается запрос на авторизацию со Storage-сервера на бэкенд веб-сервера. Эта операция необходима, так как мы не можем доверять данным, полученным с фронтенда веб-сервера
3
Ответ на запрос авторизации
4
В случае успешной авторизации, получаем файлы
5
Отдаем файлы на фронтенд пользователю
6
Если на 1 шаге storage-сервер оказался недоступен, то мы получаем файлы с альтернативного сервера c высокой доступностью AWS S3
Таким образом достигается безопасная раздача файлов с дешевого storage-сервера и с гарантией доставки файла от S3. Дешево, безопасно, надежно.
Задача выполнена.

Коммерческий модуль

Как мы уже упоминали выше, до начала нашей работы проект умел бесплатно раздавать файлы и продавал один тип подписки через только через Paypal. Перед нами стояла задача реализовать целую систему для монетизации, которая состояла из
Commerce module
Подключения нескольких эквайрингов
Commerce module
Разовых платежей (транзакций)
Commerce module
Ежемесячных и годовых подписок для постоянного приема платежей
Commerce module
Оповещения о продлении, отмене и неудачной оплате подписки

Cloud Payments

Сперва, по просьбе клиента, мы изучили и внедрили относительно молодой, но уверенно набирающий обороты, эквайринг Cloud Paments. Этот сервис позволил нам получать оплату любым удобным посетителю способом, но было одно НО. Оказалось, Cloud Payments не умеет работать с годовыми подписками, поэтому пришлось все выкидывать и искать другой эквайринг.

Сравнение экварингов

Мы решили не наступать на грабли и подойти к выбору эквайринга с умом. После проведенного исследования, мы составили сравнительную таблицу
Смотри таблицу

Stripe

Заказчик выбрал Stripe за его максимально широкий функционал и выгодные относительно PayPal тарифы, но у Stripe есть один “небольшой” минус - он не работает с магазинами из РФ. То есть, принимать деньги с карт РФ банков он может, а вот выводить деньги на РФ банки из Stripe нельзя. Клиент элегантно решил проблему - зарегистрировал счет в немецком банке.

PayPal

Зачем нам еще один эквайринг? — спросите вы. Дополнительно к Stripe мы подключили PayPal по той причине, что у клиента уже есть история действующих подписок пользователей в сервисе PayPal и нам нужно было сохранить этих пользователей, их подписки и всю их историю. Подробнее о переносе контента расскажем ниже. PayPal оказался очень своеобразным сервисом в плане интеграции и потребовал гораздо большего времени для интеграции по сравнению с предыдущими решениями. Однако, с этой задачей мы тоже справились в полной мере.

Создание системы оплат на сайте

Разумеется, отправить деньги в эквайринг это еще не все. На сайте нужно реализовать как систему платежей, так и систему подписок и синхронизировать эти данные с эквайрингом в обе стороны. Подписки должны отменяться, возобновляться, а также менять свой тип (месячная/годовая)

4 бизнес-модели получения файлов

На сервисе мы реализовали систему разделения прав доступа к файлам в зависимости от их типа:
  • Бесплатные файлы для прямого скачивания
  • Бесплатные файлы для скачивания через подписку на Email
  • Платные (Premium) файлы для покупки поштучно
  • Платные (Plus) файлы для скачивания по подписке
Весь код, связанный с разрешениями интуитивно понятен при первом взгляде.
Business models

Реферальная программа

Еще одной новой фичей сайта стала разработка реферальной системы (партнерской программы). Это отличный маркетинговый инструмент практически для любого бизнеса.
Referal Sign
Суть проста — мы платим пользователям вознаграждение за приглашенных клиентов.
Referal Sign
Referal Screen
Как это работает
  • Каждому пользователю (партнеру) в его ЛК доступна его персональная реферальная ссылка.
  • Партнер отправляет эту ссылку своему другу, тот переходит и мы записываем в его сессию эту информацию.
  • Сессия хранится в Cookie в течение 30 минут.
  • Если пользователь зарегистрировался в течение суток, то мы считаем его приглашенным.
  • В этом случае в течение полугода со всех заказов этого пользователя партнер получает вознаграждение.
  • Партнер видит в своем ЛК список реферальных платежей, их статус и накомпленное количество средств.
  • При достижении $100 администратор производит выплату, баланс снижается на $100 и реферальные платежи отмечаются как выплаченные.

Промокоды

Еще один проверенный временем способ поднять продажи — создание системы промокодов. Наши промокоды имеют срок жизни, привзываются к типу материалов, определенному материалу или в общем для всего сайта.
Применение промокодов происходит на странице чекаута (оформления заказа) без обновления страницы. Для защиты от злоупотребления промокодами, применение промокода проверяется дважды: при отправке промокода на чекауте и при отправке всего чекаута на обработку.
PixelBuddha
Apply Coupon

Админка

Чтобы не тратить кровные средства клиента на разработку системы управления, мы выбрали готовую CMS Nova. Nova — CMS, созданная автором фреймворка Laravel, Тейлором Отуеллом. Она никак не влияет на работу сайта, а является надстройкой над фреймворком, в этом ее основное преимущество. Другое преимущество — невероятно быстрая разработка CRUD-интерфейсов (Create, Read, Update, Delete) для управления различными справочниками. Подробнее читайте в статье
Laravel Admin
Admin Control

Для управления контентом страниц (не справочников) использовали набор расширений для Laravel Nova

Некоторые из них успешною контрибутили (добавляли в официальном репозитории) необходимые нам функции.
Список расширений
Expansion
Текстовый редактор Froala
Expansion
Медиа-библиотека реализованная с помощью Laravel Medialibrary;
Expansion
Flexible Content
аналог ACF в Wordpress
Expansion
Nova Dependency Container - зависимость полей друг от друга

Автотесты

Весь функционал сайта покрыт автотестами, что помогает почти полностью избавиться от критических багов и значительно снизить количество небольших. Автотесты — это специальный код, задача которого — проверять, работает ли основной бизнес-код сайта.
Каждый раз когда программист что то меняет, он запускает автотесты и проверяет, все ли корректно работает. Это позволяет за несколько секунд проверить работоспособность нескольких сотен функций сайта.
Подробнее об автотестах читайте в статье
Autotests

Перенос контента

Был перенесен контент, включая материалы, пользователей и, что важнее всего, подписки пользователей. После переезда, пользователи сохранили все свои покупки, оплаченные подписки.

Пароли пользователей

Так как старый сайт был написал на Drupal, а новый на Laravel, при переносе пользователей были проблемы т.к. они используют разные методы шифрования паролей. Чтобы перенести пользователей пришлось переносить метод шифрования паролей с Drupal и использовать его в связке с методом шифрования на Laravel. Способ работы с паролями организован таким образом, чтобы поддерживать оба типа паролей.
Ну и самое главное — SEO. В ходе переезда почти ни одной позиции не пострадало, мы скрупулезно перенесли все урлы, метатеги и все остальное.
Перенос контента
Перенос контента

Фронтенд

Основная часть фронтенда была предоставлена заказчиком в виде UI kit. Если вам интересно почитать про наши компетенции в области front-end рекомендуем обратить внимание на кейс по разработке промо-сайта для Artinstall
Тем не менее нам осталось несколько мест, где можно было поработать над фронтендом.

Branding

Primary Colors
Secondary Colors

Retina

Заказчик пришел к нам с готовой версткой, но она была не адаптирована для retina-экранов. Эту задачу поручили нам. При правильной ретинизации тегу img задается несколько адресов c изображением разного размера и браузер автоматически выбирает подходящее в зависимости от плотности пикселей экрана. Однако мы столкнулись с проблемой - львиная доля картинок задана в качестве фона для контейнеров. Такие изображения намного сложнее ретинизировать и они не индексируются поисковиками, поэтому мы меняли верстку таких изображений на правильную. При верстке своих проектов, мы адаптируем сайт под retina-экраны по умолчанию
Retina

Защищенное превью шрифта

Сделали генерирование превью шрифта из заданного пользователем текста. Причем, шрифт невозможно скачать из браузера, так как превью генерируется на сервере в виде изображения.
Retina

Вывод

В итоге мы закрыли все поставленные задачи, решили все возникшие трудности и доставили продукт в полном объеме. Продолжаем сотрудничество над дальнейшим развитием сайта. Спасибо, Никита и Гриша за оказанное доверие, постоянную готовность говорить, слушать и предлагать отличные идеи. С вами приятно работать.
https://pixelbuddha.net