Peen 🥺 여부를 결정하는 빌어 먹을 앱을 만들었습니다.

아무래도, 주식회사 메이크리의 쿠로가미( )라고 합니다.
빌어 먹을 앱 2 Advent Calendar 2020 18일째 게시물입니다.

만든 것

사진에 찍혀있는 얼굴이 "피엔 🥺"인지 여부를 판단하는 빌어 먹을 응용 프로그램입니다.

🥺 pi-checker

이미지를 선택하면 얼굴을 감지하고 필기 여부를 결정합니다.

피엔 스코어가 90을 넘으면 「파온🐘」가 됩니다.

판정은 꽤 가바가바입니다.

경위

올해도 작년 에 이어, face-api.js라는 tensorflow.js를 이용한 JavaScript 라이브러리를 이용하려고 하는 것으로 확실히 생각해 온 것이 이 빌어 먹을 앱입니다.

나는 5 초 만에 생각했다.
이 정도의 속도감이 빌어 먹을 앱 개발에는 필요하네요(수수께끼)

처음에는 필기 HTML에서 소스 코드를 써서 웹 사이트를 만들 수있는 빌어 먹을 응용 프로그램을 만들고있었습니다 만, 너무 심각하지 마라 ~라고 생각 전향했습니다.

필기 텍스트에서 소스 코드를 생성하는 빌어 먹을 응용 프로그램 만들기 피 c. 라고 r. 코 m / c2 엣 svCxH — 쿠로가미/makery, inc CEO (@kokushing) December 1, 2020

tensorflow를 사용하여 피엔 여부를 결정하는 빌어 먹을 앱 만들기. 피 c. 라고 r. 이 m/f 케세 1pyRW

나중에 여담입니다만, December 5, 2020 의 대상은 「피엔」답습니다. 보고싶다.

구현

React.js, TypeScript, face-api.js, react-dropzone, styled-components에서 구현했습니다.

이미지 다운로드에는 html2canvas라는 라이브러리를 이용하고 있습니다.

인프라는 Netlify 선배. Vercel 선배도 신경이 쓰이기 때문에 이번에 시도합니다.

이 빌어 먹을 앱의 작동 방식은 간단하며 react-dropzone에서 받은 이미지 데이터를 face-api.js로 분석하여 얼굴 표정을 숫자로 가져옵니다.

다음은 수치에 의해 결과를 바꿀 뿐. 간단하네요.

슬픈 얼굴 수치를 얻으려면 다음과 같이 쓰면 얻을 수 있습니다.

(async () => {
  const inputEl = document.getElementById("input") as HTMLImageElement;
  const MODEL_URL = `${process.env.PUBLIC_URL}/models`;
  await faceapi.nets.tinyFaceDetector.load(MODEL_URL);
  await faceapi.nets.faceExpressionNet.load(MODEL_URL);

  const detectionsWithExpressions = await faceapi
    .detectAllFaces(inputEl, new faceapi.TinyFaceDetectorOptions())
    .withFaceExpressions();

  const score =
    detectionsWithExpressions.length > 0
      ? detectionsWithExpressions[0].expressions.sad
      : -1;

  console.log(score); // 悲しみの数値を取得
})();

후기

진짜는 OG화상이라든지 SSR해서 Twitter로 쉐어할 수 있도록(듯이) 하고 싶었습니다만, 시간의 사정으로 단념했습니다.

피엔 🥺

Photo by

삼성당 사전을 짜는 사람이 선택하는 「올해의 신어 2020」

파쿠타소

Reference

이 문제에 관하여(Peen 🥺 여부를 결정하는 빌어 먹을 앱을 만들었습니다.), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/kokushin/items/d413464b1d98162d07ad

텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.

우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다