Bagaimana Game Studio yang berbasis di Munich Menggunakan WordPress dan Gutenberg untuk Mendukung Situs Webnya

Mimimi, studio game pemenang penghargaan yang berbasis di Munich, telah meluncurkan situs web WordPress baru yang menyediakan studi kasus menarik tentang Gutenberg di alam liar. Meskipun Anda mungkin tidak dapat mengetahuinya dari frontend, di balik layar editor berbasis blok yang baru memberdayakan tata letak dengan blok khusus, memungkinkan tim Mimimi memperbarui berbagai bagian situs web mereka dengan mudah.

Luehrsen Heinrich, biro iklan lokal, membangun situs dengan tema khusus dan tujuh blok yang disesuaikan untuk mendukung persyaratan pengeditan tim Mimimi.

“Tugas umumnya adalah membuat situs web elegan yang sangat mudah dan cepat dirawat dan mungkin nantinya akan mendapatkan bagian blog/berita,” kata Hendrik Luehrsen, CEO Luehrsen Heinrich. “Kami tahu klien kami memiliki beberapa orang yang luar biasa kreatif dan paham teknologi yang memercayai kami. Itu membuat kami percaya diri untuk masuk ke Gutenberg.”

Situs ini menggunakan blok latar belakang yang memungkinkan editor untuk membuat pola latar belakang yang berbeda dan pemisah bergelombang. Luehrsen mengatakan itu bekerja dengan 'InnerBlocks', mirip dengan kolom, sehingga dapat menampung blok lain.

Situs ini juga memiliki blok Discord khusus yang secara dinamis mengambil beberapa pengaturan untuk menampilkan sekumpulan pengguna dari Discord, yang digunakan Mimimi untuk komunikasi internal. Blok menampilkan daftar tim yang diperbarui. Media sosial dan blok permainan memungkinkan editor memperbarui teks dan gambar dengan mudah dengan tata letak yang sudah diatur.

“Saya cukup yakin kami dapat melakukan tata letak yang sama hingga sekitar 80% dengan menggabungkan kolom, paragraf, dan gambar, tetapi kami tidak ingin klien kami bermain-main seperti di MS Word ketika Anda mencoba menempatkan gambar,” kata Luehrsen . “Jadi membuat blok tata letak sederhana adalah hal yang logis.”

Situs web Mimimi juga menggunakan blok pendaftaran Mailchimp khusus dan blok pengatur jarak khusus yang menawarkan lebih banyak fleksibilitas dan breakpoint responsif.

“Secara keseluruhan kami (dan klien kami) sangat senang dengan hasilnya,” kata Luehrsen. “Kita bisa melihat masa depan WordPress dengan editor berbasis blok ini. Tapi masih ada jalan yang sangat panjang sampai kita benar-benar tidak punya apa-apa untuk dihaluskan lagi. Ada hal-hal tertentu, yang masih membutuhkan banyak pekerjaan.”

Dari perspektif pengembangan, Luehrsen mengatakan timnya masih berjuang dengan gaya backend untuk editor dan gaya frontend dan backend sangat berbeda karena itu. Mereka juga belum menemukan cara yang dapat dipertahankan dan stabil untuk menerapkan gaya global ke editor Gutenberg. Selain isu-isu luar biasa tersebut, agensi telah menikmati pembangunan untuk editor baru dan segera meluncurkan produk halaman Gutenberg lainnya untuk serangkaian klien yang berbeda.

Pengalaman Gutenberg Mimimi Games: Editor Menghargai Konsep Blok tetapi Masih Menghadapi Masalah Kegunaan

Johannes Roth, CEO Mimimi Games, mengatakan timnya telah menggunakan WordPress di masa lalu dan melihat Gutenberg sebagai peningkatan besar untuk mengedit konten.

“Aku benar-benar menyukainya, jujur!” kata Roth. “Jauh lebih mudah untuk memahami pengaturan halaman dan menyesuaikannya. Jika editor Gutenberg mendapatkan beberapa peningkatan pengalaman pengguna, saya pasti melihatnya sebagai seni baru untuk memelihara halaman. Tetapi mengetahui bahwa itu masih belum dirilis secara resmi, itu sangat kuat dan mudah dimengerti dari sudut pandang saya. ”

Roth mengatakan timnya menghargai pengaturan blok, kemampuan untuk mengatur ulang konten, memiliki potongan kecil konten untuk dikerjakan, dan memiliki opsi yang disesuaikan untuk setiap blok.

