Azure Cognitive Service merupakan layanan kecerdasan buatan Microsoft berbasis cloud yang dapat digunakan pengembang aplikasi untuk membangun aplikasi dengan fitur-fitur berbasis AI. Azure Cognitive Services menyediakan banyak layanan yang membuat aplikasi, website atau chatbot dapat melihat, mendengar, berbicara, memahami dan mengartikan kebutuhan pengguna dengan metode yang alami.
Jika kita membuat algoritma berbasis AI dari awal, tentunya akan memakan waktu yang tidak sedikit. Seringkali sebuah algoritma AI merupakan hasil percobaan dan riset bertahun-tahun lamanya. Dengan Cognitive Service, pengembang aplikasi dapat fokus pada masalah bisnis yang ingin diselesaikan dan jika membutuhkan layanan kognitif, dapat menggunakan Azure Cognitive Service.
💻 Mulai Belajar Pemrograman
Belajar pemrograman di Dicoding Academy dan mulai perjalanan Anda sebagai developer profesional.
Daftar SekarangAzure Cognitive Service dapat diakses melalui REST API ataupun client SDK pada berbagai platform yang populer. Azure Cognitive Service merupakan gabungan beberapa layanan yang dapat dikategorikan menjadi 5 grup layanan:
- Vision : algoritma yang terkait dengan pemrosesan gambar, yang dapat melakukan identifikasi, pemberian caption dan melakukan moderasi terhadap gambar
- Speech : algoritma yang terkait dengan proses konversi audio ke text, verifikasi suara dan pengenalan suara dari app.
- Language : algoritma yang terkait dengan pemrosesan bahasa alami, mulai dari evaluasi sentimen hingga melakukan rekognisi keinginan pengguna
- Knowledge : algoritma yang terkait pemetaan informasi dan data yang kompleks dalam rangka menyelesaikan pekerjaan seperti rekomendasi, analisis semantik dan hubungan antar 2 entitas
- Search : algoritma yang terkait dengan kebutuhan pencarian data dari halaman web
Masing-masing grup layanan terdiri lagi dari beberapa fungsi. Misalnya Vision, terdiri dari layanan pencitraan komputer, emotion, rekognisi wajah (face recognition), custom vision dan content moderator.
Contoh layanan yang dimiliki oleh Azure Cognitive Service.
Karena layanan yang sangat beragam, pada artikel ini ini, kita akan membahas mengenai 1 layanan yaitu Computer Vision. Fitur yang akan kita eksplorasi adalah bagaimana memanfaatkan Computer Vision untuk dapat mengenali dan memberikan deskripsi suatu gambar.
Hal yang Perlu Dipersiapkan untuk mengikuti tutorial berikut adalah :
- Azure Computer Vision Android SDK
- Akun Azure yang aktif
- Android Studio 3.0
Langkah 1 – Membuat Azure Cognitive Service
- Masuk ke halaman Azure portal : http://portal.azure.com
- Pilih Create a resource
- Pada search box, ketikkan Computer Vision
- Pilih Create
- Pada menu Resource Group, pilih Create a new one atau Use existing jika sebelumnya sudah memiliki Resource Group (pada artikel ini akan digunakan Resource Grup pada tutorial sebelumnya).
Untuk pricing tier pilih F0. - Pilh Create.
Langkah 2 – Mendapatkan Subscription Key
Untuk menggunakan Computer Vision service yang baru saja kita buat maka dibutuhkan subscription key yang akan dipanggil dari aplikasi. Untuk melihat subscripion key, ikuti langkah berikut :
- Pilih Computer Vision Service yang kita buat dengan mengklik tombol All resources yang sudah dibuat pada langkah sebelumnya
- Pilih Keys.
- Simpan nilai Name dan Key 1. Nilai ini akan digunakan di dalam aplikasi
Name : dicodingvision
Key 1 : a636511130b545f39b069ab0d236b886
Untuk langkah berikutnya kita akan mulai mengakses layanan yang sudah dibuat dari Android project. Untuk kebutuhan ini, silahkan menggunakan project starter berikut ini : link.
Langkah 3 – Alur Kerja Penggunaan Computer Vision API
Untuk mengakses layanan, pengembang dapat menggunakan REST API atau Client SDK sesuai dengan platform pilihan. Agar tutorial ini menjadi tutorial yang juga bersifat platform agnostic maka kita akan menggunakan REST API. Pemahaman menggunakan REST API merupakan hal yang fundamental karena Client SDK pada dasarnya merupakan wrapper dari REST API yang sudah tersedia.
Meskipun kita hanya akan membahas satu tipe layanan yaitu Computer Vision, Untuk mengakses layanan Cognitive Service lainnya pada dasarnya mengikuti pola yang sama sebagai berikut :
- Menyiapkan data input. Pada computer vision input adalah gambar atau url, pada layanan yang lain mungkin berupa teks, atau file stream.
- Melakukan inisialisasi layanan. Jika menggunakan platform SDK, inisialisasi biasanya dengan memanggil fungsi alokasi object dari masing-masing layanan
- Melakukan pemanggilan API
- Menginterpretasi hasil API, biasanya dengan melakukan parsing terhadap file JSON kembalian dan mengambil informasi yang dibutuhkan
- Menampilkan hasil API atau memproses data lebih lanjut
Langkah 4 – Menyiapkan Project Android
Untuk memulai tutorial, pembaca dapat menggunakan project starter pada link berikut ini https://www.dropbox.com/s/ovpq4s6jge9dq3p/dicodingvision1.zip?dl=0 : atau melakukan konfigurasi seperti berikut :
- Menyiapkan antarmuka untuk memilih menu fitur Computer Vision
- Menyiapkan antarmuka untuk memilih daftar gambar. Pada contoh, daftar gambar merupakan image gallery yang bersumber dari internet (url image). Pembaca dapat bereksperimen dengan menggunakan data dari filesystem atau camera.
- Membuat sebuah file konstanta, untuk meyimpan beberapa nilai parameter, yaitu url computer Vision API dan informasi key.
12345678910111213141516171819202122232425public class Constant{public static final String SUBSCRIPTION_KEY = "a636511130b545f39b069ab0d236b886";public class DateFormat{public static final String SERVER = "yyyy-MM-dd'T'HH:mm:ss";}public class Api{public static final String BASE_URL = "https://southeastasia.api.cognitive.microsoft.com/vision/v1.0/";public static final int TIMEOUT = 15;public class Params{public static final String KEY = "Ocp-Apim-Subscription-Key";}}public class Data{public static final int ANALYZE = 1;public static final int AUTO_CAPTION = 2;public static final int ACTRESS = 3;}} - Menyiapkan halaman untuk menampilkan hasil. Halaman hasil terdiri dari kontrol image view dan text view. TextView akan kita gunakan untuk menampilkan hasil pemanggilan API.
Langkah 5 – Melakukan Analisis Terhadap Gambar
Analisis gambar dilakukan untuk memperoleh informasi mengenai gambar. Melalui computer vision kita dapat memperoleh informasi mengenai format gambar, ukuran, apakah gambar bersifat rasis atau mengandung konten pornografi, kategori dari gambar, apakah mengandung wajah dan sebagainya. Berbekal informasi ini kita dapat melakukan berbagai macam hal. Misalnya kita bikin program melakukan moderasi konten secara otomatis untuk gambar yang dideteksi mengandung konten pornografi atau membuat program untuk dapat melakukan pemeriksaan jika gambar yang diupload mengandung wajah atau tidak, misalnya dalam program pemeriksa KTP atau absensi. Skenarionya sangat terbatas, sky is the limit.
Untuk melakukan proses Analisis gambar dilakukan dengan memanggil fungsi Analyze.
1 |
POST https://southeastasia.api.cognitive.microsoft.com/vision/v2.0/analyze?visualFeatures=Categories&language=en HTTP/1.1 |
Fungsi ini memiliki 2 parameter query string yaitu visualFeatures untuk menentukan apa saja yang mau dianalisis dan language untuk menentukan bahasa. Fungsi akan menerima parameter input berupa url image atau stream dari image. Pada contoh, kita akan menggunakan url image.
Ikuti langkah berikut ini untuk memahami dasar penggunaan fungsi analisis gambar pada Computer Vision.
- Pada fungsi analyze lakukuan persiapan data input. Data input adalah berupa imageUrl (yang diperoleh dari halaman pilih gambar) dengan field
1 2 |
JsonObject jsonObject = new JsonObject(); jsonObject.addProperty("Url", imageUrl); |
- Melakukan inisialisasi pemanggilan layanan. Telah kita siapkan informasi yang dibutuhkan pada berkas Constant.java
- Melakukan pemanggilan API. Untuk memanggil API kita akan gunakan memberikan konfigurasi visualFeatures untuk Tipe gambar, warna, wajah, pemeriksaan apakah gambar mengandung pornografi dan kategori gambar.
12String features = "ImageType, Color, Faces, Adult, Categories";Call<Analyze> call = apiRequest.call().Analize(features, "en", jsonObject); - Untuk melakukan interpretasi API atau melakukan parsing data, kita akan membuat file Analyze.java yang memuat hasil dari pemanggilan fungsi Analyze. Hasil dari fungsi ini merupakan file json dengan sebagian format ditunjukkan dibawah ini :
123456789/*** categories : [{"name":"people_","score":0.98828125}]* faces : [{"age":29,"gender":"Female","faceRectangle":{"top":84,"left":257,"width":85,"height":85}}]* adult : {"isAdultContent":false,"adultScore":0.036051180213689804,"isRacyContent":true,"racyScore":0.9632097482681274}* color : {"dominantColorForeground":"Brown","dominantColorBackground":"Grey","dominantColors":["Grey"],"accentColor":"4E587D","isBwImg":false}* imageType : {"clipArtType":0,"lineDrawingType":0}* requestId : 0760c1e6-9a9f-4d69-88d6-29f6602e7092* metadata : {"height":723,"width":600,"format":"Jpeg"}*/
Kelas Analyze.java memuat field untuk menampung data-data tersebut. Untuk melihat definisi lengkap kelas Analyze.java dapat di lihat pada link berikut. - Setelah kembalian API diperoleh, berikutnya adalah menampilkan data. Data dari kelas Analyze kita tampilkan dengan memilih informasi yang sesua. Pada contoh, kita akan menampilkan semua data.
1234567891011121314151617181920212223242526272829303132333435363738394041public void onFinishRequest(ApiResponse r){swipeRefreshLayout.setRefreshing(false);Analyze response = (Analyze) r.getData();if (response != null){textInfo.append("Image format: " + response.getMetadata().getFormat() + "\n");textInfo.append("Image width: " + response.getMetadata().getWidth() + ", height:"+ response.getMetadata().getHeight() + "\n");textInfo.append("Clip Art Type: " + response.getImageType().getClipArtType() + "\n");textInfo.append("Line Drawing Type: " + response.getImageType().getLineDrawingType() + "\n");textInfo.append("Is Adult Content:" + response.getAdult().isIsAdultContent() + "\n");textInfo.append("Adult score:" + response.getAdult().getAdultScore() + "\n");textInfo.append("Is Racy Content:" + response.getAdult().isIsRacyContent() + "\n");textInfo.append("Racy score:" + response.getAdult().getRacyScore() + "\n\n") ;for (Analyze.Categories category: response.getCategories()){textInfo.append("Category: " + category.getName() + ", score: " + category.getScore() + "\n");}textInfo.append("\n");int faceCount = 0;for (Analyze.Faces face: response.getFaces()){faceCount++;textInfo.append("face " + faceCount + ", gender:" + face.getGender()+ ", age: " + face.getAge() + "\n");textInfo.append(" left: " + face.getFaceRectangle().getLeft()+ ", top: " + face.getFaceRectangle().getTop()+ ", width: " + face.getFaceRectangle().getWidth()+ " height: " + face.getFaceRectangle().getHeight() + "\n" );}if (faceCount == 0){textInfo.append("No face is detected");}textInfo.append("\n");textInfo.append("\nDominant Color Foreground :" + response.getColor().getDominantColorForeground() + "\n");textInfo.append("Dominant Color Background :" + response.getColor().getDominantColorBackground() + "\n");}} - Pilih Run “app” untuk mengkompilasi dan menjalankan aplikasi di Android simulator/device
- Contoh Aplikasi ketika dijalankan
Aplikasi merupakan clip-art dengan tipe line drawing tidak memiliki konten pornografi.
Penulis sudah menyiapkan beberapa gambar lainnya agar dapat dieksplorasi lebih jauh oleh pembaca.
Aplikasi mengandung informasi wajah, hingga lokasi rectangle wajah tersebut berada.
Langkah 6 – Memberikan Caption Otomatis
Computer Vision juga menyediakan layanan memberikan caption secara otomatis. Bagaimana sebuah gambar diberikan keterangan (caption) secara otomtis oleh sistem? Dengan bantuan machine learning Tim Riset Microsoft telah mengelompokkan berbagai gambar diseluruh dunia ke dalam 87 tipe.
Selanjutnya dari klasifikasi tersebut, sistem akan menghasilkan caption yang dianggap paling sesuai.
Ikuti langkah berikut ini untuk memahami dasar penggunaan fungsi autocaption gambar pada Computer Vision.
- Pada fungsi autoCaption di AnalyzePhotoActivity.java lakukuan persiapan data input. Data input adalah berupa imageUrl (yang diperoleh dari halaman pilih gambar) dengan field
1 2 |
JsonObject jsonObject = new JsonObject(); jsonObject.addProperty("Url", imageUrl); |
- Melakukan inisialisasi pemanggilan layanan. Telah kita siapkan informasi yang dibutuhkan pada berkas Constant.java
- Melakukan pemanggilan API. Untuk memanggil API kita akan gunakan memberikan konfigurasi visualFeatures untuk Description.
1 2 |
String features = "Description"; Call<AutoCaption> call = apiRequest.call().AutoCaption(features, "en", jsonObject); |
- Untuk melakukan interpretasi API atau melakukan parsing data, kita akan membuat file Autocaption.java yang memuat hasil dari pemanggilan fungsi Analyze. Hasil dari fungsi ini merupakan file json dengan sebagian format ditunjukkan dibawah ini :
1 2 3 4 5 |
/** * description : {"tags":["outdoor","person","clothing","beach","water","woman","surfing","carrying","standing","young","white","wearing","sand","board","walking","holding","suit","black","girl","man","ocean"],"captions":[{"text":"a woman standing on a beach","confidence":0.9636017395601711}]} * requestId : 89704f14-8a57-4a6e-9e3d-5e4c71424d22 * metadata : {"height":723,"width":600,"format":"Jpeg"} */ |
Kelas Autocaption.java memuat field untuk menampung data-data tersebut. Untuk melihat definisi lengkap kelas Autocaption.java dapat di lihat pada link berikut.
- Setelah kembalian API diperoleh, berikutnya adalah menampilkan data. Data dari kelas Autocaption kita tampilkan dengan memilih informasi yang sesua. Pada contoh, kita akan menampilkan semua data.Pada button pilih gambar, tambahkan kode untuk berikut ini :
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
public void onFinishRequest(ApiResponse r) { swipeRefreshLayout.setRefreshing(false); AutoCaption response = (AutoCaption) r.getData(); if (response != null) { textInfo.append("Image format: " + response.getMetadata().getFormat() + "\n"); textInfo.append("Image width: " + response.getMetadata().getWidth() + ", height: " + response.getMetadata().getHeight()); textInfo.append("\n"); textInfo.append("\n"); for (AutoCaption.Description.Captions caption : response.getDescription().getCaptions()) { textInfo.append("Caption: " + caption.getText() +", confidence: " + caption.getConfidence()); } textInfo.append("\n"); textInfo.append("\n"); textInfo.append("Tags:"); textInfo.append("\n"); for (String tag : response.getDescription().getTags()) { textInfo.append(tag + "\n"); } } } |
- Pilih Run “app” untuk mengkompilasi dan menjalankan aplikasi
Sistem memberikan caption “A man standing next to a body of water” dengan nilai confidence 0.89. Sistem akan memberikan beberapa pilihan caption dengan tingkat kepercayaan tertentu. Pemrogram dapat memilih informasi yang sudah disediakan oleh API.
Sistem memberikan caption “Tessa Thompson et al posing for the camera”. Sistem mampu memberikan caption hingga mengetahui siapa yang berada pada foto tersebut. Ini salah satu kemampuan identifikasi spesifik domain yang akan kita bahas di step berikutnya.
Langkah 5 – Mengidentifikasi Aktris Pada Gambar
Computer Vision menyediakan layanan identifikasi gambar untuk spesifik domain yaitu selebriti dan landmark. Dengan layanan ini, tidak hanya Computer Vision bisa mengenali ada obyek apa tetapi lebih detail obyek tersebut siapa (selebriti) atau dimana (nama tempat). Pada bagian ini kita akan melihat cara menggunakan Computer Vision untuk menidentifikasi foto selebriti. Selanjutnya dari klasifikasi tersebut, sistem akan menghasilkan caption yang dianggap paling sesuai.
Ikuti langkah berikut ini untuk memahami dasar penggunaan fungsi Identifikasi selebriti dan landmark pada Computer Vision.
- Pada fungsi actress di AnalyzePhotoActivity.java lakukuan persiapan data input. Data input adalah berupa imageUrl (yang diperoleh dari halaman pilih gambar) dengan field
1 2 |
JsonObject jsonObject = new JsonObject(); jsonObject.addProperty("Url", imageUrl); |
- Melakukan inisialisasi pemanggilan layanan. Telah kita siapkan informasi yang dibutuhkan pada berkas Constant.java
- Melakukan pemanggilan API. Untuk memanggil API kita akan gunakan memberikan konfigurasi visualFeatures untuk Description.
1 2 |
String model = "celebrities"; Call<Actress> call = apiRequest.call().Actress(model, jsonObject); |
- Untuk melakukan interpretasi API atau melakukan parsing data, kita akan membuat file Actress.java yang memuat hasil dari pemanggilan fungsi Actress. Hasil dari fungsi ini merupakan file json dengan sebagian format ditunjukkan dibawah ini :
1 2 3 4 5 |
/** * result : {"celebrities":[{"faceRectangle":{"top":49,"left":43,"width":89,"height":89},"name":"Taylor Swift","confidence":0.999275267124176}]} * requestId : 3c471556-5989-4c1f-b62a-28f9dca3ef0c * metadata : {"height":261,"width":220,"format":"Jpeg"} */ |
Kelas Actress.java memuat field untuk menampung data-data tersebut. Untuk melihat definisi lengkap kelas Actress.java dapat di lihat pada link berikut.
- Setelah kembalian API diperoleh, berikutnya adalah menampilkan data. Data dari kelas Actress kita tampilkan dengan memilih informasi yang sesua. Pada contoh, kita akan menampilkan semua data.Pada button pilih gambar, tambahkan kode untuk berikut ini :
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
public void onFinishRequest(ApiResponse r) { swipeRefreshLayout.setRefreshing(false); Actress response = (Actress) r.getData(); if (response != null) { textInfo.append("Image format: " + response.getMetadata().getFormat() + "\n"); textInfo.append("Image width: " + response.getMetadata().getWidth() + ", height:" + response.getMetadata().getHeight() + "\n"); textInfo.append("\n"); if (response.getResult().getCelebrities().size() != 0) { textInfo.append("Celebrities detected: " + response.getResult().getCelebrities().size() + "\n"); for (Actress.Result.Celebrities celeb : response.getResult().getCelebrities()) { textInfo.append("Name: " + celeb.getName() + ", score: " + celeb.getConfidence() + "\n"); } } else { textInfo.append("Celebrities detected: 0"); } } } |
- Pilih Run “app” untuk mengkompilasi dan menjalankan aplikasi di Android simulator/device
- Contoh Aplikasi ketika dijalankan
Sistem memberikan identifikasi Gianluigi Buffon dengan tingkat kepercayaan 1.0. Tingkat kepercayaan 1.0 menandakan sistem pasti yakin bahwa gambar adalah Buffon.
Sistem berhasil mengidentifikasi bahwa tidak ada selebriti pada foto tersebut.
Sistem berhasil mengidentifikasi bahwa foto adalah Dian Sastrowardoyo dengan tingkat kepercayaan 0.998. Masih ada keraguan disana meskipun kecil. Mungkinkan sistem bingung apakah gambar tersebut adalah Dian atau Raisa ?
Demikian cara penggunaan Azure Cognitive Service, khususnya layanan Computer Vision. Menggunakan Cognitive Service dapat meningkatkan aplikasi yang kita kembangkan dengan menambahkan kemampuan kecerdasan buatan. Skenarionya sangat luas dan dapat menyentuh di berbagai sektor industri. Dengan menggunakan layanan ini akan memberikan pengalaman yang lebih baik bagi pengguna sekaligus menyelesai tugas yang tadinya tidak bisa dilakukan oleh manusia secara manual.
Source code lengkap dapat diperoleh disini : https://github.com/aderifaldi/dicodingvissionandroid
Azure Cognitive Service masih memiliki banyak fitur yang tidak sempat dibahas diartikel ini. Untuk mempelajari beberapa fitur lainnya, disarankan untuk membaca pranala berikut :
Microsoft sedang mengadakan Microsoft Azure Cognitive Services Challenge yang dapat dilihat di link berikut :
https://www.dicoding.com/challenges/368