Kami mengatur alur kerja yang efektif untuk pengembang web: Confluence, Airtable, dan alat lainnya

Kami mengatur alur kerja yang efektif untuk pengembang web: Confluence, Airtable, dan alat lainnya

Saya telah bekerja sebagai pengembang front-end selama sekitar dua tahun, dan telah berpartisipasi dalam pembuatan berbagai macam proyek. Salah satu pembelajaran yang saya dapat adalah bahwa kolaborasi antara tim pengembang berbeda yang memiliki tujuan yang sama tetapi memiliki tugas dan tanggung jawab yang berbeda bukanlah hal yang mudah.

Dengan berkonsultasi dengan anggota tim lainnya, perancang dan pengembang, saya membuat siklus pembuatan situs web yang dirancang untuk tim kecil (5-15 orang). Ini mencakup alat seperti Confluence, Jira, Airtable dan Abstrak. Pada artikel ini saya akan membagikan fitur pengorganisasian alur kerja.

Skillbox merekomendasikan: Kursus praktik dua tahun "Saya adalah Pengembang Web PRO".

Kami mengingatkan: untuk semua pembaca "Habr" - diskon 10 rubel saat mendaftar di kursus Skillbox apa pun menggunakan kode promosi "Habr".

Mengapa semua ini diperlukan?

Tim minimal yang dibutuhkan untuk membuat website dari awal adalah seorang desainer, programmer, dan manajer proyek. Dalam kasus saya, tim telah dibentuk. Namun setelah beberapa situs dirilis, saya merasa ada yang tidak beres dengan situs tersebut. Terkadang kami tidak sepenuhnya memahami tanggung jawab kami, dan komunikasi dengan klien masih jauh dari harapan. Semua ini memperlambat proses dan mengganggu semua orang.

Saya mulai berupaya memecahkan masalah tersebut.

Kami mengatur alur kerja yang efektif untuk pengembang web: Confluence, Airtable, dan alat lainnya
Pencarian Google memberikan hasil yang baik untuk masalah kami.

Untuk membuat pekerjaan yang dilakukan lebih visual, saya membuat diagram alur kerja yang memberikan pemahaman tentang bagaimana pekerjaan dilakukan di sini.

Kami mengatur alur kerja yang efektif untuk pengembang web: Confluence, Airtable, dan alat lainnya
Klik pada gambar untuk membuka dalam resolusi penuh.

Tujuan dan sasaran

Salah satu teknik pertama yang saya putuskan untuk diuji adalah “model kaskade” (Air Terjun). Saya menggunakannya untuk menyoroti masalah dan memahami cara menyelesaikannya.

Kami mengatur alur kerja yang efektif untuk pengembang web: Confluence, Airtable, dan alat lainnya

Masalah: Seringkali, klien tidak mengevaluasi proses pembuatan situs web secara modular, seperti yang dilakukan pengembang. Dia menganggapnya sebagai situs biasa, yaitu, dia berpikir dalam kerangka halaman individual. Menurutnya, desainer dan pemrogram membuat halaman individual, satu demi satu. Akibatnya, pelanggan tidak memahami apa yang terjadi selama proses sebenarnya.

Tugas: Tidak ada gunanya meyakinkan klien sebaliknya; pilihan terbaik adalah mengembangkan proses modular untuk membuat situs web dalam perusahaan berdasarkan model halaman demi halaman.

Token dan komponen desain universal dikelola oleh pengembang dan desainer.

Kami mengatur alur kerja yang efektif untuk pengembang web: Confluence, Airtable, dan alat lainnya

Masalah: Ini adalah situasi umum yang diatasi oleh banyak strategi. Ada banyak solusi menarik, dalam banyak kasus diusulkan untuk membuat sistem desain yang dikendalikan oleh panduan gaya/generator perpustakaan. Namun dalam situasi kami, menambahkan komponen lain ke proses pengembangan yang memungkinkan kami mengelola tingkat akses bagi para desainer adalah hal yang mustahil.

