Unlimited Wordpress themes, plugins, graphics & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Web Design
  2. Global Influences
Webdesign

WeChat сделает за вас всю грязную работу: создаем дизайн для самой крупной китайской социальной сети

by
Length:LongLanguages:

Russian (Pусский) translation by Alex Bogdanov (you can also view the original English article)

Мне было непросто дать понять моим западным коллегам, почему я постоянно говорю про WeChat (По-китайски Weixin 微信)  в контексте веб-дизайна. На западе социальные сети и веб-дизайн мыслятся как отдельные вещи, хоть и взаимосвязные. Но с Китаем все по-другому. Меня могут за это упрекнуть, но я все равно скажу:

"В современном Китае веб-дизайн – это дизайн в WeChat." – я

В текущий момент являющийся наиболее популярным приложением в страну, число пользователей WeChat (включая иностранцев) составляет 500 миллионов пользователей на 2015 год. Но несмотря на эти цифры, я не смогу перечислить все разы, когда западные команды дизайнеров бегло смотрели на WeChat и сразу же его отметали.

"Да ну, это ведь мессенджер с парой дополнительных функций."

"Нет." – кричала я в ответ, потрясая их справедливой жесткостью. "WeChat – не мессенджер, это образ жизни с функцией чата. Он помогает забронировать билеты на поезд! Он помогает забрать вещи из химчистки! Это интернет внутри интернета!"

И этоо настолько повсеместьно, что смышленные веб-дизайнеры из Китая и разработчики приложений концентрируют свое внимание создании вещей, сделанных под конкретную платформу. Если вы создаете диджитал продукт для Китая, обязательно нужно знать, чем занимаются ваши конкуренты в WeChat, а также представлять возможные варианты представлять превосходящий конкурентов опыт взаимодействия с пользователями.

Обзор возможностей

Справедливо, неверящие: на первый взгляд WeChat выглядит как платформа для обмена SMS с парой функций. Четыре вкладки UI не намекают ни на какую глубину контента:

Ваш экран чатов, где показаны последние диалоги.
Список контактов.
Вкладка "Поиск", или как ее описывает Дэн Гровер в его статье о трендах в UI в китайских приложениях: "Вкладка поиска вмещает в себя зоопарк из веселых, неосновных функций, которые расширяют опыт пользователей."
KUMITEEEEE! Лента "моментов" (расположенная внутри вкладки "Поиск"), которая собирает фотографии, альбомы, ссылки и прочие обновления от всех ваших контаков в WeChat.
И вкладка пользователя.

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

WeChat разделяет аккаунты на два типа: личные аккаунты (ваши друзья, ваша мама) и оффициальные контакты (бизнесы, лайфстайл, медиа, правительство). Взаимодействие с личными аккаунтами работает вполне предсказуемо: вы можете общаться посредством текста и голосовых сообщений, начать VoIP звонок, просматривать текстовые, фото и видео обновления ("Моменты") и управлять групповыми чатами.

Но официальные аккаунты – это то место, где начинается магия. Когда компания подает заявку на официальный аккаунт, она получает доступ к платформе публикаций, которая позволяет ей создать небольшой лэндинг внутри WeChat, анимированный сайт с одной функцией, которым можно поделиться (они называются Light Apps или 轻应用) с подержкой микро-инструментов HTML5.

Так что как только список контактов и чатов становится качественным, появляется довольно мощная функциональность.

Еще пара вещей, о которых вам следует знать:

WeChat имеет свой собственный браузер

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

У браузера WeChat нет строки с URL адресом сайта и вы не можете вручную вставлять веб-адреса в WeChat. Браузер WeChat не имеет страниц, в нем невозможно открыть больше одной вкладки. Он открывается только если вы нажмете ссылку внутри WeChat, либо воспользуетесь встроенным сканером QR кодов.

Но это не говорит о том, что вы не можете перейти из приложения куда-то, если вам понадобится – просто это не поведение приложения по умолчанию.

В меню браузера WeChat есть функция "Открыть при помощи браузера", так что переместить страницу в браузер вручную возможно.

Сканер QR кодов в WeChat – это что-то

О чем и речь: я знаю, что западный мир сейчас помешан на QR кодах, но, в большей степени благодаря WeChat, Китай их обожает. В WeChat есть не только встроенный сканнер, но также у каждого аккаунта есть свой индивидуальный QR код, который можно распечатать на визитках, использовать для выставления счетов или отсканировать с телефона на телефон. Весьма привычно услышать "Мне отсканировать тебя или или это сделаешь ты?", когда друзья обмениваются контактами в WeChat.

