Получите максимальную отдачу от QR кодов с помощью URI схем

1344704011_qr-code-05

В последнее время, все говорят о потенциале QR кодов. Они стали интернет эквивалентом традиционных штрих-кодов (например, те, которые вы найдете на товарах в вашем любимом магазине).

Каждый может сделать быстрый снимок QR-кода смартфоном и сразу получить адрес сайта или загрузки. Таким образом, мы могли бы напечатать QR коды на бумаге и товарах, таких как визитные карточки, журнал объявлений и плакатов для того, чтобы привлечь людей к нашему сайту.

Но, чаще всего, веб-разработчики не используют QR коды в полном объеме.

В этой статье мы обсудим способы, которые раскроют потенциал QR кодов полностью.

Как работают QR коды в двух словах

Давайте же узнаем как на самом деле работает QR код. QR коды, по своей сути, специально созданные изображения, которые работают как штрих-коды.

Некоторые команды (так же известные как ответы) являются встроенными, и когда QR код заснят камерой (смартфона или планшета), изображение QR кода обрабатывается и выполняется встроенный ответ.

В общем QR код отвечает ссылкой на сайт, тому устройству с которого его сфотографировали.

QR код и URI схема

QR код может выглядеть как тот, что выше и при этом все равно будут захватываться камерой и распознаваться смартфоном или планшетом.

Читалки QR кодов

Здесь начинается самое интересное. QR код ридеры — это приложения которые считывают коды и выполняют некоторые действия — не всегда одни и те же. Некоторые из них способны распознавать QR-коды и делать всякие удивительные вещи, а другие могут просто открыть URL-адреса или отобразить текст.

Большинство смартфонов имеют одинаковый набор базовых функций (адресную книгу, календарь, обработка текста , оповещения и интернет-серфинг), и хороший QR-код ридер может использовать их все.

При низкой функциональности приложения, открытие URL ссылки, единственное, что мы сможем получить от QR кода наверняка.

Вот список функций которыми как правило оснащаются ридеры QR кодов:

  • Отображение текста
  • Установка системных оповещений
  • Добавление событий в календарь
  • Открытие ссылок в браузере
  • Добавление контактной информации (включая vCards)
  • Отправка письма
  • Отправка SMS
  • Геолокация
  • Звонок на другие телефоны
  • Подключение к WiFi

Идеи использования URI схем

Так как браузеры уже имеют возможность отправки email через mailto URL (браузеры поддерживают URI схемы уже много лет). Может использовать тот же метод, чтобы расширить функциональность других приложений, которые имеют не стандартные схемы URI?

Ответ: да!

Если приложение поддерживает схему и оно установлено у пользователя, то оно будет прекрасно работать в независимости от того какой именно QR-код-ридер он использует.

Возможности

Вот список некоторых интересных возможностей:

  • Запуск родных Apple приложений (Mail, Телефон, FaceTime, Текст, Карта, YouTube и iTunes)
  • Запуск JavaScript букмарклетов
  • Открытие определенных IM клиентов (Skype, AIM, MSN, GTalk, ICQ и Yahoo)
  • Открытие специальных инструментов (IRC интрументы, RSS ридеры, FTP клиенты и SVN репозитории)
  • Открытие других приложений, которые выполняют URI схемы

Что делает эту технологию такой удивительной, это то что она не опирается на продвинутость QR-код ридера; все что нужно — приложение, которое вы хотите запустить (будь то Skype, Evernote или Angry Birds) и интерфейс с API для регистрации URI схемы.

В случае с Apple, это Cocoa Touch Open URL метод обмена UI Application объектами, а для других платформ (таких как Android), имеют что-либо аналогичное.

QR код и URI схема

от сканера к браузеру и к приложению — возможности безграничны!

Ниже список некоторых общих не-http URI схем:

Приложение URI схема или протокол Строка запроса
Default e-mail application mailto:<email>?query Subject
CC
BCC
Body
Default phone application tel:<number> N/A
Default SMS application sms:<number> N/A
Chat Room client irc://<url>:query port
channel
password
Syndication feed reader feed:<url> N/A
Apple FaceTime facetime:<number> N/A
Skype client skype:<username|number>?query add
call
chat
sendfile
userinfo
Google Talk client gtalk:query?<email> chat
call
Windows Live Messenger client msnim:query?<email> add
chat
voice
video
Yahoo! Messenger client ymsgr:query?<email|number> sendim
addfriend
sendfile
call
callPhone
chat
im
customstatus
getimv
AOL Instant Messenger client aim:query?<username> goim
goaway
addbuddy

Что это означает для нас? Есть действительно довольно много приложений для рабочего стола (а также мобильных), которые уже используют URI схемы.