Tugas: membangun sistem universal di mana desainer, pengembang, dan manajer dapat bekerja secara sinkron tanpa saling mengganggu.

Pelacakan perkembangan yang akurat

Kami mengatur alur kerja yang efektif untuk pengembang web: Confluence, Airtable, dan alat lainnya

Masalah: Meskipun ada banyak alat berguna yang tersedia untuk melacak masalah dan mengukur kemajuan secara keseluruhan, sebagian besar alat tersebut tidak fleksibel atau optimal. Alat ini dapat berguna dengan menghemat waktu tim yang biasanya dihabiskan untuk pertanyaan dan klarifikasi mengenai tugas tertentu. Hal ini juga membuat hidup lebih mudah bagi para manajer dengan memberi mereka pemahaman yang lebih akurat tentang keseluruhan proyek.

Tugas: membuat dasbor untuk melacak kemajuan tugas yang dilakukan oleh anggota tim yang berbeda.

Toolbox

Setelah bereksperimen dengan berbagai alat, saya memilih set berikut: Confluence, Jira, Airtable, dan Abstrak. Di bawah ini saya akan membeberkan manfaat masing-masingnya.

Pertemuan

Peran alat ini: pusat informasi dan sumber daya.

Ruang kerja Confluence relatif mudah diatur, memiliki banyak fitur, integrasi dengan berbagai aplikasi, dan memiliki templat individual yang dapat disesuaikan. Ini bukan solusi universal, namun ideal sebagai pusat informasi dan sumber daya. Artinya, referensi atau detail teknis apa pun yang berkaitan dengan proyek harus dimasukkan ke dalam database.

Alat ini memungkinkan Anda mendokumentasikan setiap komponen dan detail lainnya tentang proyek dengan benar.

Kami mengatur alur kerja yang efektif untuk pengembang web: Confluence, Airtable, dan alat lainnya

Keuntungan utama Confluence adalah penyesuaian templat dokumen. Selain itu, dapat digunakan untuk mengimplementasikan satu repositori spesifikasi dan berbagai dokumentasi proyek, yang memisahkan tingkat akses peserta. Sekarang Anda tidak perlu khawatir karena Anda memiliki spesifikasi versi lama, seperti yang terjadi saat Anda mengirim dokumen melalui email.

Informasi lebih lanjut tentang alat ini tersedia di situs resmi produk.

Jira

Peran alat ini: pemantauan masalah dan manajemen tugas.

Kami mengatur alur kerja yang efektif untuk pengembang web: Confluence, Airtable, dan alat lainnya

Jira adalah alat perencanaan dan manajemen proyek yang sangat kuat. Bagian utama dari fungsinya adalah pembuatan alur kerja yang dapat disesuaikan. Untuk mengelola masalah secara efektif (yang kita perlukan), ada baiknya memberikan perhatian khusus pada penggunaan yang benar dari jenis permintaan dan jenis masalah (tipe masalah).

Jadi, untuk memastikan pengembang membuat komponen berdasarkan desain yang benar, mereka perlu diberi tahu setiap kali ada perubahan dalam desain. Segera setelah komponen diperbarui, perancang perlu membuka suatu masalah, menugaskan pengembang yang bertanggung jawab, dan menugaskannya jenis masalah yang benar.

Dengan Jira, Anda dapat yakin bahwa semua peserta dalam proses (izinkan saya mengingatkan Anda, dalam kasus kami ada 5–15 di antaranya) menerima tugas yang benar sehingga tidak tersesat dan menemukan pelaksananya.

Pelajari selengkapnya tentang Jira tersedia di situs resmi produk.

Airtable

Peran alat: manajemen komponen dan papan kemajuan.

Airtable adalah campuran spreadsheet dan database. Semua ini memungkinkan untuk menyesuaikan pengoperasian semua alat yang dibahas di atas.

Contoh 1: Manajemen Komponen