“Ada lebih sedikit gangguan dengan bilah alat yang aneh dan fokusnya adalah pada konten,” kata Roth. “Ini juga lebih mirip bagaimana kita harus berpikir tentang pemisahan bagian format dan dekorasi dari konten, serta menyiapkan halaman yang tepat untuk keramahan SEO.”

Roth mengidentifikasi dua hal yang tim Mimimi lewatkan dari editor sebelumnya:

• Menekan tab untuk membuat indentasi daftar peluru dan menggeser tab untuk membalikkan
• Menggunakan ctrl+a untuk dengan cepat memilih semua teks di dalam blok (kadang-kadang memilih seluruh halaman, yang tidak membantu).

“Masalah terbesar dengan kegunaan sejauh ini adalah kombinasi blok dan kolom, yang terkadang membuat sangat sulit untuk menekan ikon '…' karena zona mouseover ditumpuk,” kata Roth.

Mengaktifkan Pendongeng di Web Modern: Mengapa Luehrsen Heinrich Mengambil Lompatan ke Pengembangan Gutenberg sebagai Agensi

Luehrsen mengatakan agensinya memutuskan untuk naik kereta Gutenberg tahun lalu di WordCamp Europe, setelah membuang ide mereka sendiri untuk membuat pembuat halaman baru.

“Satu atau dua bulan sebelum WCEU di Paris, kami menggunakan konsep dan versi alfa dari sistem pembuat halaman kami sendiri yang sangat mirip dengan pendekatan berbasis blok,” kata Luehrsen. “Tanya Jawab oleh Matt membuat kami segera menyadari bahwa proyek kami sudah usang. Kami beruntung bahwa kami melewati lima tahap kesedihan dengan cukup cepat (postingan tentang data terstruktur ini pastilah "tawar-menawar"). Kami menyusun ulang prioritas kami dan mulai bekerja dengan dan di Gutenberg pada akhir Oktober atau November 2017.”

Luehrsen Heinrich adalah agensi kecil yang hanya terdiri dari empat orang yang semuanya terlibat dengan Gutenberg dengan cara yang berbeda. Luehrsen adalah kontributor aktif pada proyek tersebut, mengirimkan PR pertamanya selama liburan Natal. Tim ini juga memiliki pengembang yang mengetahui pembuatan blok di dalam dan di luar, seorang desainer yang mendesain UX dan gaya blok mereka, dan seorang manajer proyek yang bekerja dengan klien pada persyaratan pengeditan Gutenberg mereka.

Luehrsen mengatakan menjadi kontributor Gutenberg sangat membantu dalam pembuatan blok pembelajaran, meskipun tidak memiliki pengalaman sebelumnya dengan React dan ES6.

“Bekerja dengan Gutenberg, berkontribusi pada proyek dan mendapatkan umpan balik langsung dari tim Gutenberg yang luar biasa, banyak membantu kami dalam mem-bootstrap proses kami,” kata Luehrsen. “Proses pembuatan blok kami saat ini sangat didasarkan pada pekerjaan yang telah dilakukan Gary, Adam, Matias, dan yang lainnya, mungkin dengan pengecualian bahwa kami menggunakan LESS secara internal, dan bukan SCSS. Tetapi dari struktur folder, hingga proses pembuatan, hingga penataan file, kami mencoba mengikuti gaya repo Gutenberg sedekat mungkin, karena itu membuat debugging dan menemukan masalah menjadi sangat mudah.”

Setelah berhasil membuat lompatan untuk membangun situs web baru yang didukung oleh Gutenberg dari Mimimi Games, tim Luehrsen siap untuk membangun lebih banyak situs klien dengan editor baru. Dia melihatnya sebagai cara untuk memberikan pengalaman pengguna yang lebih baik dengan nilai yang lebih baik bagi klien.

“Klien kami berbagi keyakinan kami bahwa mendongeng di web modern lebih dari sekadar menulis teks,” kata Luehrsen. “TinyMCE sebagai editor 'Rich Text' melakukan pekerjaan yang luar biasa, tetapi tetap saja, menggabungkan berbagai jenis media ke cerita yang koheren berantakan dengan metabox, shortcode, dan terkadang untuk penggoda Anda bahkan harus meninggalkan layar edit. Gutenberg menggabungkan semua ini dengan cara yang bagus dan tidak mencolok. Dan, seperti biasa: Jika Anda bisa mendapatkan hasil yang baik dengan cara yang lebih cepat, penghematan waktu itulah yang pada dasarnya dibeli oleh klien.”