Отсканируйте меня?  Но сперва купите мне напиток.

Сканирование QR кодов фундаментально для официальных аккаунтов. Вот фотография, которую я сделала на 2015 GMIC, крупнейшей конференции в Азии по мобильным устройствам, где десятки людей собирались вокруг стенда, покрытого QR кодами, каждый из которых помогал отслеживать конференцию, а пользователи могли держать открытыми вкладки в WeChat, чтобы отслеживать конференцию. Выберите и отсканируйте треки, которые вам интересны, и получайте уведомления по ходу дня.

WeChat имеет свой кошелек

В 2014 году WeChat присоединился ко множеству прочих китайских гигантов, выпустивших свой кошелек, чтобы иметь возможностьь конкурировать с крупнейшим в Китае Alipay. В кошельке можно иметь свой баланс, пополнять напрямую с краточки и банковских счетов, переводить деньги другим пользователям, получать деньги посредством QR кодов, а также проводить платежи в сторонних приложениях, которые подключили интеграцию WeChat кошелька.

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

Слева направо: вызвать такси, сделать покупки на Jing Dong, пополнить ваш QQ счет, отправить "red envelop" (денежный подарок), выпить/перекусить/поиграть с помощью Dianping, кредитные карточки, благотворительность, купить билеты в кино, "go dutch", купить билеты на поезд или самолет.

Вот окно покупки билетов на самолет и поезд – просто выберите дату отъезда и оплатите при помощи кошелька WeChat, все внутри приложения.

Есть даже функция "go dutch", когда при встрече с друзьями вы сможете раздлить счет поровну между всеми.

Из-за интеграции кошелька в приложение, вы можете переводить деньги через чаты.

Т.к. кошелек полностью встроен в платформу, вы можете переводить деньги в один клик прямо из окна чата. Вот я отправляю 200 юаней:

Перенос файлов с телефона на компьютер

Это одна из тех функций, которую вы не поймете, пока не воспользуетесь ей, а потом подумаете, как вы вообще могли жить без нее. WeChat также имеет десктопную версию приложения, созданную для быстрого переноса файлов с телефона на компьютер (также полезно, когда нужно написать длинное сообщение и вы не хотите этого делать с маленькой клавиатуры). Это уникальный опыт пользования на двух устройствах, так что давайте на него подробней:

Сначала вы заходите на web.wechat.com в вашем десктопном браузере.

Заметили QR код на лэндинге? Берите телефон, открывайте WeChat и используйте встроенный сканнер QR кодов. Теперь вы залогинились на обоих устройствах:

Как только вы залогинитесь, в вашем списке чатов на обоих устройствах сразу появится специальный аккаунт "Передача файлов":

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

Это самостоятельная экосистема

Списки друзей. Платформа для взаимодействий. Функции социальных сетей. Проведение платежей. Веб-браузинг. Знаете, что из этого получается? Целая самодостаточная вселенная. И бизнес компании стали весьма творчески подходить к использованию этих возможностей в своих целях. Взглянем на это?

Рассмотрим примеры

В дополнение к функции чата, WeChat позволяет официальным аккаунтам создавать лэндинги с максимум тремя пунктами меню, в каждом из которых может юыть максимум пять подпунктов. Это 15 возможных страниц. Вот навигация по официальному аккаунту Diangpung (красная), с выпадающим списком (синий).

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

Например, взгляните на профиль Alina, официальный аккаунт блоггера на тему вегетарианского образа жизни. Третий пункт меню переводится как "О нас". По этой ссылке вы перейдете на статью, где Alina объясняет, как она пришла к такому образу жизни. Нажми кнопку и получи предзаданный контент: очень простой способ коммуникации.

Вот более интересный пример: дизайн-команда в Tencent Games, известные как TGIdeas; у них свой вдохновляющий аккаунт в WeChat, в котором они делятся прогрессом своих проектов и списками хороших мобильных игр. Если вы нажмете на указанный пункт, то вы попадете на курируемый TGideas список HTML5 игр, в которые вы сможете поиграть прямо в браузере WeChat.

Первое автоматическое сообщение от TG ideas, которое приходит сразу послк подписки. Третий пункт меню открывает список игр в браузере WeChat.
Список доступных игр, отображающийся в браузере WeChat.
Начало игры, прямо в браузере.

