[LifeAsDog] 이미지 학습 및 로직 설정

👀 이미지 학습 / 로직 분기

Google Teachable Machine으로 이미지를 학습시키고, 학습한 결과를 로직에 따라 계산하여 최종 결과를 나타내는 과정을 기록한다.

✔ 이미지 학습

Google Teachable Machine을 이용하면 간단하게 이미지를 학습시킬 수 있다.

클래스마다 학습시키고자 하는 이미지를 업로드하고, Train Model을 눌러주면 끝이다. Advanced 설정을 통해서 트레이닝시의 Epochs, Batch Size, Learning Rate을 설정해 줄 수 있다. 각각 간단하게 설명하자면,

• Epoch: 학습을 몇번 할 것인지?
• Batch Size: 한 번 학습에 얼마나 많은 데이터를 사용할 것인지? 대부분의 경우에 메모리의 한계와 속도 저하때문에 모든 데이터를 한 번의 epoch에 집어넣을 수 없다. 따라서 batch size를 설정함으로써 데이터를 나누어서 학습시킨다.
• Learning Rate: 학습을 얼마나 빠르게 할 것인지?

나같은 경우에는 머신러닝에 대해서 잘 알지 못하기 때문에 기본설정으로 학습시켰다.

학습을 완료하고 Export Model을 선택하면 직접 다운로드 받을수도 있고, 링크로 받아 사용할 수도 있다. 링크를 이용할 때 훨씬 빠르다고 조코딩님께서 말씀하셔서 나는 링크를 이용했다. 기본적인 코드 사용법은 다음과 같다.

//변수 선언
let URL = "링크";
let model, webcam, labelContainer, maxPredictions;
const modelURL = URL + "model.json";
const metadataURL = URL + "metadata.json";

//모델 생성
model = await tmImage.load(modelURL, metadataURL);
//이미지 가져오기
let image = document.getElementById("face-image");
//이미지를 모델에 적용
const prediction = await model.predict(image, false);

//prediction[i]에 오브젝트로 각각의 class가 저장되고, prediction[i].name과
//prediction[i].probability로 이름과 확률에 각각 접근할 수 있다.

이렇게 prediction 변수에 닮은 정도를 저장할 수 있었다.

✔ MBTI 결과

MBTI는 I와 E, S와 N, T와 F, J와 P를 판별할 수 있는 3가지 문항, 총 12가지 문항으로 준비하였다. 전자일경우 1, 후자일경우 0을 파라미터로 전달하여 mbtiList에 더해주었다. mbtiList의 값이 1보다 클 경우에는 1, 전자, 즉 ISTJ 알파벳을 의미하고, 1과 같거나 작을 경우에는 후자, 즉 ENFP 알파벳을 의미하도록 하여 mbti를 완성했다.

완성된 mbti는 editDistance로 다른 mbti와 얼마나 비슷한지를 계산해주었다 (editDistance라고는 하지만 간단하다). 최종 결과는 prediction * 0.7 + mbti * 0.3을 계산하였고, 16개의 결과 중 가장 큰 값을 가지를 결과를 도출해냈다.

비율은 임의로 설정한 것으로, 기본적으로 생김새가 비슷한 결과가 나오지만, 퍼센테이지의 차이가 적을때는 mbti에 따라서 경향성이 바뀔 수 있도록 설정했다. 만약 로트와일러(ENTP)와 스피츠(INTP)가 31%대 30%로 근소할 때, mbti의 경향성이 INTP에 더 치우쳐 있다면, 31%의 ENTP가 아닌 30%의 INTP가 나오는 셈이다. 언제까지나 임의로 설정한 것으로 통계에 따른 근거는 존재하지 않는다.

let mbtiList = [0, 0, 0, 0];

function question(num, mbtiNum, add){
  mbtiList[mbtiNum] += add;
  ...
}

function mbtiCalculate(){
  for(let i = 0; i < 4; i++){
    if(mbtiList[i] > 1){
      mbti += "1";
    }
    else{
      mbti += "0";
    }}}

function editDistance(){
  for(let i = 0; i < mbtiCompare.length; i++){
    for(let j= 0; j < 4; j++){
      if(mbtiCompare[i].mbti[j] == mbti[j]){
        mbtiPercent[i] += 0.25;
      }}}}

✔ ATOM Beautify

코드를 복사해 올 때 정렬이 엉켜있는 경우 자동 정렬해주는 패키지이다. Teachable machine이나 Codepen에서 코드를 복사해 올 때 유용하다.

//자동정렬 단축키
Ctrl + Alt + b

✔ WebGL 오류

Teachable Machine 코드를 실행할 때 WebGL이 실행되지 않는다는 오류가 발생했다. 이는 크롭에서 WebGL이 허용되어 있지 않은 경우 발생하는 문제로, 간단하게 해결 가능하다.

1. chrome://settings - Advanced - System에서 Use hardware accerlation when available을 허용
2. chrome://flags - Disable WebGL을 Activate

👍 참고 사이트

1. 웹캠 없이 Teachable Machine으로 나와 닮은 동물상 찾기