Как студия разработки игр в Мюнхене использует WordPress и Gutenberg для обслуживания своего сайта

Дата публикации:Август 24, 2018

Mimimi, удостоенная наград студия разработки игр в Мюнхене, запустила свой новый сайт на WordPress. Этот сайт является интересным примером использования Gutenberg. По фронтэнду этого не сказать, но если заглянуть внутрь, можно заметить, что на сайте используется новый блочный редактор, позволяющий управлять разметкой на базе произвольных блоков. Это дает возможность Mimimi легко обновлять разные разделы своего сайта.

Luehrsen Heinrich, местное рекламное агентство, создало сайт с произвольной темой и 7 блоками, разработанными для поддержки требований Mimimi по редактированию публикаций.

«Главная задача состояла в том, чтобы создать элегантный веб-сайт, который легко и быстро поддерживать, и где позднее можно было бы добавить секцию блога/новостей», – отметил Хендрик Люрсен, директор Luehrsen Heinrich. – «Мы знали, что в команде клиента работают креативные, продвинутые в техническом плане специалисты, которые доверяют нам. Отсюда и появилась наша уверенность в использовании Gutenberg».

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

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

«Я был вполне уверен, что мы можем использовать одну и ту же разметку для 80% случаев, группируя абзацы, изображения и столбцы. Однако мы не хотели, чтобы наш клиент тратил уйму времени, чтобы разместить простое изображение», – отметил Люрсен. – «Потому логичным для нас стало создание блока с разметкой».

На сайте Mimimi также используется произвольный блок регистрации в Mailchimp и произвольный блок-разделитель, который предлагает больше гибкости и адаптивности в задании конечных точек.

«В целом мы (и наши клиенты) очень довольны результатом», – отметил Люрсен. – «Мы видим будущее WordPress в адаптации этого блочного редактора. Однако еще предстоит долгий путь по доведению его до ума. Есть вещи, которые по-прежнему требуют обстоятельной работы».

Также Люрсен отметил, что его команда по-прежнему дорабатывает стили бэкэнда для редактора, и по этой причине стили фронтэнда и бэкэнда сильно отличаются друг от друга. Пока они еще не нашли удобный в поддержке, стабильный способ применения глобальных стилей к редактору Gutenberg. Если закрыть глаза на эти нерешенные проблемы, агентство полностью поддерживает новый редактор – в ближайшем будущем специалисты Luehrsen Heinrich планируют выпустить еще один продукт Gutenberg для других клиентов.

Отзывы о Gutenberg от Mimimi Games: редакторам нравится блочная концепция, но пока остаются проблемы с юзабилити

Йоханнес Рот, генеральный директор Mimimi Games, отметил, что его команда уже работала ранее с WordPress. По мнению разработчиков, Gutenberg является важным улучшением процесса редактирования контента.

«Мне он очень нравится, честно!», – отметил Рот. – «Гораздо проще понять, как создать и как настроить страницу. Если в Gutenberg появятся и другие улучшения опыта взаимодействия, то, по моему мнению, он станет новой вехой в управлении страницами. Мне он показался очень простым и понятным, даже учитывая, что он еще официально не выпущен».

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

«Стало гораздо меньше отвлекающих факторов, странных тулбаров, и теперь весь фокус сделан на контенте», – говорит Рот. – «Это напоминает то, как мы воспринимаем отделение форматирования от контента, настройку страниц с целью SEO».

Рот описал две вещи, которых были в прошлом редакторе и которых не хватает команде Mimimi:

  • Нажатие tab для отступов в маркированных списках и shift tab для отмены
  • Использование ctrl+a для быстрого выбора всего текста внутри блока (иногда он выделяет всю страницу).

«Самая крупная проблема с юзабилити на текущий момент – комбинация блоков и столбцов, что сильно усложняет нажатие на иконку ‘…’, поскольку зоны наведения курсора мыши накладываются друг на друга», – отметил Рот.

Почему Luehrsen Heinrich решили обратиться к разработке под Gutenberg

Люрсен отметил, что его агентство решило прибегнуть к Gutenberg в прошлом году после WordCamp Europe. Тогда они отказались от своих идей по созданию нового конструктора страниц.

«Еще за месяц или два перед WCEU в Париже мы начали работать над концептом и альфа-версией нашего собственного конструктора страниц, в котором использовался схожий блочный подход», – отметил Люрсен. – «Выступление Мэтта заставило нас быстро понять, что наш проект уже устарел. Нам повезло, что мы очень быстро прошли все пять стадий разочарования. Мы изменили свои приоритеты и приступили к работе с Gutenberg где-то в конце октября или в ноябре 2017».

Luehrsen Heinrich – небольшое агентство, состоящее из четырех человек. Все они по-разному связаны с Gutenberg. Люрсен – активный участник разработки редактора. В команде также есть разработчик, который детально знает весь процессов создания блоков, дизайнер, проектирующий опыт взаимодействия и стиль блоков, а также менеджер проектов, который работает с клиентами и уточняет их требования к процессу редактирования в Gutenberg.

Люрсен отметил, что внесение своей лепты в разработку Gutenberg очень сильно помогло ему понять процедуру создания блоков, несмотря на отсутствие опыта работы с React и ES6.

«Работа с Gutenberg, внесение своего вклада в проект, получение быстрой обратной связи от потрясающей команды Gutenberg – все это помогло нам быстрее наладить весь процесс», – поделился своими эмоциями Люрсен. – «Наш текущий процесс создания блоков во многом зависит от работы Гэри, Адама, Матиаса и всех остальных – за исключением того, что мы используем LESS, а не SCSS. Однако в плане структуры папок, процесса сборка и структурирования файлов мы стараемся следовать за репозиторием Gutenberg, поскольку это упрощает выявление и отладку проблем».

После успешной разработки сайта для Mimimi Games команда Люрсена решила создать еще больше клиентских сайтов на базе нового редактора. Люрсен считает, что предложение лучшего опыта взаимодействия отвечает ценностям клиента.

«Наши клиенты разделяют нашу уверенность в том, что сторителлинг в современной сети – это нечто большее, чем просто написание текста», – отметил Люрсен. – «TinyMCE хорошо зарекомендовал себя как «Rich Text»-редактор, однако объединение разных типов медиафайлов в связную историю становилось существенной проблемой, учитывая все эти метаполя, шорткоды, тизеры, ради которых даже порой приходилось покидать экран редактирования. Gutenberg предлагает все это в удобной, элегантной форме. Если вы можете получить хороший результат быстрее, то эта экономия времени – то, за что платит клиент».

Источник: wptavern.com

Оставить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Получать новые комментарии по электронной почте. Вы можете подписаться без комментирования.