Привет, это Коля из студии веб-разработки GRCH! Мы разрабатываем, поддерживаем и масштабируем цифровые продукты. Компания Woerwag пришла к нам за закрытым корпоративным порталом. Цель — довольные и сплочённые сотрудники. Эта задумка показалась нам очень милой и классной, поэтому тут же начали работу над проектом. Рассказываем, как сделали портал и дошли от идеи до целого космоса — со своими кораблями и пилотами 🛸КлиентWoerwag — международная фармацевтическая компания. Начала свой путь более 50 лет назад в Германии, а сейчас предлагает лекарства и БАДЫ в 35 странах, включая нашу. Например, Цинкит, Магнерот, Д3-Гамма и другие препараты.ЗадачаСоздать закрытый портал для проведения активностей, чтобы сблизить сотрудников.Какие возможности должны быть в системе:— проведение викторины и опросов,— загрузка пользовательского контента,— награждение по итогам активностей.Заказчики не хотели, чтобы «Woerwag Game Project» была связана с брендом и направлением компании. Вместо этого осталось пожелание — взять тему космоса и сделать это креативно. Что мы и сделали :)Сейчас расскажем, как прошли путь от концепции до реализации 🚀КонцепцияМы пошли нестандартным путём — начали не с разработки прототипа, а с концепции. За референс взяли атмосферу игр 2000-х и подготовили несколько вариантов.Клиент полностью доверял нашему опыту в веб-дизайне, поэтому мы с первого раза выбрали и согласовали концепцию.После этого перешли к разработке функционала и дизайна. Сейчас расскажем, что именно мы детально прорабатывали, чтобы вписаться в концепцию космоса.Космическое пространствоМы хотели, чтобы сотрудники с первых касаний погружались в космическое пространство. Поэтому стилизовали регистрацию под анкету пилота.Когда ты логинишься, то видишь на экране визуал и текстовый контент в стиле платформы. Ты не просто пользователь, а пилот. Больше нет имени и должности! Есть позывной.Для входа пользователь вводит логин и пароль, выбирает свой корабль (подразделение компании). И начинает прохождение.Уникальные кораблиДля каждой команды придумали свои корабли, которые делятся по подразделениям.Пилоты летают на кораблях по планетам и выполняют задания. Чтобы было удобно перемещаться по страницам, мы продумали меню.Горизонт событийЗаказчик хотел добавить функционал загрузки фотографий на портал. Мы посмотрели разные варианты и предложили ориентироваться на механику запрещенной социальной сети.Так у нас получился свой бортовой журнал с событиями и лайками.ПланетыМы разработали платформу с планетами: Меркурий, Марс, Венера и Юпитер. У каждой есть своя активность и назначение. Например, на Венере и Юпитере реализовали загрузку пользовательского контента с лайками.У каждой планеты есть свои отличия. Сейчас расскажем.Меркурий — планета с квизамиВ каждой викторине есть 5 вопросов, на которые дается 30 секунд.За каждый правильный ответ пилот получает баллы. Мы добавили вопросы о компании, чтобы сотрудники больше узнали о месте, где работают.Марс — планета предложенийПилот рассказывает, что полезного и инновационного он придумал для компании. И если предложение набирает больше всего лайков, то рейтинг пилота повышается вместе с шансом стать руководителем.Венера — планета фотоКлиент задает тематику, а сотрудники делают фото в рамках заданной темы и получают за них лайки.Юпитер — планета активности, похожая на ВенеруЭто командный блок, где сотрудник публикует предложение, но баллы получает вся команда.Панель администратораЧтобы активностями и контентом было удобно управлять, мы настроили административную панель на базе Django.Теперь без нашего вовлечения клиент может модерировать викторины и фото челленджи, управлять персональным и командным рейтингами портала.Что получилось в итогеВовлечь пользователейВ этом нам помогли игровые механики типа квиза или командных блоков с баллами.Унифицировать способы взаимодействияКроме игрового взаимодействия мы сделали стандартное, поэтому аудитория любого возраста может участвовать в игре :)Настроить административную панельКлиент может самостоятельно модерировать викторины и фото челленджи, управлять персональными и командными рейтингами портала.Что про нашу работу думает клиентЗа время совместного сотрудничества сотрудники Web-студии «GRCH.Digital» продемонстрировали высокий уровень профессионализма, безукоризненное соблюдение профессиональной этики и широкий спектр компетенций, оказывая нам активную и результативную поддержку в решении текущих задач. Выражаем уверенность в сохранении профессиональных взаимоотношений, надеемся на продолжение плодотворного сотрудничества!Говорит генеральный директор ОльгаСтекНа проекте мы использовали React JS + Python.С самого начала общения с клиентом мы предполагали, что сайт получится достаточно динамичным — с плотным насыщением различного рода 2D-анимациями. На самом проекте мы уже учитывали масштабирование — клиент планировал добавлять новые планеты, активности и решения по анимации.React позволяет удобнее управлять локальным состояниемТакже, закрывает вопрос оптимизации, за счёт «умной» отрисовки/перерисовки компонентов. Благодаря этому, приложение откликается быстрее и пользователю визуально приятнее.Django CMS же упрощает и ускоряет разработку веб-приложенияСама структура проектов на Django имеет достаточно модульную систему. Это позволяет разбить проект на компоненты и разрабатывать каждый отдельно. Так мы убираем путаницу в проекте и переписывание одного и того же кода.Разработчики следят за безопасностью, а это значит, что в проектах Django изначально есть различного рода защиты безопасности.Пишите в комментариях, какой корабль бы выбрали и на какую планету полетели?А ещё поделитесь, что бы вы улучшили в проекте и почему? Будет интересно узнать ваше мнение со стороны дизайна и разработки :)Приходите к нам за разработкой и тестированием. Мы подумаем о реализации, подскажем технические моменты и займемся разработкой. Пишите нам на почту hello@grechka.digital или сразу оставьте заявку на сайте.Заглядывайте в наш телеграм канал, где мы пишем о работе с клиентами, кейсах и внутрянке студии.