By Singgih Ardiansyah 13 Jan, 2020
Pengertian
Face Recognition Identifikasi [pengenalan] wajah atau face recognition adalah sebuah tugas yang dikerjakan oleh manusia secara rutin dan mudah dalam kehidupan seharihari. Penelitian dan pengembangan ilmu pengenalan wajah berkembang secara otomatis atas dasar ketersediaan desktop kuat dan rendah biaya serta embeddedsystem yang telah menciptakan minat yang sangat besar dalam pengolahan citra digital dan video. Motivasi penelitian dan pengembangan dari pengenalan wajah termasuk dalam lingkup otentikasi biometric, pengawasan, interaksi manusiakomputer, dan manajemen multimedia [Li & Jain, 2005:1].
Pengenalan wajah adalah salah satu ilmu yang terdapat di dalam computer vision, di mana sebuah komputer dapat menganalisa suatu citra wajah yang terdapat di dalam sebuah gambar dan dapat menemukan identitas atau data diri dari citra wajah tersebut dengan membandingkan terhadap data-data citra wajah yang sudah disimpan sebelumnya di dalam database. Pada umumnya face recognition dilakukan dari sisi depan dengan pencahayaan yang merata ke 10 seluruh wajah. Akan tetapi muncul beberapa permasalahan, seperti posisi wajah, skala atau jarak wajah, orientasi, umur, dan ekspresi wajah.
Sistem face recognition pada umumnya mencakup empat modul utama [Li & Jain, 2005:2], yaitu: deteksi, alignment, ekstraksi fitur dan pencocokan. Proses lokalisasi dan normalisasi [deteksi wajah dan alignment] adalah langkahlangkah sebelum proses pengenalan wajah [ekstraksi fitur wajah dan pencocokan] dilakukan. Deteksi wajah adalah langkah awal untuk melakukan identifikasi wajah atau face recognition. Sebuah pendeteksi wajah yang ideal seharusnya mampu mengidentifikasi dan menemukan lokasi dan luas semua wajah yang ada di dalam sebuah gambar tanpa memperhatikan pose, skala, orientasi, umur, dan ekspresi [Li & Jain, 2005:13].
Deteksi wajah melakukan segmentasi area citra wajah dengan bagian latar [background]. Proses alignment bertujuan untuk memperoleh akurasi yang lebih baik dan tinggi untuk lokalisasi dan normalisasi citra wajah sebab deteksi wajah menyediakan batas lokasi dan skala dari setiap citra wajah yang dapat terdeteksi. Setelah sebuah wajah dilakukan normalisasi, ekstraksi fitur dilakukan untuk mengambil data yang efektif yang berguna untuk memisahkan antara citracitra wajah dan orang-orang yang berbeda satu sama lain dan cukup stabil untuk bermacam-macam geometric dan fotometrik. Pencocokan wajah dilakukan dengan cara melakukan pencocokan fitur yang telah diekstraksi dari citra wajah 11 masukan dengan kumpulan data latihan dan uji coba citra wajah yang telah tersimpan sebagai database wajah.
Berikut gambaran proses Face Recognition.
Menurut Cao [2005:7], face recognition merupakan proses penganalisa karakteristik dari bentuk muka yang tidak berubah, seperti: • Bagian atas dari rongga mata • Area di sekitar tulang pipi 13 • Sisi kiri dan kanan dari mulut Kesulitan dalam pengenalan wajah sering ditemukan pada: • Noise dan blur yang disebabkan oleh ketidaksempurnaan kamera • Skala: Ukuran wajah terhadap citra • Perubahan bentuk: Posisi wajah, ekspresi, usia • Intensitas cahaya: Pencahayaan, efek pantulan sinar • Gangguan: kacamata, janggut, dan kumis
Menurut Turk [2005:3], pengenalan wajah bisa dilihat sebagai suatu cara untuk secara tepat mengenali citra dari sebuah wajah, dengan menggunakan datadata dari wajah yang telah lebih dahulu dikenal. Pengenalan wajah memiliki semua hambatan dalam pengenalan yang berdasarkan pemrosesan citra. Dikarenakan citra yang digunakan dapat berubah-ubah secara drastis disebabkan beberapa faktor yang rumit dan membingungkan, seperti faktor pencahayaan, posisi kamera, pengaturan kamera, dan noise. Jadi hasil dari face recognition akan berupa informasi yang dikenal atau tidak sebagai wajah dengan sebelumnya membandingkan dengan informasi dari wajah yang diketahui. Proses face recognition ini memiliki permasalahan dari pencahayaan, posisi kamera, parameter kamera dan noise yang didapatkan pada sebuah citra.
Konsep Face Recognition menggunakan JavaScript
- Streaming webcam melalui Live Server dengan HTML
- Menggunakan Face API untuk mendeteksi wajah secara real time
- Hasil deteksi wajah akan digambar sesuai pola wajah secara real time
- Mengidentifikasi emosi melalui bentuk atau perubahan wajah secara real tim
- Persiapan
- Browser [Saran Chrome]
- Visual Studio Code
- Live Server [Extension Visual Studio Code]
- Face API Library JavaScript
Folder project
|– models [folder]
|—— face_expression_model-shard1
|—— face_expression_model-weights_manifest.json
|—— face_landmark_68_model-shard1
|—— face_landmark_68_model-weights_manifest.json
|—— face_landmark_68_tiny_model-shard1
|—— face_landmark_68_tiny_model-weights_manifest.json
|—— face_recognition_model-shard1
|—— face_recognition_model-shard2
|—— face_recognition_model-weights_manifest.json
|—— tiny_face_detector_model-shard1
|—— tiny_face_detector_model-weights_manifest.json
|—face-api.min.js
|—index.html
|—script.js
LANGKAH 1 : MENAMBAHKAN MODEL KEDALAM FOLDER MODELS
Download file model berikut dan ekstrak kedalam folder models.
models.zipLANGKAH 2 : MENAMBAHKAN FILE FACE API KEDALAM FOLDER PROJECT
Download file face-api.min.js berikut dan pindahkan kedalam folder project
face-api.min.jsLANGKAH 3 : MEMBUAT FILE INDEX.HTML
Buat file index.html di dalam folder project lalu masukkan code dibawah ini dan simpan.
File Index.html
Deteksi Wajah - Kopi Coding
body {
margin: 0;
padding: 0;
width: 100vw;
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
}
canvas {
position: absolute;
}
LANGKAH 3 : MEMBUAT FILE SCRIPT.JS
Buat file script.js di dalam folder project lalu masukkan code dibawah ini dan simpan.
FILE SCRIPT.JS
const video = document.getElementById['video']
Promise.all[[
faceapi.nets.tinyFaceDetector.loadFromUri['/models'],
faceapi.nets.faceLandmark68Net.loadFromUri['/models'],
faceapi.nets.faceRecognitionNet.loadFromUri['/models'],
faceapi.nets.faceExpressionNet.loadFromUri['/models']
]].then[startVideo]
function startVideo[] {
navigator.getUserMedia[
{ video: {} },
stream => video.srcObject = stream,
err => console.error[err]
]
}
video.addEventListener['play', [] => {
const canvas = faceapi.createCanvasFromMedia[video]
document.body.append[canvas]
const displaySize = { width: video.width, height: video.height }
faceapi.matchDimensions[canvas, displaySize]
setInterval[async [] => {
const detections = await faceapi.detectAllFaces[video, new faceapi.TinyFaceDetectorOptions[]].withFaceLandmarks[].withFaceExpressions[]
const resizedDetections = faceapi.resizeResults[detections, displaySize]
canvas.getContext['2d'].clearRect[0, 0, canvas.width, canvas.height]
faceapi.draw.drawDetections[canvas, resizedDetections]
faceapi.draw.drawFaceLandmarks[canvas, resizedDetections]
faceapi.draw.drawFaceExpressions[canvas, resizedDetections]
}, 100]
}]
LANGKAH 4 : MENJALANKAN APLIKASI WEB DENGAN LIVE SERVER
Untuk menjalankan aplikasi web dengan Live Server dengan cara klik kanan pada file index.html lalu pilih Open With Live Server.
HASIL :
Secara otomatis Live Server akan membuka aplikasi browser serta menampilkan web dengan URL //127.0.0.1:5500/index.html
Daftar Pustaka:
Lei, Z., Zhou, C., Yi, D., Jain, A. K., & Li, S. Z. [2012, March]. An improved coupled spectral regression for heterogeneous face recognition. In 2012 5th IAPR International Conference on Biometrics [ICB] [pp. 7-12]. IEEE.
HERLAMBANG, M. D. [2016]. RANCANG BANGUN KEAMANAN LOKER DENGAN AUTENTIFIKASI WAJAH DAN PASSWORD BERBASIS RASPBERRY PI DENGAN NOTIFIKASI KEAMANAN VIA ANDROID [Doctoral dissertation, POLITEKNIK NEGERI SRIWIJAYA].
//www.kopicoding.com/deteksi-wajah-dengan-javascript/?fbclid=IwAR1oJvzvVJ-PCkJT0z5t6f2w-ryIEOFv24JH9axboL6y1DzBPsmzRg-DlZQ
Share