Jak monachijskie studio gier wykorzystuje WordPress i Gutenberg do zasilania swojej strony internetowej

Mimimi, wielokrotnie nagradzane studio gier z siedzibą w Monachium, uruchomiło nową witrynę WordPress, która zawiera interesujące studium przypadku Gutenberga na wolności. Chociaż możesz nie być w stanie odróżnić od frontendu, za kulisami nowy edytor oparty na blokach zasila układ niestandardowymi blokami, umożliwiając zespołowi Mimimi łatwe aktualizowanie różnych sekcji swojej witryny.

Luehrsen Heinrich, lokalna agencja reklamowa, utworzyła witrynę z niestandardowym motywem i siedmioma blokami dostosowanymi do wymagań redakcyjnych zespołu Mimimi.

„Ogólnym zadaniem było stworzenie eleganckiej strony internetowej, która jest bardzo łatwa i szybka w utrzymaniu, a która może później zawierać sekcję blogów/aktualności” – powiedział Hendrik Luehrsen, dyrektor generalny Luehrsen Heinrich. „Wiedzieliśmy, że nasz klient ma niezwykle kreatywnych i doświadczonych technologicznie ludzi, którzy nam zaufali. To dało nam pewność, że udamy się do Gutenberga”.

Witryna korzysta z bloku tła, który umożliwia redaktorom tworzenie różnych wzorów tła i falistych separatorów. Luehrsen powiedział, że działa z „InnerBlocks”, podobnie jak kolumny, więc może obsługiwać dowolny inny blok.

Witryna ma również niestandardowy blok Discord, który dynamicznie pobiera niektóre ustawienia, aby wyświetlić zestaw użytkowników z Discord, którego Mimimi używa do komunikacji wewnętrznej. Blok wyświetla zaktualizowany skład drużyny. Bloki mediów społecznościowych i gier umożliwiają redaktorom łatwe aktualizowanie tekstu i obrazów z już ustawionym układem.

„Jestem prawie pewien, że moglibyśmy zrobić ten sam układ do około 80%, łącząc kolumny, akapity i obrazy, ale nie chcieliśmy, aby nasz klient bawił się jak w MS Word, gdy próbujesz umieścić obraz” – powiedział Luehrsen . „Więc stworzenie prostego bloku układu było rzeczą logiczną”.

Witryna Mimimi używa również niestandardowego bloku rejestracji Mailchimp i niestandardowego bloku odstępnika, który zapewnia większą elastyczność i responsywne punkty przerwania.

„W sumie my (i nasi klienci) jesteśmy bardzo zadowoleni z wyniku” – powiedział Luehrsen. „Dzięki temu edytorowi opartemu na blokach możemy zobaczyć przyszłość WordPressa. Ale przed nami jeszcze bardzo długa droga, zanim naprawdę nie będziemy mieli już nic do wygładzenia. Są rzeczy, które nadal wymagają wiele pracy.”

Z perspektywy rozwoju, Luehrsen powiedział, że jego zespół nadal zmaga się ze stylami zaplecza dla edytora i że z tego powodu style frontendu i backendu bardzo się różnią. Nie znaleźli też jeszcze możliwego do utrzymania, stabilnego sposobu zastosowania globalnych stylów w edytorze Gutenberga. Oprócz tych nierozstrzygniętych kwestii, agencja cieszyła się budowaniem dla nowego wydawcy i ma kolejny produkt na stronie Gutenberga, który wkrótce zostanie uruchomiony dla innej grupy klientów.

Mimimi Games' Gutenberg Experience: Redaktorzy doceniają koncepcję bloku, ale wciąż napotykają problemy z użytecznością

Johannes Roth, dyrektor generalny Mimimi Games, powiedział, że jego zespół korzystał już w przeszłości z WordPressa i postrzega Gutenberga jako znaczące ulepszenie w edycji treści.

„Szczerze, absolutnie to uwielbiam!” powiedział Roth. „O wiele łatwiej jest zrozumieć konfigurację strony i dostosować ją. Jeśli edytor Gutenberga uzyska kilka ulepszeń w zakresie komfortu użytkownika, zdecydowanie widzę, że jest to nowy stan wiedzy w zakresie utrzymywania stron. Ale wiedząc, że nadal nie został oficjalnie wydany, jest bardzo solidny i łatwy do zrozumienia z mojego punktu widzenia”.

Roth powiedział, że jego zespół docenia konfigurację bloków, możliwość reorganizacji treści, posiadanie małych fragmentów treści do pracy oraz niestandardowe opcje dostosowane do każdego bloku.

