Block Kit: Kontribusi Slack Untuk Membangun UI Kolaborasi yang Lebih Baik

Diterbitkan: 2022-03-10

Ringkasan cepat Slack telah melakukan banyak hal untuk menyatukan tim dan mitra secara online. Itu juga banyak dilakukan untuk memberdayakan pengembang untuk membangun aplikasi khusus mereka sendiri untuk itu. Namun, hingga saat ini, pengembang dibatasi oleh seberapa banyak yang dapat mereka lakukan untuk menyesuaikan desain aplikasi tersebut. Itu berubah hari ini dengan Block Kit.

(Ini adalah artikel bersponsor.) Selama beberapa tahun terakhir, telah terjadi perubahan besar dalam hal cara kerja perusahaan. Karena semakin banyak bisnis menjadi independen lokasi, alat kolaborasi telah menjadi cara standar di mana tim bertemu dan menyelesaikan pekerjaan.

Meskipun demikian, hanya karena kami memiliki aplikasi kolaborasi yang mengintegrasikan proses dan alat bisnis kami yang terhubung, itu tidak berarti pengalaman selalu mengarah pada efisiensi atau produktivitas yang optimal. Mengapa? Nah, terkadang UI yang tidak ramah menghalangi.

Itu sebabnya, hari ini, saya akan berbicara tentang Block Kit, kontribusi Slack untuk membangun UI kolaborasi yang lebih baik.

Bagi Anda yang telah membuat aplikasi Slack khusus (untuk direktori aplikasi atau untuk keperluan internal), ini akan menjadi pengantar Anda untuk alat desain baru. Bagi Anda yang belum, tidak apa-apa. Ada beberapa pelajaran berharga yang dapat diambil dari hal ini dalam hal apa yang membuat ruang kerja menarik yang akan meningkatkan kolaborasi.

Pengembang, Tahukah Anda Apa yang Sedang Dikerjakan Slack?

Slack telah membuat langkah besar sejak diluncurkan pada 2013. Apa yang awalnya dimulai sebagai aplikasi perpesanan kini telah berkembang menjadi platform kolaborasi yang kuat.

Saat menulis ini: Slack memiliki lebih dari 10 juta pengguna aktif setiap hari — dan mereka tinggal di seluruh dunia (lebih dari 150 negara, tepatnya).

Contoh saluran Slack untuk penutur bahasa Jepang — Berikut adalah contoh saluran Slack untuk penutur bahasa Jepang. (Sumber gambar: Slack) (Pratinjau besar)

Bukan hanya individu yang menggunakan Slack — hampir 585.000 tim yang terdiri dari tiga orang atau lebih berkolaborasi dalam platform. 65 dari perusahaan Fortune 100 juga kebetulan berada di Slack.

Sekilas tentang kolaborasi waktu nyata antara pengguna Slack (Sumber gambar: Slack) (Pratinjau besar)

Ini semua berkat API Slack yang telah membuka pintu bagi pengembang untuk membuat dan menerbitkan aplikasi yang tersedia untuk umum yang memperluas fungsionalitas ruang kerja Slack.

Halaman depan Direktori Aplikasi Slack. (Sumber gambar: Slack) (Pratinjau besar)

Dengan cara ini, pengguna Slack tidak perlu beralih di antara alat bisnis yang paling umum digunakan. Proses terkait dapat terjadi semua dari dalam Slack.

Namun, terkadang apa yang tersedia di Slack App Directory tidak cukup untuk kebutuhan internal organisasi Anda. Anda mungkin dapat menjembatani beberapa perbedaan antara alat bisnis Anda dengan apa yang ada, tetapi Anda mungkin juga menemukan alasan untuk membuat aplikasi Slack kustom Anda sendiri.

Memperkenalkan Block Kit Dari Slack

Begini masalahnya: sementara Slack telah berhasil memungkinkan pengembang untuk membuat aplikasi mereka sendiri untuk meningkatkan kolaborasi dalam platform, bagaimana pengembang seharusnya tahu cara membuat pengalaman yang baik dengannya?

Sampai saat ini, API dan direktori aplikasi Slack memberikan fleksibilitas dan kontrol yang terbatas. Seperti yang dijelaskan Brian Elliott, Manajer Umum Platform:

“Saat ini, semua aplikasi dipaksa menjadi serangkaian cara terbatas untuk menampilkan informasi yang kaya. Jika Anda telah melihat dan melihat dan menggunakan semua aplikasi yang berbeda di Slack, banyak dari mereka berakhir dengan tata letak yang sama terlepas dari fungsionalitas mana yang mereka coba gunakan. Padahal pada kenyataannya yang Anda butuhkan adalah seperangkat komponen yang memungkinkan Anda membangun tampilan interaktif yang kaya yang lebih mudah dipahami, dicerna, dan ditindaklanjuti oleh orang-orang.”

Jadi, Slack mengembangkan Block Kit.

