Как интегрировать сайт с внешними сервисами
Современные приложения и сайты не могут быть изолированы. Через внешнюю интеграцию настраивается авторизация через соцсети, оплата онлайн, заказ доставки на постоянной основе. Для оптимизации бизнес-процесса сайт и интегрированные сервисы должны автоматически обмениваться данными в режиме реального времени. Расскажем о том, как расширить функциональности вашего сайта, и о своем опыте.
Можно с нуля разработать внутреннюю интеграцию, например, интегрировать CRM с сервисом имейл-рассылок и импортировать все адреса клиентов.
А самые востребованные сервисы разрабатывают свои API, делают их публичными и сразу составляют документацию, описывающую процесс интеграции. Таким образом можно подключить сервисы по бронированию, голосовой поиск и другие приложения для удобства пользователей.
Разработчик сайта сможет обратиться к существующему API в своем коде, а дальше все будет зависеть только от функциональностей приложения. Например, авиакомпании передают на сайт-агрегатор информацию о своих предложениях, что делает возможным бронирование авиабилета в несколько кликов.
Несмотря на то, что здесь решение необходимо создавать под каждый вид интеграции и каждую бизнес-задачу, это упрощает работу программиста и разработку продукта.
Какие функциональности можно таким образом добавить на сайт
- Чат: Slack, Facebook Messenger, WhatsApp
- Авторизация и доступы: LastPass, OneLogin, One Identity
- Рекомендации: Foursquare, Yelp
- Опросы: Typeform, Form.io
- Онлайн-оплата: Mastercard API, PayPal
- Публикации медиаконтента: Youtube, Flickr, Last.fm, Vimeo
- Безопасность: PhotoCaptcha, Key Captcha
- Аналитика: Google Analytics Management
А также сервисы для быстрой отправки имейла, использования электронной подписи, карты Google Maps, стриминговые платформы или Wikipedia.
Вот как мы интегрировали внешние сервисы на своих проектах.
МегаФон
Бизнес-задача:
Подключить на сайте megafon.ru оплату банковской картой. Для этого был выбран сервис онлайн-платежей InPlat.
В документации от сервиса Inplat прописаны сценарии оплаты с подтверждением или без, единичная оплата или привязка карты. Когда абонент собирается оплатить услуги на сайте МегаФона, он получает ответ системы:
- МегаФон отправляет в систему InPlat метод init (или form);
- Система отвечает, что успешно приняла инициацию;
- Система пытается списать введенную сумму с карты абонента, используя данные, которые он ввел в форме на сайте (init или form);
- Система оповещает сайт МегаФона о результате проведения платежа методом result;
- Сайт МегаФона отвечает об успешном получении метода result.
Реализация:
Интеграция – это организация обмена информацией с сервисом-поставщиком данных. Поставщик данных определяет способ взаимодействия со своим сервисом и описывает ее в документации. Это запросы к интерфейсу API по протоколу http различного предназначения — получение информации, изменение, удаление, добавление сущности. Разработчик сайта МегаФон видит API и пишет код, который обращается к API. Сайт МегаФона предоставляет форму, после того, как пользователь ее заполняет, запрос отправляется к API InPlat. Дальше запрос обрабатывается на стороне InPlat.
Nikon
Бизнес-задача:
Провести розыгрыш призов, с механикой, основанной на верификации чеков.
Мы создали несколько лендингов для акций Nikon. Их механика отличалась, например, в акции Я свобода творчества после покупки техники Nikon, покупатель может зарегистрировать чек и получить годовую подписку на пакет программ Adobe Creative для фотографов. Пользователь отправляет номер и фотографию чека, серийный номера проверяется на официальном сайте Nikon, после чего пользователь получает ключ доступа к программам. В этом случае сначала необходима интеграция с API Nikon, а потом с API Adobe.
В акции Я объективно лучший подарок пользователь регистрирует свой чек на покупку и может получить подарок в фирменном магазине Nikon. Чтобы сразу на лендинге акции узнать адреса магазинов, мы подключили интерактивную карту.
Реализация:
Пользователь загружает фото чека. Данные Nikon отправляет на внешний сервис – официальный сайт Nikon. Он обрабатывает эти данные и проверяет серийный номер. После чего сайт Adobe отправляет пользователю ключ доступа к программам.
Но не для всех задач достаточно интерактивного обмена данными. Существуют кейсы, требующие комплексного решения. Для каждой задачи необходимо выбрать свой механизм: например, интеграция с сервисом карт будет в каждом разрабатываться по-разному и это займет разное время.
PepsiCo
Бизнес-задача:
- Создать единую платформу для промоактивностей PepsiCo
- Интегрировать платформу с имеющейся CRM
PepsiCo часто проводит акции, в рамках которых пользователь вводит на промо-сайте код с крышечки или пачки. Он получает гарантированные призы или участвует в розыгрыше большого еженедельного приза.
Раньше сайты акции напрямую интегрировались с CRM-системой и другими отдельными инструментами, нужными для промомеханик, таких как сервис регистрации чека или программы лояльности. Регистрация, авторизация пользователей, валидация кодов происходили с помощью интегрированной CRM. А розыгрыш и отбор победителей — на странице сайта.
Реализация:
Мы разработали единый инструмент розыгрыша, чтобы создавать новые промосайты было проще, перенести розыгрыши с сайта и внедрить единую систему. После его разработки сайту больше не требуется напрямую подключаться к отдельным инструментам и проводить на своей стороне розыгрыши. Теперь эти функции выполняет единый инструмент розыгрышей, достаточно того, что сайт подключен к нему. Сам сайт только отправляет запрос и получает ответ.
Благодаря этому инструменту повысилась общая стабильность проектов: единая платформа задает стандарт разработки промосайтов, экономит время и упрощает задачу для разработчиков. Механики, разработанные для одного розыгрыша, применимы на другом, поэтому новые промо запускаются гораздо быстрее.
Персональные данные, полученные в каждом розыгрыше, хранятся и обрабатываются в одном месте, и пользователям не нужно повторно регистрироваться для участия в новом розыгрыше. Кроме того, это снижает юридические риски.
Новым подрядчикам легче включиться в работу, т.к. они могут пользоваться единой платформой, чтобы создавать новые механики розыгрышей. А PepsiCo получили возможность выбирать подрядчиков из более широкого круга агентств, т.к. на них осталось мало технических задач и можно ориентироваться на экспертов в креативе.
Особенности интеграции
С помощью внешней интеграции можно значительно расширить возможности сайта, улучшить UX, автоматизировать обмен данными. Кроме того, интеграция с внешним сервисом может стать элементом партнерского маркетинга.
Но нужно учитывать, что интеграция с внешним сервисом – это дорогой процесс, поскольку готовых решений очень мало. Все проекты индивидуальны и многое зависит от бизнес-задач. Поэтому каждый раз разработчик сопоставляет бизнес-задачу с возможностями сервиса и вырабатывает решение.
Другие посты
Темное искусство оценки проекта
Многие сталкивались с ситуацией, когда оценка пула задач в один месяц превращалась во все четыре. Поделимся своим опытом и расскажем, как этого...
Сила первого впечатления: как сделать сайт...
Бизнес давно ушел от мигающих баннерами и разными шрифтами сайтов из начала 2000-х и все больше прислушивается к мнению аудитории. Но...
Как уйти от банальных метафор в иконках
На сайтах иконки используются как дополнительный арт-объект, чтобы избавиться от пустоты. Они превратились в визуальный мусор. Попробуем добавить в...
Как создать личный кабинет, который понравится...
Личный кабинет — это буквально способ взаимодействия с сайтом, а значит, и с вашим сервисом. Поговорим о том, как сделать его удобным для...
В своем стиле: как сделать дизайн сайта...
Поговорим о том, как оригинальные иллюстрации могут стать вашей визитной карточкой в диджитал.
Разрабатываем алгоритм праздника: как...
В 2019 году нам удалось поработать с Почтой Mail.ru уже над тремя интерактивными проектами к праздникам. Расскажем о проектах и технической...
Метод гипотезы. Какие приемы из дизайна...
Приложения для смартфонов задают тренды в дизайне и влияют на проектирование интерфейсов. Мы выдвинули несколько гипотез о том, как дизайн...
Первый хакатон на РИФе: как это было
В этом году в рамках Российского интернет-форума впервые прошел хакатон, в котором команда Далее заняла первое место. Расскажем о разработанном...
Моделируем реальность: как технологии VR и AR...
Виртуальная и дополненная реальность пока применяются не часто, но некоторые наработки этой индустрии можно использовать уже сейчас. Рассмотрим,...
Как сделать сайт для премиального сегмента...
Иллюстрации, видео и текст— это и есть эмоции, которые передает ваш сайт. Они задают тон и контекст — то, как пользователи будут воспринимать...
Литературные тропы в дизайне: метафоры и их...
С помощью визуальных образов дизайнеры, иллюстраторы и фотографы рассказывают истории. Метафоры — это то, что делает истории интересными....
Ключевые детали: как повлиять на решение...
Этот маленький навигационный элемент сайта может изменить восприятие продукта, пользовательское поведение и повысить конверсию. Разбираемся, как...
Мифические существа в digital: фулл-стек...
На рынке существуют полярные мнения о фулл-стек разработчиках: одни специально ищут их для проекта, другие ставят в один ряд с драконом и...
Уникальность в рамках системы
Разбираемся, ограничивают ли дизайн-система и UI-kit творческие решения дизайнеров, как разработать нестандартную идею в рамках системы и...
Проверяем свое везение. Как работают розыгрыши...
Наши клиенты часто проводят интересные конкурсы и промоакции, а мы создаем промостраницу и работаем над техническими аспектами розыгрышей....
Как найти сокровища в фотостоке
Даже крупные бренды совершают ошибки при подборе фото для иллюстрации своих услуг. Разбираемся, как найти изображения для сайта, которые вызовут...
Искусство диалога: налаживаем общение с клиентом
Много сил вкладывается в создание маркетинговых стратегий, формирование правильной команды, выбор технических инструментов, но стандарты общения...
Страница 404: как помочь пользователю, если он...
Все мы бывали на странице 404. Эта ошибка означает, что страница не найдена. Поделимся своим опытом, как этого избежать, и не только не...
5 Полезных инструментов для менеджера и всей...
Для организации процесса появилось так много программ, что выбрать подходящую уже непросто. У каждого своего приложения для смартфона и облако, а...
Как работать с другим агентством и улучшить проект
Часто привлечение нескольких агентств неизбежно, если речь идет о сложном и масштабном проекте. Разбираемся, какие плюсы и минусы в этой ситуации...
Когда релиз? Оцениваем эффективность команды...
В команде разработки МегаФона мы постоянно работаем над контролем качества кода. Для этого у нас есть практика code review, автотесты и разные...
Must have в веб-дизайне
В этом списке вы не прочитаете предсказаний о популярности видеоконтента, голосовых интерфейсов и адаптивной версии сайта, потому что и так об этом...
«Как у Тинькова»: какими решениями мы обязаны...
Российские банки одними из первых в рунете начали превращать свои сайты в сервисы. Этому способствовало несколько факторов. Во-первых,...
Волшебная кнопка. Чек-лист для повышения...
Эффективность промосайта зависит не от дизайна, копирайта и выгоды предложения. Успех заключается в том, как все работает вместе и образует...
Тренды диджитал-маркетинга в 2019 году
Мы давно слышим о том, что блокчейн и VR меняют нашу жизнь в Сети, но пока они все еще кажутся технологиями из сериала «Черное зеркало». Поговорим...
Топ 5 материалов 2018 года
Весь год мы рассказывали о наших разработках, интересных рекламных кампаниях, делились опытом и своим взглядом на применение новых технологий в...
Новогодние традиции в Далее. Спойлер: это не...
В декабре все переживают не только из-за отчетов и мероприятий, но и о том, как поздравить клиентов. В Далее есть праздничная традиция, которая...
Как нанять робота вместо менеджера проекта
Мы в Далее ищем новые способы оптимизировать распределение ресурсов и тестируем для этого разные технологии. Недавно наша команда разработала...
Микромультик для Микролакса
Для продвижения средства Детский Микролакс наш клиент Johnson & Johnson предложил конкурс, который порадовал мам и детей, а также помог в...
Время экспериментов. 10 карточек по A/B...
Рассказываем о методе, который поможет улучшить юзабилити сайта, увеличить трафик и главное – повысить конверсию.
Не заставляйте меня думать: как снизить уровень...
Технологии и стандарты меняются, и дизайн сайта должен им соответствовать. Но даже если новый дизайн эстетически и функционально безупречен,...
В поисках Dream Team для разработки сайта
Найти классную команду для разработки проекта – это челлендж для менеджера. Построить работу можно по-разному: собрать команду у себя в штате,...
Релиз или жизнь? Хеллоуин в digital
В самую страшную ночь года на специалистов нашего диджитал-агентства больше ужаса наводят не сверхъестественные силы, а дедлайны, и самые страшные...
Как данные и эмоции меняют дизайн
Четкий подход при создании нового сайта или его редизайне поможет систематизировать работу: не нужно принимать решение наугад и думать, выстрелит...
Темная сторона дизайна
Apple сделал темную тему основной по умолчанию для новой Mac iOS, а Youtube начал тестировать темный фон еще год назад. Темные темы в интерфейсах...
Зачем нужно тестирование сайта
До тестирования сайт ведет себя как кот Шредингера. Вы не знаете, работает ли все так, как задумано. Тесты перед запуском или обновлением сайта...
Большой брат: как и зачем использовать...
Сегодня сайт может подстраиваться под пользователя в реальном времени, что помогает укрепить отношения с брендом и соответствовать высоким...
Дизайн B2B-портала: найдите отличия
Есть мнение, что в компаниях, которые оказывают услуги для B2C и B2B, необходим разный подход к разработке дизайна для своего сайта, т.к....
Еще раз об эффективности: чек-лист перед...
Чтобы взять все необходимое в поездку, организовать порядок в доме, начать вести здоровый образ жизни, можно воспользоваться чек-листами. Та же...
Типографика в веб-дизайне
Типографика на сайте – это не просто выбор шрифта, а набор правил оформления текста. Они основаны на том, как пользователь воспринимает текст на...
Как бренду рассказать свою историю
Психологи-эволюционисты доказали, что притягательность историй обусловлена строением нашего мозга. По данным сайта brainrules услышанную информацию...
Финансовые сервисы в digital: будущее уже...
Удобство нашей жизни во многом зависит от скорости развития финансового сектора в digital. Многие уже привыкли к оплате коммунальных услуг на сайте...
UX-аналитик и другие профессии с приставкой UX
UX-дизайн определяет, каким будет опыт взаимодействия пользователя с продуктом. В процессе проектирования пользовательского опыта участвуют четыре...
Как отличить атомарный дизайн от UI-kit
Невозможно перестараться, оптимизируя работу над дизайном. Можно подойти к вопросу глобально и воспользоваться методологией атомарного дизайна, а...
Преимущество использования отзывчивого веб-дизайна
Как адаптировать дизайн под разные устройства, чтобы он оставался удобным для пользователя? Вместе с контент-продюссером компании InVision Уиллом...
Лучшие диджитал-кампании к Чемпионату Мира 2018
Чемпионат стартовал 14 июня, и острая борьба среди брендов началась задолго до этого. На самом главном спортивном мероприятии в мире мы увидим не...
Как составить контент-план, который работает
От контента зависит максимум эффективности кампании. Что лучше, традиционный подход с подготовкой всего контента на месяц вперед или эксперименты в...
Правило Хемингуэя: как агентству и заказчику...
В оценке качества креативной концепции есть две проблемы. Первая — как его оценивать агентству, внутри команды, что пропускать дальше, а что...
Обзор самых популярных систем для управления...
Система для управления проектами может сильно повлияет на продуктивность компании. Сложно определиться с системой для работы с клиентами, и еще...
Сам себе Youtube: 5 шагов к вирусному контенту
Над видео для компании лучше работать вместе с продакшн-агентством. Вы смотрите портфолио агентств и выбираете подходящее по стилю и по цене. Что...
Как агентства представляют свои кейсы
Когда заказчик обращается в агентство, ему нужен не просто сайт или промокампания, а гарантии и решение проблемы. И кейсы показывают, насколько...
Просто о сложном: agile-разработка
Изначально аджайл был вотчиной программистов. Так они называли методы разработки ПО, принципиально отличавшиеся от традиционного. Но оказалось, что...
Что такое нативная реклама и как она работает
Несколько лет подряд все говорят о нативной рекламе. Недавно Business Insider заявили, что к 2021 году выручка от нее вырастет до 74% от общих...
Разработка единой дизайн-системы для группы ВТБ
Собственные дизайн-системы – что это? Модный тренд или рабочий инструмент для качественного продвижения бренда? Рассказываем про наш опыт.
Чем дизайнер продукта отличается от просто...
Мы собрали пять отличительных признаков дизайнера продукта от дизайнера, занятого на «потоке» — чтобы окончательно разобраться в вопросе и...
Быстрее, выше, сильнее: как использовать видео...
Почему видеоконтента становится всё больше, где стоит размещать ваши видеоролики, и как сделать их ещё лучше.
Микроинфлюенсеры – будущее маркетинга влияния
Одним из трендов инфлюенс-маркетинга стал «подъем микроинфлюенсеров» — блогеров с небольшой, но активной аудиторией. Бренды обращают меньше...
Мессенджер-маркетинг как современный способ...
Мы решили сделать обзор самых популярных мессенджеров и выяснить, как бренды могут использовать их для коммуникации с клиентами.
Формы оплаты работ за разработку сайта
Мы разберем детально какие бывают формы ценообразования на создание интернет-проекта.
Как убрать непонимания при общении с исполнителями
Как и в любом коммуникационном процессе, у вас могут возникнуть недопонимания или даже конфликтные ситуации с вашим подрядчиком. Это норма нашей...
В каких конкурсах участвовать, если вы...
Сейчас столько конкурсов, фестивалей и премий, что уследить за всеми невозможно. Расскажем о лучших отечественных и зарубежных мероприятиях, в...
Ищем подрядчика по разработке сайта (2 часть)
Как начать искать подрядчиков? Чем руководствоваться при выборе таких специалистов? Читайте продолжение статьи про особенности подбора...
Как искать подрядчика по разработке сайта (1...
Самый надежный путь — сформулировать свои задачи, критерии поиска и отбора подрядчика и заняться поиском самостоятельно.
Поддержка и развитие сайта
Работа над сайтом не прекращается после подписания акта и сдачи проекта. Сайт или интернет-проект — это инструмент, который постоянно...
PR-менеджер в digital-агентстве: 2017
Бюджеты, зарплата, показатели, достижения и профессиональные трудности.
Выбор платформы для создания сайта
Последствия выбора платформы проявляются на финальных стадиях работы над проектом или после его сдачи заказчику.
Сколько стоит разработка корпоративных сайтов
Мы рассмотрим самый популярный тип проекта — корпоративный веб-сайт. На основе рыночных исследований мы выделили 3 ценовых группы и разобрали...
Цели проекта: имиджевые, финансовые, смежные.
В первую очередь ответьте на вопрос «Для чего и для кого делается этот интернет-проект?»
На западном фронте: особенности работы с...
О работе с западными заказчиками писали много, но в основном о финансово-юридических моментах. Мы же осветим другую сторону — организационную,...
Онлайн-трансляции в соцсетях любят больше, чем...
Live-трансляции могут быть полезны и для продвижения товаров, услуг, бизнес-мероприятий. На примере благотворительной акции банка расскажем как...
Блогеры решают: Influencer Marketing в действии
Лучше всего работает та реклама, которая не выглядит, как реклама. Поэтому сегодня Influencer Marketing становится всё популярнее. Рассказываем,...
«Мы решили заправить Instagram тем, чего от...
Агентство «Далее» запустило кулинарный Instagram-сериал с комедийной актрисой Мариной Федункив из «Реальных пацанов» в главной роли.
UFS.Travel: увеличение количества продаж за...
Команда UFS.Travel и digital-агентство «Далее» о том, какие обновления на сайте поспособствовали повышению конверсии на 16%.
KPI digital-кампаний: к чему нужно быть готовым
KPI (Key Perfomance Indicators) — ключевые показатели эффективности. Иногда их для краткости называют «метрики». Существование метрик...
Как решать конфликтные ситуации с трудными...
Разбирая проблему возникновения конфликтных ситуаций с так называемыми сложными клиентами, в первую очередь нужно сказать, что любое агентство,...