„Dziwne paski narzędzi są mniej rozpraszające, a nacisk kładziony jest na treść” — powiedział Roth. „Przypomina to również bardziej, jak powinniśmy myśleć o oddzieleniu części dotyczącej formatowania i dekoracji od treści, a także skonfigurowaniu odpowiednich stron pod kątem SEO”.

Roth zidentyfikował dwie rzeczy, których zespołowi Mimimi brakuje w poprzednim edytorze:

• Naciśnięcie klawisza tabulatora powoduje wcięcie list punktowanych i przesunięcie tabulatora do tyłu
• Użycie ctrl+a do szybkiego zaznaczenia całego tekstu w bloku (czasem zaznacza całą stronę, co nie pomaga).

„Największym problemem z użytecznością do tej pory była kombinacja bloków i kolumn, co czasami sprawia, że ​​naprawdę trudno jest trafić w ikonę „…”, ponieważ strefy najechania kursorem myszy są ułożone w stos” – powiedział Roth.

Umożliwienie gawędziarzom w nowoczesnej sieci: dlaczego Luehrsen Heinrich jako agencja wykonał skok w kierunku rozwoju Gutenberga

Luehrsen powiedział, że jego agencja zdecydowała się wsiąść do pociągu Gutenberg w zeszłym roku na WordCamp Europe, po porzuceniu własnych pomysłów na stworzenie nowego kreatora stron.

„Na jeden lub dwa miesiące przed WCEU w Paryżu pracowaliśmy nad koncepcją i wersją alfa naszego własnego systemu do tworzenia stron, który był przerażająco podobny do podejścia opartego na blokach” – powiedział Luehrsen. „Pytania i odpowiedzi Matta sprawiły, że szybko zdaliśmy sobie sprawę, że nasz projekt jest już przestarzały. Mieliśmy szczęście, że dość szybko przeszliśmy przez pięć etapów żałoby (ten post dotyczący uporządkowanych danych musiał być „targowaniem się”). Zmieniliśmy kolejność naszych priorytetów i rozpoczęliśmy pracę z Gutenbergiem i nad nim pod koniec października lub listopada 2017 r.”

Luehrsen Heinrich to niewielka agencja składająca się z zaledwie czterech osób, z których każda jest związana z Gutenbergiem na różne sposoby. Luehrsen aktywnie uczestniczy w projekcie, przedstawiając swój pierwszy PR podczas świąt Bożego Narodzenia. Zespół ma również programistę, który zna tworzenie bloków od środka i na zewnątrz, projektanta, który projektuje UX i styl swoich bloków, oraz kierownika projektu, który pracuje z klientami nad ich wymaganiami dotyczącymi edycji Gutenberga.

Luehrsen powiedział, że bycie współtwórcą Gutenberga ogromnie pomogło w nauce tworzenia bloków, pomimo braku wcześniejszego doświadczenia z Reactem i ES6.

„Praca z Gutenbergiem, wkład w projekt i natychmiastowe uzyskiwanie informacji zwrotnych od niesamowitego zespołu Gutenberga bardzo nam pomogło w uruchomieniu naszego procesu” – powiedział Luehrsen. „Nasz obecny proces tworzenia bloków w dużej mierze opiera się na pracy Gary'ego, Adama, Matiasa i wszystkich innych, może z wyjątkiem tego, że używamy wewnętrznie LESS, a nie SCSS. Ale od struktury folderów, przez proces kompilacji, po strukturę pliku, staramy się podążać za stylem repozytorium Gutenberga tak ściśle, jak to możliwe, ponieważ ułatwia to debugowanie i znajdowanie problemów”.

Po udanym skoku w kierunku budowy nowej witryny firmy Mimimi Games opartej na technologii Gutenberg, zespół Luehrsena jest gotowy do budowy większej liczby witryn klienckich za pomocą nowego edytora. Postrzega to jako sposób na zapewnienie lepszego doświadczenia użytkownika przy lepszej wartości dla klienta.

„Nasi klienci podzielają nasze przekonanie, że opowiadanie historii we współczesnej sieci to znacznie więcej niż tylko pisanie tekstu” – powiedział Luehrsen. „TinyMCE jako edytor „Rich Text” wykonał niesamowitą robotę, ale mimo to łączenie różnych typów mediów w spójną historię było bałaganem z metaboksami, skrótami, a czasami w przypadku zwiastunów trzeba było nawet opuścić ekran edycji. Gutenberg łączy to wszystko w przyjemny, nienarzucający się sposób. I, jak zawsze: jeśli możesz szybciej osiągnąć dobry wynik, klient zasadniczo kupuje ten zaoszczędzony czas”.