Возьмем Skype, например. Вы хотите чтобы люди могли захватить QR код, который заставляет их телефоны звонить вам через Skype? Это можно сделать (по крайней мере в iOS) прямо сейчас.

Он так же может быть использован для запуска некоторых родных приложений, запуска JavaScript букмарклетов (возможно в том числе приложения выполняемые в браузерах) и доступа к обычным FTP и IRC протоколам (если ассоциирован с чем-либо).

Вот некоторые полезные ссылки для разработчиков:

Теперь, когда вы знаете немного больше о QR-кодах и получили краткий обзор вещей, которые нужно знать, чтобы начать работу, я опишу шаги по технологии ниже.

Примечание: Технология, которую я буду описывать ниже может быть использована для выполнения JavaScript кода, так при неправильном использовании, это может быть уязвимостью.

Шаг 1: Выберите ответ, который вы хотите ипользовать

Во-первых, определитесь какой QR код вы хотите использовать. Очевидно, что вы можете использовать обычный QR-код генератор событий — таких как отправка текстовых сообщений на телефоны и отправка электронной почты — но давайте попробуем что-то сложнее.

Мы создадим Skype QR код, который автоматически запустит приложение и выполнит голосовой вызов Skype контакта. Это будет работать только при условии, что пользователь сканирующий QR имеет установленный Skype.

Шаг 2: Создадим URL используя сервис URL-укорачивания

Множество QR-код генераторов страдают особой проблемой: если вы пытаетесь передать в них mailto или другую не-http ссылку, они иногда думают, что произошла ошибка (это так же затрагивает некоторые приложения-ридеры).

Это, конечно же, не позволит нашему Skype запуститься, поэтому нам нужно другое решение — и, к счастью, существует нечто что может помочь получить URL браузеру (и поможет web разработчику мониторить статистику кликов)!

Начинаем использование сервиса укорачивания URL. Эти сервисы редко суетятся по поводу того, что вы в них передаете и выдают хорошо сформированные URLs с HTTP загаловками необходимыми для лучшей совместимости (многие QR ридеры знают как открыть простейшие URL).

QR код и URI схема

Сервис укорачивания URL, такой как TinyURL сделает нетрадиционные URL в целом приемлемыми.

Для этого QR, мы вызовем Skype контакт по имени echo123 — это контакт теста качества голоса предлагаемый Skype.

Для нашего URL укорачивающего сервиса, я буду использовать TinyURL, но вы можете использовать один из многих других сервисов по укорачиванию URL, таких как bitlyis.gd и так далее.

Просто вставьте выбранную вами URI схему в укорачиватель.

Это результат  конверсии моего URI TinyURL:

URL skype:echo123?call
To http://tinyurl.com/echo123skype

Если вы кликните по ссылке выше, то увидите следующее (если вы используете браузер Google Chrome в Windows):

QR код и URI схема

Шаг 3: Генерация QR кода

Итак возьмем сгенерированный URL — который обычно работает в десктоп версии Skype установленном под Windows или Mac — и сгенерируем рабочий QR код из него.

Проверим что наш укороченный URL работает в web браузере; ссылка должна запустить Skype.

Существует множество вариантов, когда речь заходит о способах генерации QR-кодов; бесплатные инструменты существуют во всем Интернете.

Ниже примеры некоторых бесплатных генераторов:

  • QR Stuff (онлайн инструмент)
  • QREncoder (Mac приложение)

QR код и URI схема

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

Ниже примеры некоторых бесплатных QR-ридеров для мобильных платформ:

Что должно произойти если следующие инструкции выполнены верно и мы имеем установленный Skype:

  1. QR должен быть идентифицирован QR ридером
  2. QR ридер уведомит, что QR код содержит URL (таким образом пропустив причуды различных QR ридеров)
  3. TinyURL ссылка откроется в браузере по умолчанию
  4. Он выполнит переадресацию на схему URI Skype-вызова и запустит Skype

Просто удивительные вещи для одного умного изображения!

Единственное, что осталось сделать с вашим замечательным творением — его на веб-сайт (как у меня готовый пример ниже). В качестве начальной практики я рекомендую снимать изображения QR прямо с монитора.

Кроме этого вы можете украсить ваши QR коды различными цветами или некоторыми произведениями искусства если чувствуете дополнительную креативность.

Финальный QR код

QR код и URI схема

QR код выше вызовет echo123 в Skype если он установлен.

Заключение

Мощность этой технологии лежит в возможности которые она дает дизайнерам и разработчикам. URI схема существует между разработчиками приложений и браузерами поддерживающими их (схемы).

Используя простой редирект и эти прекрасно поддерживаемые функции, вы можете запускать приложения, взаимодействовать с кодами запросов, выполнять JavaScript и делать другие удивительные вещи.

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