‘Sandi Morse’ baru dunia GameDev : Memaksimalkan alur kerja lewat Visualisasi Chart

Bayangin : Lagi liburan di pantai yang keren, nikmatin matahari dan suara ombak yang adem banget. Akhirnya bisa rileks setelah berbulan-bulan kerja keras di dunia game development. Tapi, di saat lagi asik bersantai dengan Es Teh di tangan, tiba-tiba HP bunyi.

Boss ngechat, “Bro, kita butuh presentasi flowchart buat mekanik game baru kita besok pagi. Bisa kirim malem ini nggak?” Waduh, deadline mepet dan kebutuhan mendadak udah jadi makanan sehari-hari, tapi di tengah liburan? cuma bisa ketawa kecut.

Dengan sinyal WiFi yang pas-pasan dan laptop yang hampir ketinggalan di hotel, hanya bisa buka alat andalan di situasi darurat: Mermaid coding. Dalam sekejap, udah bisa bikin diagram alur kerja, ngegambar mekanik game yang rumit jadi lebih gampang dipahami dan rapi. Mermaid bisa bikin flowchart keren tanpa perlu alat grafis ribet atau waktu berjam-jam.

Cukup ketik :

graph TD
    A[Start] --> B[Player Input]
    B --> C{Action Decision}
    C -->|Attack| D[Calculate Damage]
    C -->|Defend| E[Reduce Damage]
    D --> F[Update Health]
    E --> F
    F --> G[End Turn]

Maka akan muncul visual berikut:

Pak Boss puas. Bahkan es teh-mu pun masih kondisi dingin. Di tengah liburan, bisa nyelesain permintaan boss dengan efisien, berkat kekuatan visualisasi dari Mermaid coding.

Di artikel ini, penulis bakal jelasin lebih jauh gimana Mermaid coding bisa jadi alat revolusioner dalam pengembangan game, kayak Sandi Morse di jaman dulu buat komunikasi, dan kenapa harus mulai pake ini di proyek gamedev-mu.

Introducing : Mermaid Diagramming and charting tool

Bahasa program berbasis Javascript ini berfokus membuat visual-chart, dibentuk lewat bahasa codingan tertentu. Well lebih tepatnya bukan bahasa pemrograman, sih (d’oh). Lebih ke arah ‘markup language’, yaitu tata penulisan yang wajib ditulis secara runut dan spesifik, untuk mendapatkan hasil tertentu.

Bahasa ini masih hitungannya muda di umur 10 tahunan, oleh mas Knut Sveidqvist dari Norwegia.

Visual chart yg bisa dibentuk oleh Mermaid antara lain :
Flow Chart · Sequence Diagram · Gannt Diagram · Class Diagram · Git Diagram · Entity Relation Diagram · User Journey Diagram · Quadrant Chart · XY Chart · Pie Chart · Mind Map · State Diagram

Untuk tutorial teknikal yang lebih lengkap, bisa langsung ke website Mermaid.JS

Aspek Positif Mermaid JS

Dalam dunia gamedev, unsur komunikasi antar anggota team sangatlah penting. Bayangin, team desainer ingin menjelaskan secara bagan visual ke teman2 Coder.

Team Desainer bisa membuat bagan visual utk menjelaskan mekanik dan parameter lewat aplikasi bikin chart macam Figma, Canva, dll. Dan ketika diskusi sudah selesai, update2 baru pun bermunculan. Musti bikin lagi chart dari awal. Team Coding pun kadang gak mau repot bikin chart, Team Desainer seringnya pun males update bikin chart lagi.

Belum lagi repot musti login2 ulang ke aplikasi bikin chart online, terutama kalau lupa password! Ribet deh jadinya.

Mermaid bisa jadi jembatan kilat buat maksimalisasi alur kerja temen2 Gamedev. Temen2 coding pun bisa bantu nambah masukan ke Temen Desainer lewat code Mermaid. Plus, bisa via GitHub, aplikasi andalan buat temen2 gamedev.

Selain GitHub, masih banyak aplikasi yang bisa berkomunikasi pakai Mermaid. Terutama aplikasi2 Atlanssian macam Jira dan Confluence. Juga Notion
List lengkapnya ada di website

Kelemahan?

Untuk kelemahan Mermaid pastinya ada. Salah satunya
• Banyak hafalan syntax dan aturan penulisan tertentu, juga harus runut.
• Akses aplikasi2 bisa membuka Mermaid bisa terbilang terbatas. (Medium pun masih belum bisa kecuali lewat hasil export PNG)
• Untuk bisa embed ke media sosial masih belum bisa, hanya bisa membuka Mermaid live dg export jadi PNG/SVG
• Memasang ke bentuk HTML musti melewati prosedur yg cukup ribet (meskipun bisa lewat API nya Mermaid)

Potensi Mermaid pada GameDev

Tidak dipungkiri, Mermaid punya kelemahan akan aksesibilitas dan publikasi yg bisa dibilang minim. Semoga dari artikel ini, bakalan banyak penerapan Mermaid di aplikasi2 perkantoran yang lain.
Namun potensi Mermaid sebenernya tidak berkutat di dunia gamedev saja, masih banyak potensi yang bisa dilakukan oleh Mermaid. Aplikasi ini bisa terbilang sangatlah flexible, karena bentuknya Javascript, modul ini bisa tersambung via CSS dan HTML, jadi bisa terkoneksi ke pembuatan aplikasi laporan bentuk visual

Bayangin bisa punya laporan insight big data bentuk chart visual, dari game atau aplikasi yg udah kamu buat?

Demikian artikel ane membahas tentang Mermaid
Thankies!