Block Kit adalah kerangka kerja UI yang memungkinkan pengembang, perancang, dan pembuat front-end untuk menampilkan aplikasi perpesanan mereka melalui UI yang kaya, interaktif, dan intuitif. Lebih lanjut, dengan menyediakan satu set elemen atau blok UI yang dapat ditumpuk, Block Kit kini memberi pengembang lebih banyak kontrol dan fleksibilitas atas desain dan tata letak aplikasi mereka.

Catatan : Jika Anda ingin melihat Block Kit beraksi, bergabunglah dengan sesi Slack yang akan datang, “Membangun dengan Block Kit”, di mana Anda akan mendapatkan demonstrasi produk langsung dan melihat betapa mudahnya menyesuaikan desain aplikasi Anda.

Block Kit hadir dengan dua komponen utama:

1. Pembuat Blok Kit

Perhatikan kesamaan antara alat pembuat ini dan banyak alat lain yang kami gunakan untuk membuat situs web dan aplikasi untuk klien:

Demo pembuat Block Kit (Sumber gambar: Block Kit) (Pratinjau besar)

Komponen bangunan ada di sebelah kiri. Cukup klik salah satu yang ingin Anda sertakan dan lihat itu ditambahkan ke pratinjau aplikasi Anda di tengah.

Ingin kustomisasi lebih lanjut? Lihat editor teks di sebelah kanan. Meskipun Block Kit menyediakan elemen siap pakai yang mengikuti praktik terbaik untuk mendesain aplikasi perpesanan, Anda memiliki kemampuan untuk menjadikannya milik Anda jika diinginkan.

2. Blok Template Kit

Meskipun Anda tentu saja dapat membuat antarmuka perpesanan dari Builder sendiri, saya sarankan untuk menjelajahi Template yang disediakan juga:

Beberapa template yang ditawarkan Block Kit kepada pengguna — Ini hanya beberapa template yang ditawarkan Block Kit kepada pengguna. (Sumber gambar: Block Kit) (Pratinjau besar)

Tim Slack telah melihat kasus aplikasi Slack yang sangat berguna. Tak perlu dikatakan, mereka tahu hal-hal apa yang mungkin ingin dimanfaatkan organisasi Anda demi peningkatan kolaborasi.

Itulah mengapa Anda akan menemukan tindakan umum seperti berikut ini yang sudah dibuat untuk Anda:

Meninjau permintaan persetujuan;
Mengambil tindakan pada notifikasi baru;
Menjalankan polling dan memantau hasil;
Melakukan pencarian.

Guru adalah salah satu alat yang memanfaatkan Block Kit untuk meningkatkan aplikasi Slack-nya:

Guru menyediakan fungsi pencarian database di dalam Slack. Hasil sekarang dengan cepat diambil dan lebih jelas ditampilkan di frontend Slack.

Kunci Untuk Membangun UI Kolaborasi yang Lebih Baik

Sekarang kita telah melihat apa yang akan terjadi dengan Block Kit, kita perlu membicarakan bagaimana hal itu akan membantu Anda membuat aplikasi yang mengarah pada kolaborasi yang lebih produktif.

Blok

Saya baru-baru ini berbicara tentang masalah Gutenberg dan bagaimana desainer dapat menggunakannya untuk keuntungan mereka. Meskipun editor WordPress baru jelas memiliki kekurangan, tidak ada pertanyaan mengapa tim di WordPress membuat perubahan:

Pembuat blok adalah masa depan desain web.
“

Saya mengerti bahwa pembuat blok cenderung menjadi alat yang disukai untuk desainer web dan pengguna DIY. Pembangun memungkinkan untuk desain frontend visual dan sering kali menyertakan opsi penyesuaian yang melimpah.

Beberapa blok yang sudah jadi termasuk dalam Block Kit — Beberapa blok pra-dibuat termasuk dalam Block Kit (Sumber gambar: Block Kit) (Pratinjau besar)

Tetapi Block Kit melakukan lebih dari itu, yang berarti baik desainer maupun pengembang dapat membuat aplikasi khusus dengan mudah.

Kode

Pembeda utama antara sesuatu seperti pembuat situs web dan pembuat Blok Kit adalah aspek pengkodean.

Dalam kebanyakan kasus, desainer menggunakan pembuat halaman sehingga mereka tidak perlu repot dengan kode. Mereka mungkin menambahkan beberapa kelas CSS khusus atau menambahkan HTML ke teks mereka, tetapi biasanya hanya itu. Pengembang tidak bekerja seperti itu.

Block Kit menyertakan panel dengan JSON pra-tertulis yang dapat disalin dan ditempelkan oleh pengembang ke dalam aplikasi Slack mereka sendiri setelah siap digunakan. Daripada membiarkan pengembang menulis kode mereka sendiri, Slack menyediakan kode yang memanfaatkan praktik terbaik untuk kecepatan dan desain.

Contoh JSON yang Anda dapatkan saat membangun pengalaman perpesanan yang kaya di pembuatnya. (Sumber gambar: Block Kit) (Pratinjau besar)

Hal ini memungkinkan pengembang untuk fokus membuat penyesuaian daripada harus membangun aplikasi mereka dari awal.

Konsistensi

Ketika pengguna Slack masuk ke dalam platform, mereka tahu apa yang diharapkan. Setiap antarmuka sama dari ruang kerja ke ruang kerja.

