Teachable Machine은 누구나 머신러닝 모델을 쉽고 빠르고 간단하게 만들 수 있도록 제작된 웹 기반 도구이다.
Teachable Machine
Train a computer to recognize your own images, sounds, & poses. A fast, easy way to create machine learning models for your sites, apps, and more – no expertise or coding required.
teachablemachine.withgoogle.com
사이트에 들어가면 이미지 프로젝트, 오디오 프로젝트, 포즈 프로젝트가 있다. 포즈 프로젝트는 홈트 할 때 가벼운 게임 정도 만들면 좋을 것 같다. 이미지 프로젝트에는 표준 이미지 모델과 삽입된 이미지 모델이 있는데 그레이스케일 이미지가 있는 것 보니까 opencv, halcon 등 영상처리 프로그래밍 관련에 어울리는 인터페이스인 것 같다.
캠으로 실시간으로 러닝을 시킬 수 있고 저장된 파일을 업로드하여 러닝을 시킬 수도 있다. 전부 학습시켰으면 모델 학습시키기 버튼을 눌러 학습을 시키고 모델 내보내기를 하여 러닝된 값을 주소화시켜서 제공받거나 프로그램 형태로 다운로드할 수 있다.
나는 검은 바나나와 흰 바나나 두 개를 학습시켰다.
그리고 프로그램에 뜨는 퍼센티지를 활용하여 과일 등급을 선정해 주게 일부 코드를 변경하였다. 아이디어만 많으면 다양하게 코드 활용이 가능해 보인다.
리팩토링된 풀 코드
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div>Teachable Machine Image Model</div>
<button type="button" onclick="init()">Start</button>
<div id="webcam-container"></div>
<div id="label-container"></div>
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@1.3.1/dist/tf.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@teachablemachine/image@0.8/dist/teachablemachine-image.min.js"></script>
<script type="text/javascript">
const URL = "./my_model/";
let model, webcam, labelContainer, maxPredictions;
async function init() {
const modelURL = URL + "model.json";
const metadataURL = URL + "metadata.json";
model = await tmImage.load(modelURL, metadataURL);
maxPredictions = model.getTotalClasses();
const flip = true; // whether to flip the webcam
webcam = new tmImage.Webcam(200, 200, flip);
await webcam.setup(); // request access to the webcam
await webcam.play();
window.requestAnimationFrame(loop);
document.getElementById("webcam-container").appendChild(webcam.canvas);
labelContainer = document.getElementById("label-container");
for (let i = 0; i < maxPredictions; i++) {
labelContainer.appendChild(document.createElement("div"));
}
}
async function loop() {
webcam.update(); // update the webcam frame
await predict();
window.requestAnimationFrame(loop);
}
async function predict() {
const prediction = await model.predict(webcam.canvas);
const probability = prediction[0].probability.toFixed(2);
const className = prediction[0].className;
let grade = "D급 입니다."; // Default to D grade
if (className == "pure") {
if (probability >= 0.99) {
grade = "A급 입니다.";
} else if (probability >= 0.50) {
grade = "B급 입니다.";
} else if (probability > 0) {
grade = "C급 입니다.";
}
}
labelContainer.childNodes[0].innerHTML = grade;
}
</script>
</body>
</html>
이렇게 앱, 웹 등 다양하게 확인이 가능하다.
'인공지능' 카테고리의 다른 글
| Teachable Machine를 이용한 검출력 사진 분류 (1) | 2024.03.22 |
|---|