Adapun generator panduan gaya, tidak selalu nyaman digunakan - masalahnya adalah desainer tidak dapat mengeditnya. Selain itu, menggunakan pustaka komponen Sketch bukanlah keputusan yang baik, karena memiliki banyak keterbatasan. Kemungkinan besar, Anda tidak akan bisa menggunakan perpustakaan ini di luar program.

Airtable juga tidak sempurna, tapi lebih baik daripada banyak solusi serupa lainnya. Berikut ini demo template Tabel Manajemen Komponen:

Kami mengatur alur kerja yang efektif untuk pengembang web: Confluence, Airtable, dan alat lainnya

Ketika pengembang menerima komponen desain, dia mengevaluasi ABEM yang dihasilkan dengan mencatat komponen tersebut dalam sebuah tabel. Total ada 9 kolom:

  • Nama – nama komponen menurut prinsip ABEM.
  • Pratinjau - Di sinilah tangkapan layar atau gambar komponen yang diunduh dari sumber lain ditempatkan.
  • Halaman tertaut adalah link ke halaman komponen.
  • Komponen anak - tautan ke komponen anak.
  • Pengubah - memeriksa keberadaan opsi gaya dan mendefinisikannya (misalnya, aktif, merah, dll.).
  • Kategori komponen merupakan kategori umum (teks, gambar promosi, sidebar).
  • Status pembangunan - kemajuan pembangunan aktual dan definisinya (selesai, sedang berlangsung, dll.).
  • Bertanggung jawab - pengembang yang bertanggung jawab atas komponen ini.
  • Tingkat atom adalah kategori atom dari komponen ini (menurut konsep desain atom).
  • Data dapat direferensikan dalam tabel yang sama atau berbeda. Menghubungkan titik-titik akan mencegah kebingungan saat melakukan penskalaan. Selain itu, data dapat disaring, diurutkan, dan diubah tanpa masalah.

Contoh 2: kemajuan pengembangan halaman

Untuk mengevaluasi kemajuan pengembangan halaman, Anda memerlukan template yang dibuat khusus untuk tujuan ini. Tabel tersebut dapat melayani kebutuhan tim itu sendiri dan klien.

Kami mengatur alur kerja yang efektif untuk pengembang web: Confluence, Airtable, dan alat lainnya

Informasi apa pun tentang halaman tersebut dapat ditandai di sini. Ini adalah tenggat waktu, tautan ke prototipe InVision, tujuan, komponen turunan. Segera terlihat bahwa pengoperasiannya sangat mudah dilakukan, baik yang berkaitan dengan pendokumentasian dan pembaruan desain, serta status pengembangan front-end dan back-end. Apalagi operasi ini dilakukan secara bersamaan.

Abstrak

Peran alat ini: satu sumber kontrol versi untuk aset desain.

Kami mengatur alur kerja yang efektif untuk pengembang web: Confluence, Airtable, dan alat lainnya

Abstrak dapat disebut GitHub untuk aset di Sketch, dan ini menyelamatkan desainer dari keharusan menyalin dan menempelkan file. Keuntungan utama dari alat ini adalah menyediakan repositori desain yang bertindak sebagai “satu sumber kebenaran.” Desainer harus memperbarui cabang master ke versi terbaru dari tata letak yang disetujui. Setelah itu, mereka harus memberi tahu pengembangnya. Mereka, pada gilirannya, harus bekerja hanya dengan aset desainer dari cabang utama.

Sebagai sebuah kesimpulan

Setelah kami menerapkan proses pengembangan baru dan semua alat yang disebutkan di atas, kecepatan pekerjaan kami meningkat setidaknya dua kali lipat. Ini bukan solusi sempurna, tapi ini solusi yang sangat bagus. Benar, agar dapat berfungsi, Anda perlu melakukan banyak upaya - diperlukan "pekerjaan manual" untuk memperbarui dan memelihara semuanya agar berfungsi.

Skillbox merekomendasikan:

Sumber: www.habr.com

Tambah komentar