Skip to content Skip to sidebar Skip to footer

Ubah Gambar Tangan menjadi Kode HTML Dengan AI Microsoft

Ubah Gambar Tangan menjadi Kode HTML

Pada artikel ini saya akan share cara mengubah gambar tangan menjadi Kode HTML dengan bantuan aplikasi web yang di dukung AI Microsoft untuk mengonversi desain secara gratis. Membuat desain web tidak mudah. Pertama, Agan harus membuat atau menggambar desain prototipe dan kemudian harus membuat kode untuk membuat wireframe HTML.

Bagian pengkodean membutuhkan banyak waktu dan mungkin perlu beberapa revisi. Tetapi bagaimana jika Agan dapat melewati bagian pengkodean dan secara langsung mengubah desain yang digambar tangan menjadi kode HTML? Teknologi untuk mengotomatisasi pengkodean desain seperti itu sekarang sudah ada dan Microsoft baru saja melakukannya dengan proyek AI eksperimental mereka.

Sketch2Code adalah aplikasi web gratis tempat Agan dapat mengubah gambar tangan menjadi Kode HTML. Aplikasi ini menggunakan model custom Computer Vision yang mengenali objek dan pola, membuat prediksi untuk mendeteksi elemen desain yang bermakna, dan menghasilkan cuplikan HTML. Alat ini sepenuhnya gratis untuk digunakan dan memungkinkan Agan untuk mengkonversi satu gambar desain sekaligus.

Ubah Gambar Tangan menjadi Kode HTML Dengan AI Microsoft

Sketch2Code didukung oleh Microsoft Azure Cloud Platform dan Layanan Web Azure Cloud AI. Ini menggunakan custom Vision APIs dan Computer Vision APIs untuk deteksi objek, OCR, dan deteksi tulisan tangan. Untuk menggunakan aplikasi ini, cukup kunjungi halaman Sketch2Code dan unggah gambar desain Agan di sana.

Jika Agan mengakses aplikasi pada perangkat dengan kamera, Agan juga dapat mengambil gambar desain Agan secara langsung. Fitur "Take a Picture" ini berguna untuk dengan cepat mengubah desain whiteboard menjadi kode HTML.

Ubah Gambar Tangan menjadi Kode HTML-1

Saat Agan mengunggah gambar dengan metode apa saja, perlu beberapa detik untuk memproses identifikasi desain yang digambar tangan dan membuat prediksi. Kemudian, ini menunjukkan kepada Agan pratinjau cuplikan HTML desain Agan berdampingan dengan gambar asli.

Ubah Gambar Tangan menjadi Kode HTML-2

Dari layar pratinjau ini, Agan dapat mengunduh kode HTML yang dihasilkan dari desain Agan. Agan mendapatkan file HTML yang berisi potongan untuk desain Agan. Agan dapat membuka file di dalam browser web untuk melihat hasilnya.

Ubah Gambar Tangan menjadi Kode HTML-3

Bersamaan dengan tombol download, Agan juga mendapatkan tombol lain yang menunjukkan kepada Agan rincian objek yang diprediksi. Tombol ini membawa Agan ke halaman baru tempat Agan melihat cara kerja aplikasi ini. Ini menunjukkan kepada Agan gambaran transformasi desain yang digambar tangan menjadi kode HTML dengan menyoroti deteksi dan prediksi objek berbasis AI.



Benang Merah: Sketch2Code adalah aplikasi bagus yang memiliki potensi besar untuk merevolusi cara kita membuat desain web. Hasilnya sangat bagus meskipun tergantung pada desain juga. Kasus penggunaan aplikasi ini sangat terbatas saat ini, Agan dapat menggunakannya dengan desain dasar dan elemen halaman.

Bagaimanapun, menggambar di whiteboard dan kemudian melihat kode yang dihasilkan untuk menguji di halaman web merupakan ide baru yang cukup bagus.
Yuk kepoin tips dan trik brankaspedia lainnya di Google News.