Игра располагается не в WeChat.  Она выложена где-то в другом месте. Но TGideas использовали свой WeChat, чтобы привязать к нему свой список игр. И поскольку пользователь не покидает приложения, то опыт взаимодействия остается внутри приложения.

Вот еще несколько оригинальных примеров приложений в WeChat.

Инновации

Служба поддержки в трэвел индустрии: Ctrip

Вы занятой человек. У вас нет времени сидеть и ждать ответа. Но когда у вас возникает проблема, вам бы очень и очень сильно хотелось взаимодействовать с реальным человеком. Что, если вы смогли бы быстро сообщить компании о проблеме и они бы отправили вам чат с доступным сотрудником?

Ctrip — один из крупнейших сайтов бронирования путешествий в Китае. И он это может. Вы отправляете сообщение в их официальный аккаунт и вам ответят сразу как только кто-то освободится.

Предоставление сервиса посредством SMS в WeChat становится нормой, так что я не буду здесь много говорить: если вы планируете сделать бизнес в Китае и не рассматриваете WeChat, как первый важный шаг, вы не сможете выйти на ваш рынок. Лучше подсуетиться.

Общественный фитнес: Спорт WeChat  (微信运动)

Зачем скачивать приложение для подсчета шагов? Зачем вообще что-либо скачивать? Просто подпишитесь на официальный аккаунт WeChat Sport и каждые 24 часа получайте сообщение о том, сколько шагов вы за них успели сделать. Вы можете сравнить свой результат с другими людьми из вашего списка контактов, которые также используют WeChat Sport.

Число слева — ваша позиция относительно ваших друзей, число справа — количество шагов за день

Такси в WeChat: Dididache

Dididache — один из крупнейших аналогов Uber в Китае, сочетающий в себе индивидуальных водителей и рынок такси служб.

"Приложение в настоящем времени показывает местоположение машины на карте при помощи GPS и позволяет пользователям искать такси при помощи их смартфонов. Запрос пользователя будет направлен ближайшему водителю, который решит, принимать ему заказ или нет." — Crunchbase

Существует отдельное приложение Dididache, но — и это критически важно при выходе на китайский рынок — они также предлагают основной функционал через их официальный аккаунт в WeChat, где вы можете вызвать такси не выходя из приложения. Более того, вы можете оплатить поездку кошельком WeChat.

Пользователи могут зайти на профиль Dididache и нажать первый пункт меню, "Хочу вызвать такси".
Это направит их на стороннюю, адаптированную под мобильные устройства, страницу, где они смогут ввести свое текущее местоположение, место назначения и чаевые.

Такой подход популярен: предложить пользователям отдельное приложение, которые они смогут скачать в китайских сторах, и небольшое HTML5 приложение в WeChat. Этот подход очень быстро становится тем, что пользователи ожидают по умолчанию.

WeChat 020: прачечная

Вот еще один пример схожего подхода: очень популярный O2O сервис химчисток eDaiXi предлагает для скачки приложение, но их сервисом можно также пользоваться прямо через их аккаунт в WeChat, без сторонних загрузок. Зайдите в их официальный аккаунт, нажмите "Разместить заказ", привяжите свой номер телефона, заполните пару деталей и eDaiXi отправит кого-то к вам домой, чтобы он забрал ваши вещи. Они принесут их обратно , когда все будет готово.

Найдите и подпишитесь на профиль eDaiXi.
Привяжите ваш номер телефона.
Разместите заказ (большая синяя круглая кнопка).
Выберите желаемое время обслуживания и введите адрес. Все.

И опять, как только вы нажмете "Разместить заказ" в чате, вам перенаправят на сторонний мобильный сайт в браузере WeChat.

WeChat eCommerce : JingDong

В самом деле, с таким потоком денег вокруг, кто-то решит остаться прямо здесь. Если вы подпишитесь на ритейлера JIngdong в WeChat, вы получите доступ к их магазину-лэндингу.

Если вам интересно узнать больше про eCommerce прямо в WeChat, почитайте пост WalktheChat о пяти способах открыть магазин в WeChat бесплатно. Там идет речь о наиболее важных инструментах eCommerce для WeChat, включая преимущества и недостатки.

Заключение

На этом я остановлюсь, но список возможных приложений можно продолжать бесконечно: списки ожиданий ресторанов, которые сразу же вам отписываются, как только освобождается столик, онлайн карточки внутри WeChat для посещения спортзала, курируемые радиостанции. Если вы можете сделать что-то для мобильных платформ — значит вы можете сделать это и для WeChat. И если ваш бренд приходит в Китай, вам это просто необходимо.

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.