Несколько дней назад я был взволнован программистом из Сина, и мне пришлось пойти, чтобы исправить ошибку на свадьбе. Это было до Лухана. Увидев это, я думал о моей свадьбе, который также был в национальном дне года назад. Когда еще месяц до свадьбы, я подумал, что это будет большим событием в моей жизни. Я бы сделал что-то охлаждение перед многими родственниками и друзьями, так что это впечатление всех.
как быть круче
Я надеюсь, вы видите это название и не думаете, что оно предназначено для того, чтобы мои друзья затащили меня в побег 😱. Должно быть круто собрать всех гостей на месте для участия, да, это должно быть круто. Судя по опыту участия в чужих свадьбах в прошлом, процесс, вероятно, выглядит следующим образом: ведущий проводит жениха и невесту, чтобы они вошли в зал, жених и невеста дают друг другу клятвы, родители жениха и невесты принимают сцена, а затем вся публика вместе произносит тосты за молодоженов и, наконец, ест до конца свадьбы. За исключением одного тоста, гости все время были прохожими, и ощущение сопричастности было очень низким. На некоторых свадьбах будет какое-то взаимодействие, которое полностью зависит от личного стиля ведущего.
Для мобилизации сцены практика местного тирана стоять на сцене и бросать красные конверты явно не подходит для тупоголового меня. Сейчас почти у каждого есть смартфон и у каждого есть WeChat, поэтому я подумал, можем ли мы использовать WeChat, чтобы позволить всем участвовать. Каждый может послать благословение на стену, и тогда на большом экране отобразятся все благословения в виде шквала. После того, как вы отправите свои благословения, вы сможете увидеть свои аватары и благословения на большом экране.Чувствуете ли вы след удовлетворения в своем сердце?
Сначала я хотел создать публичную учетную запись, и каждый мог отправлять благословения прямо в поле ввода, но позже мне это показалось слишком жестким и скучным, поэтому я сдался.
Создайте веб-сайт WeChat, который вы можете посетить, не обращая внимания, и сделайте веб-страницу в виде приглашения, и вы можете поделиться ею со всеми заранее. Так чего же вы ждете, сделайте это.
Засучи рукава
Три элемента традиционных приглашений: время, место и люди, три элемента моих приглашений: регистрация заезда и заграждения. Я провел две недели в свободное время, во время которого моя невестка также помогла фотографиям. Готовый продукт выглядит так:
стек технологий
Однако технологии вешать небо нет, потому что сроки разработки имеют обязательный срок, не хочу пропускать свою свадьбу из-за разработки этого 😂. Таким образом, выбранные технологии являются одними из наиболее знакомых и нестандартных.
Предыстория: Mysql, Nodejs, Sails, Sequelize, Bluebird;
Внешний интерфейс: WeUI, jQuery, jquery.fullPage, slick, CommentCoreLibrary (заграждение CCL), карта Gaode, iconfront.
Обновление данных экрана пули в реальном времени — это простейший короткий опрос, ничего больше, просто стабильное слово.
Если у вас есть опыт открытия, вы обнаружите, что после просмотра нескольких фоновых фотографий, независимо от того, находится ли объект на фотографии слева или справа, он должен отображаться в центре вашего зрения, поэтому чтобы вы могли сразу увидеть его после открытия.Мы 😘. Это не высокоуровневая технология, она заключается в том, чтобы заранее измерить смещение центральной линии основного тела каждой фотографии, а затем прописать его в атрибутах тега изображения. Как показано на рисунке ниже, белый цвет представляет фотографию, зеленый — экран телефона, а два круга — объект фотографии.
Некоторые ямы возникли
Яма WeChat
После того, как я его закончил, он был развернут на моем собственном сервере, и доменное имя не было прописано.Все прошло гладко, когда я просто поделился им. Но позже некоторые люди сообщили, что их невозможно открыть или открыть пустыми.После захвата пакета было обнаружено, что WeChat перехватывает общий URL-адрес перед открытием.Если доменное имя не записано, он может только попрощаться.
WeChat также будет напоминать пользователям о необходимости соблюдать безопасность и остерегаться утечек, когда поле ввода получает фокус. Это тоже очень раздражает.Отправьте благословение и обратите внимание на безопасность 😥. Однако этот белый список доменных имен может быть установлен в официальной учетной записи, конечно, при условии, что доменное имя должно быть зарегистрировано.
заграждение ям
Методы рендеринга по умолчанию библиотеки CCL danmaku были слева и сверху в целях обратной совместимости. Однако производительность на стороне мобильного телефона просто невыносимая.В то время была версия v0.10.0-rc, которая тестировала метод рендеринга с помощью css3.После его обрезки эффект был близок к стороне ПК, и это был использован сразу. Теперь методом рендеринга CCL по умолчанию является css3, поэтому нет необходимости наступать на эту яму.
метод ввода яма
При использовании китайского метода ввода нижняя часть ввода и верхняя часть клавиатуры не может соответствовать идеально. Эта яма не была заполнена до сих пор, эта статья"Коробка ввода мобильного терминала, засыпная яма серии (1)"кажется, дает решение.
Это только начало
Завершение разработки продукта — это не конец, а начало. Как сливать трафик, баги в продакшене и так далее.
Как привлечь всех на сайт
Сканировать код на приветственном входе? Таким образом, вы можете присоединиться только один раз, и вернуться после выхода будет сложно.
Добавить группу на месте и прислать ссылку в группе? Вроде бы неплохой способ, но большинство гостей относительно старые, и здорово, что есть возможность сканировать код с помощью WeChat, им пока сложно влиться в группу на месте.
QR-код проецируется на большой экран? Это сказывается на красоте большого экрана, а отсканировать код в бэкворде практически невозможно.
Наконец, я придумал локальный способ распечатать QR-код на маленькой карточке и разложить несколько штук на каждом столе. Поэтому я случайным образом разработал стиль маленьких карточек и нашел типографию на ТБ, где можно напечатать более 100 листов, и стоимость по-прежнему относительно низкая.
QR-код на карте все еще действителен, но лотереи теперь нет😂, вы можете отсканировать его с помощью WeChat, чтобы испытать его.
После свадьбы была собрана статистика, на месте было более 300 человек, а благословения прислали более 150 человек, такой коэффициент конверсии еще приемлем.
Как получить на сайте большой экран
Выше говорилось только о веб-терминале WeChat, На самом деле, для завершения всего взаимодействия есть важная часть — большой экран на сайте. Большинство больших экранов отеля представляют собой большие экраны со светодиодной склейкой, которые не похожи на компьютерные мониторы, имеющие четкое разрешение. В это время я позвонил и спросил на стойке регистрации отеля, какое разрешение у большого экрана, и они тоже были в замешательстве. Позже я посоветовался с друзьями, которые делали большие экраны, и узнал, что они вообще не говорили о разрешении, только о размере, и сказали мне идти в равных пропорциях, поэтому я тоже был сбит с толку. В любом случае, на всякий случай сделал несколько адаптивных размеров.
На большом экране не так много взаимодействий, и все они автоматически воспроизводятся или отображаются статично.
Как нарисовать
На большом экране есть интерфейс лотереи. Эта лотерейная ссылка по-прежнему требует сотрудничества ведущего и закулисного персонала. Ведущий выдает пароль, а закулисный персонал контролирует начало и окончание лотереи в соответствии с паролем. В процессе общения с ведущим перед свадьбой ведущий выразил свое восхищение: после проведения свадьбы более десяти лет я впервые вижу такую интересную форму. В этот момент я был радостен и напуган, опасаясь, что сцена будет испорчена.
Что касается алгоритма лотереи, то это простой и совершенно случайный выбор.Предложение «Говорят, что у тех, кто хорошо выглядит и много благословений, больше шансов выиграть в лотерею» - это просто маленькая шутка, чтобы побудить всех посылать благословения (кажется немного дешево, беги~~). Кандидаты — это все гости, которые вошли в систему на месте происшествия. Они могут автоматически войти в систему на месте происшествия, отсканировав QR-код на маленькой карточке выше, что также избавляет гостей от дополнительных операций.
некоторые другие незаконченные идеи
После того, как я закончу его в WeChat, я поделюсь им со своим кругом друзей. Через некоторое время я получил много благословений.Чтобы поблагодарить всех, я отправил красный конверт с паролем в заграждение.Количество просмотров взорвалось мгновенно, а маленький сервер водопровода был немного невыносим. Это дало мне хорошее вдохновение, поэтому я хотел установить временную задачу в фоновом режиме и получить шокирующий дождь из красных конвертов с паролем на сцене свадьбы. Однако позже эта идея была отложена другими вещами, и было немного жаль, что ее не добавили.
One more thing
Одновременно с публикацией этой статьи я также намерен открыть исходный код этого пыльного проекта на год. Желаю всем любителям форкеров пожениться.
адрес проекта:iammapping/wedding