Namun, ketika API memungkinkan pengembang membangun aplikasi untuk berintegrasi dengan ruang tersebut, ada risiko memperkenalkan elemen yang tidak cocok dengan baik. Ketika itu terjadi, ketidakpastian antarmuka dapat membuat kebingungan dan keraguan bagi pengguna akhir. Pilihan tata letak yang tidak pas juga dapat merusak pengalaman.

Block Kit memungkinkan pengembang untuk membangun aplikasi dengan komponen UI yang dapat ditumpuk yang telah dicoba dan diuji. Saat menyesuaikan pengalaman dalam platform yang sudah mapan, mungkin sulit untuk mengetahui seberapa jauh Anda dapat melakukannya — atau apakah itu akan berhasil. Slack telah mengeluarkan pertanyaan-pertanyaan itu dari persamaan.

Jarak

Seperti inilah tampilan pertukaran Slack tradisional:

Contoh pengguna Slack saling mengirim pesan (Sumber gambar: Slack) (Pratinjau besar)

Ini cenderung menjadi pertukaran satu kolom, bolak-balik. Dan ini bekerja dengan sangat baik untuk saluran Slack di mana kolaborasi itu sederhana. Pesan karyawan tentang status tugas. Seorang klien mengunggah aset yang hilang. CEO membagikan tautan ke siaran pers yang menyebutkan perusahaan. Tetapi tidak semua ruang kerja sesederhana itu.

Block Kit membantu Anda memaksimalkan dan meningkatkan ruang yang ditempati oleh fitur aplikasi Anda. Misalnya, Block Kit memungkinkan perusahaan seperti Optimizely untuk menampilkan informasi terkait dalam format dua kolom agar lebih mudah dibaca.

Secara optimal menggunakan Block Kit untuk membuat format dua kolom — Optimalkan menggunakan Block Kit untuk membuat format dua kolom. (Sumber gambar: Optimizely) (Pratinjau besar)

Ini memang cara yang lebih baik untuk membagikan detail terkait di aplikasi Slack tim Anda.

Interaksi yang Kaya

Cara lain untuk meningkatkan aplikasi Anda adalah dengan mengubah integrasi menjadi integrasi yang kaya dengan interaksi.

Blok telah dikembangkan secara khusus untuk meningkatkan elemen yang paling umum digunakan dalam kolaborasi Slack. Sebagai contoh:

Gunakan blok Sectional untuk organisasi yang lebih baik.
Gunakan blok Teks untuk menyesuaikan bagaimana pesan ditampilkan.
Gunakan blok Gambar berukuran tepat sehingga Anda dapat berhenti mengkhawatirkan apakah blok gambar akan ditampilkan dengan benar atau tidak.
Gunakan blok Konteks untuk menampilkan baris atau konteks tambahan tentang pesan (seperti penulis, komentar, perubahan, dll.)
Gunakan blok Pembagi untuk meningkatkan tampilan aplikasi.
Gunakan blok Tindakan seperti pemilihan menu, pemilihan tombol, dan tanggal kalender untuk menghadirkan fitur yang lebih baik ke dalam aplikasi Anda dan membuatnya ditampilkan lebih intuitif.
Gunakan blok 2 bagian untuk tata letak yang lebih bersih.

Doodle memiliki contoh bagus tentang apa yang dapat dilakukan dengan interaksi yang kaya menggunakan Block Kit:

Seperti yang Anda lihat, pengguna dapat bekerja sama untuk menjadwalkan rapat seefektif jika mereka menggunakan kalender pihak ketiga. Satu-satunya perbedaan adalah mereka sekarang dapat melakukan semua itu di dalam ruang kerja Slack mereka.

Membungkus

Kolaborasi adalah bagian penting dari kesuksesan organisasi mana pun, dan tidak masalah apakah itu tim yang terdiri dari 3 orang atau tim beranggotakan 300 orang. Namun ada perbedaan besar antara bekerja bersama dan berkolaborasi secara produktif .

Berkat API Slack, pengembang telah menciptakan beberapa cara luar biasa untuk mengintegrasikan proses dan alat terkait ke dalam platform. Dan berkat Block Kit, kontribusi eksternal tersebut tidak akan mengganggu pengalaman jika desain elemennya gagal.

Dengan kemampuan pembuatan blok yang intuitif, opsi pengkodean yang ramah pengembang, dan banyak lagi, Block Kit akan membantu pengembang menghadirkan pengalaman yang lebih kaya dan kolaborasi yang lebih baik ke platform Slack.

Satu hal terakhir untuk disebutkan:

Konferensi Perbatasan Slack akan segera hadir. Itu akan diadakan di San Francisco pada 24 dan 25 April. Jika Anda berencana untuk hadir, perhatikan bahwa jalur Pengembang akan mencakup pelatihan sehari penuh tentang Block Kit , termasuk lokakarya, demo fitur baru, tutorial, serta satu- pendampingan satu-satu. Jika Anda berpikir tentang Block Kit, ini adalah kesempatan yang tidak ingin Anda lewatkan.