Digital Insights • UI/UX
Scroll to Read More

6 Tools Google untuk Web Design yang Bisa Kamu Coba

Table of Content :

Binar Academy — Kemampuanmu mendesain sebuah website nggak akan bisa maksimal kalau kalau kamu belum memiliki tools dan resources yang tepat. Sayangnya, masih banyak tools dan resources canggih yang susah buat diakses olehmu yang masih belajar. Tapi tenang aja, masih ada tools dan resources yang bisa kamu akses dengan mudah, semudah kamu googling hasil pertandingan Liga Inggris karena enam tools dan resources ini dikeluarkan langsung oleh Google yang terkenal dengan produknya yang ramah bagi pemula.

1. Material Design Gallery

"Specially designed for: Designers dan Product Managers"

Buat kamu yang sedang mendesain sebuah website dan membutuhkan feedback dari anggota tim dan para user, Material Gallery ini bisa jadi tools yang cocok untukmu. Material Gallery akan membantumu untuk mengatur dan menkolaborasikan websitemu dengan product design yang memungkinkanmu untuk mengunggah, mendapatkan feedback, dan melacak revisi dari desain yang sudah kamu buat. Tools ini bisa kamu dapatkan dengan mudah melalui Playstore dan Appstore.

2. Material Design Color Tool

"Specially made for: Designers"

Kalau kamu lagi punya project launching website atau berencana untuk re-design website milikmu, mungkin kamu harus mempertimbangkan untuk menggunakan Material Design Color Tool. Tool ini akan membantumu untuk membuat, menerapkan, dan membagikan palet warna yang bisa disesuaikan dengan kebutuhan desain UI milikmu, termasuk alternatif warna yang bisa kamu gunakan dalam mode gelap maupun mode terang. Nilai plus lainnya, Material Design Color Tool bisa kamu gunakan untuk membagikan desain melalui perangkat Android, iOS, dan CodePen yang akan meningkatkan efektivitas desainmu.

3. Workbox

"Specially made for: Product Managers dan Engineers"

Workbox ini oke banget buat kamu yang pengin bikin PWA (Progressive Web App). Kenapa? karena tools ini berisi guide langkah-langkah codelabs yang lengkap disertai contoh-contoh praktis yang super lengkap. Kamu bisa cek workbox lebih langsung di sini.

4. CrUX Dashboard

"Specially made for: Product Managers dan Engineers"

CrUX Dashboard adalah sebuah public dataset dari semua performance data, termasuk laporan-laporan dari kondisi nyata yang terjadi di lapangan, dan dikumpulkan dari pengguna Chrome yang telah memilih untuk menyinkronkan riwayat penjelajahan mereka dan mengaktifkan pelaporan statistik penggunaan. Dengan menggunakan tools ini, kamu akan merasa sangat terbantu ketika akan membagikan data ke semua anggota tim kamu karena tools ini on-build di Data Studio dan sudah secara otomatis disinkronkan dengan set data terbaru.

5. Web Dev & Lighthouse

"Specially made for: Product Managers, Engineers, Designers, Marketers"

Pernah nggak sih kamu mengalami kesulitan saat berusaha untuk membuat improvement dalam website yang kamu buat? Atau merasa kebingungan apa yang mungkin menyebabkan halaman websitemu lama banget rendering-nya? Nah, Web.Dev dan Lighthouse adalah duo maut yang mungkin bisa menjadi jawaban atas permasalahanmu. Lighthouse merupakan open-source tool yang memungkinkanmu untuk mengaudit website yang kamu bangun dengan memberikan detailed report dari performa websitemu, termasuk aksesibilitas dan PWA. Supaya lebih maksimal, kamu bisa mencoba untuk menetapkan cross-functional goals dan menambahkan rekomendasi Lighthouse ke produck backlog kamu. Selamat mencoba!

6. Data Studio

"Specially made for: Product Managers, Engineers, Designers, Marketers"

Olah datamu menjadi sebuah insightful metrics dengan menggunakan dashboard dan report dari Data Studio. Membuat website terkadang tidak lepas dari faktor bisnis dan Data Studio ini membantumu untuk menyajikan data agar bisa menghasilkan keputusan bisnis yang lebih baik, mendapatkan insight, dan mempermudah intrepetasi data. Melalui tampilannya yang simple, kamu akan dibantu untuk membuat custom views dan komentar yang bisa diaskes oleh seluruh anggota tim. Masih kurang? Kamu juga bisa menghubungkan data dari spreadsheet, analytics, dan Google Ads tanpa harus pusing memikirkan banyak kode.

Baca juga: Kiat-kiat Saat Design Handoff, Buat Developer Mengerti Kamu!

Binar Academy — Kemampuanmu mendesain sebuah website nggak akan bisa maksimal kalau kalau kamu belum memiliki tools dan resources yang tepat. Sayangnya, masih banyak tools dan resources canggih yang susah buat diakses olehmu yang masih belajar. Tapi tenang aja, masih ada tools dan resources yang bisa kamu akses dengan mudah, semudah kamu googling hasil pertandingan Liga Inggris karena enam tools dan resources ini dikeluarkan langsung oleh Google yang terkenal dengan produknya yang ramah bagi pemula.

1. Material Design Gallery

"Specially designed for: Designers dan Product Managers"

Buat kamu yang sedang mendesain sebuah website dan membutuhkan feedback dari anggota tim dan para user, Material Gallery ini bisa jadi tools yang cocok untukmu. Material Gallery akan membantumu untuk mengatur dan menkolaborasikan websitemu dengan product design yang memungkinkanmu untuk mengunggah, mendapatkan feedback, dan melacak revisi dari desain yang sudah kamu buat. Tools ini bisa kamu dapatkan dengan mudah melalui Playstore dan Appstore.

2. Material Design Color Tool

"Specially made for: Designers"

Kalau kamu lagi punya project launching website atau berencana untuk re-design website milikmu, mungkin kamu harus mempertimbangkan untuk menggunakan Material Design Color Tool. Tool ini akan membantumu untuk membuat, menerapkan, dan membagikan palet warna yang bisa disesuaikan dengan kebutuhan desain UI milikmu, termasuk alternatif warna yang bisa kamu gunakan dalam mode gelap maupun mode terang. Nilai plus lainnya, Material Design Color Tool bisa kamu gunakan untuk membagikan desain melalui perangkat Android, iOS, dan CodePen yang akan meningkatkan efektivitas desainmu.

3. Workbox

"Specially made for: Product Managers dan Engineers"

Workbox ini oke banget buat kamu yang pengin bikin PWA (Progressive Web App). Kenapa? karena tools ini berisi guide langkah-langkah codelabs yang lengkap disertai contoh-contoh praktis yang super lengkap. Kamu bisa cek workbox lebih langsung di sini.

4. CrUX Dashboard

"Specially made for: Product Managers dan Engineers"

CrUX Dashboard adalah sebuah public dataset dari semua performance data, termasuk laporan-laporan dari kondisi nyata yang terjadi di lapangan, dan dikumpulkan dari pengguna Chrome yang telah memilih untuk menyinkronkan riwayat penjelajahan mereka dan mengaktifkan pelaporan statistik penggunaan. Dengan menggunakan tools ini, kamu akan merasa sangat terbantu ketika akan membagikan data ke semua anggota tim kamu karena tools ini on-build di Data Studio dan sudah secara otomatis disinkronkan dengan set data terbaru.

5. Web Dev & Lighthouse

"Specially made for: Product Managers, Engineers, Designers, Marketers"

Pernah nggak sih kamu mengalami kesulitan saat berusaha untuk membuat improvement dalam website yang kamu buat? Atau merasa kebingungan apa yang mungkin menyebabkan halaman websitemu lama banget rendering-nya? Nah, Web.Dev dan Lighthouse adalah duo maut yang mungkin bisa menjadi jawaban atas permasalahanmu. Lighthouse merupakan open-source tool yang memungkinkanmu untuk mengaudit website yang kamu bangun dengan memberikan detailed report dari performa websitemu, termasuk aksesibilitas dan PWA. Supaya lebih maksimal, kamu bisa mencoba untuk menetapkan cross-functional goals dan menambahkan rekomendasi Lighthouse ke produck backlog kamu. Selamat mencoba!

6. Data Studio

"Specially made for: Product Managers, Engineers, Designers, Marketers"

Olah datamu menjadi sebuah insightful metrics dengan menggunakan dashboard dan report dari Data Studio. Membuat website terkadang tidak lepas dari faktor bisnis dan Data Studio ini membantumu untuk menyajikan data agar bisa menghasilkan keputusan bisnis yang lebih baik, mendapatkan insight, dan mempermudah intrepetasi data. Melalui tampilannya yang simple, kamu akan dibantu untuk membuat custom views dan komentar yang bisa diaskes oleh seluruh anggota tim. Masih kurang? Kamu juga bisa menghubungkan data dari spreadsheet, analytics, dan Google Ads tanpa harus pusing memikirkan banyak kode.

Baca juga: Kiat-kiat Saat Design Handoff, Buat Developer Mengerti Kamu!

Find Another article

Table of Content

Connect With Us Here

Our representative team will contact you soon
BINAR Contribution to SDG’s Impact
Promenade 20, Unit L, Jl. Bangka Raya No.20,

Kec. Mampang Prapatan,
Daerah Khusus Ibukota Jakarta 12720
021 397 11642
Promenade 20, Unit L, Jl. Bangka Raya No.20,

Kec. Mampang Prapatan,
Daerah Khusus Ibukota Jakarta 12720
021 397 11642
© 2016 - 2024, PT. Lentera Bangsa Benderang
Follow us in Social Media
Hi! 👋🏼  
Kamu bisa konsultasi kebutuhanmu di BINAR via WhatsApp ya