気分に合わせた香りをおすすめ!顔の表情から感情を読み取り、最適なアロマオイルをLINEで送るよ!
今回は、機械学習を使用し顔の表情から感情を読み取り、感情に合わせたアロマオイルをLINEでおすすめしてくれるアプリケーションを作成しました!
名付けて「香りリコメンドシステム」!!
制作に至った理由
私は、”香り”が好きでアロマオイルやお香、シーシャなどをよく利用しています。
そこで、自分の感情に合わせて「香り」をおすすめしてくれるサービスがあればいいなと思っていました。
ですが、なかなかそんなサービスはなく。今回はプロトタイプを作成してみようと思いました。
使用したサービス
Teachable Machine
Integromat
使用したライブラリ
ml5
axsios
機械学習
今回はTeachable Machineを利用し、”笑顔”、怒り”、”疲労”、”悲しみ”といった感情を各500枚づつ学習をさせています。
コード全文
Face-Aroma.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Face-Aroma</title>
</head>
<body>
<h1>気分に合わせた香りをおススメ</h1>
<div id="console_log"></div>
<video id="myvideo" width="640" height="480" muted autoplay playsinline></video>
<script src="https://unpkg.com/ml5@latest/dist/ml5.min.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script>
// 作成したモデルのURL
const imageModelURL = 'https://teachablemachine.withgoogle.com/models/XXXXXXX/';
console.log = function (log) {
document.getElementById('console_log').innerHTML = log;
}
async function main() {
// カメラからの映像取得
const stream = await navigator.mediaDevices.getUserMedia({
audio: false,
video: true,
});
// IDが"myvideo"であるDOMを取得
const video = document.getElementById('myvideo');
// videoにカメラ映像をセット
video.srcObject = stream;
// 自作モデルのロード
classifier = ml5.imageClassifier(imageModelURL + 'model.json', video, () => {
// ロード完了
console.log('Model Loaded!');
});
// 分類処理を連続的に行う
function onDetect(err, results) {
if (results[0]) {
console.log(results[0].label);
if (results[0].label === '笑顔') {
// storytelling 関数実行
face1();
}
if (results[0].label === '怒り') {
face2();
}
if (results[0].label === '疲れ') {
face3();
}
if (results[0].label === '悲しみ') {
face3();
}
}
classifier.classify(onDetect);
}
classifier.classify(onDetect);
}
// 引数に送りたいメッセージを入れる
async function sendWebhook(message) {
// Integromatに送る
try {
// 取得したIntegromatのWebhookURL
const res = await axios.get(`https://hook.integromat.com/XXXXXXXXXXXXXXX?message=${message}`);
console.log(res.data);
} catch (err) {
console.error(err);
}
}
function face1(){
sendWebhook('幸せでハッピー。そんなときのおすすめの香りは「ローズ」、「ネロリ」です!');
}
function face2(){
sendWebhook('イライラしてしまう。そんなときのおすすめの香りは「サイプレス」、「ローマンカモミール」です!');
}
function face3(){
sendWebhook('お疲れですね。そんなときのおすすめの香りは「レモン」、「ペパーミント」です!');
}
function face4(){
sendWebhook('あなたは頑張っていますよ。今日のおすすめの香りは「ラベンダー」、「ローズマリー」です!');
}
// 実行
main();
</script>
</body>
</html>
最後に
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Face-Aroma</title>
</head>
<body>
<h1>気分に合わせた香りをおススメ</h1>
<div id="console_log"></div>
<video id="myvideo" width="640" height="480" muted autoplay playsinline></video>
<script src="https://unpkg.com/ml5@latest/dist/ml5.min.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script>
// 作成したモデルのURL
const imageModelURL = 'https://teachablemachine.withgoogle.com/models/XXXXXXX/';
console.log = function (log) {
document.getElementById('console_log').innerHTML = log;
}
async function main() {
// カメラからの映像取得
const stream = await navigator.mediaDevices.getUserMedia({
audio: false,
video: true,
});
// IDが"myvideo"であるDOMを取得
const video = document.getElementById('myvideo');
// videoにカメラ映像をセット
video.srcObject = stream;
// 自作モデルのロード
classifier = ml5.imageClassifier(imageModelURL + 'model.json', video, () => {
// ロード完了
console.log('Model Loaded!');
});
// 分類処理を連続的に行う
function onDetect(err, results) {
if (results[0]) {
console.log(results[0].label);
if (results[0].label === '笑顔') {
// storytelling 関数実行
face1();
}
if (results[0].label === '怒り') {
face2();
}
if (results[0].label === '疲れ') {
face3();
}
if (results[0].label === '悲しみ') {
face3();
}
}
classifier.classify(onDetect);
}
classifier.classify(onDetect);
}
// 引数に送りたいメッセージを入れる
async function sendWebhook(message) {
// Integromatに送る
try {
// 取得したIntegromatのWebhookURL
const res = await axios.get(`https://hook.integromat.com/XXXXXXXXXXXXXXX?message=${message}`);
console.log(res.data);
} catch (err) {
console.error(err);
}
}
function face1(){
sendWebhook('幸せでハッピー。そんなときのおすすめの香りは「ローズ」、「ネロリ」です!');
}
function face2(){
sendWebhook('イライラしてしまう。そんなときのおすすめの香りは「サイプレス」、「ローマンカモミール」です!');
}
function face3(){
sendWebhook('お疲れですね。そんなときのおすすめの香りは「レモン」、「ペパーミント」です!');
}
function face4(){
sendWebhook('あなたは頑張っていますよ。今日のおすすめの香りは「ラベンダー」、「ローズマリー」です!');
}
// 実行
main();
</script>
</body>
</html>
今回おすすめのアロマと判定した感情は1:1対応でLINEでい送っていましたが、各感情の中にもいくつかの候補を用意しランダムで送信するような仕組みも実装したかったです。
アップデートを図っていこうと思います!
参考記事
娘に会えない日も自分の声で絵本を読み聞かせられるようにした。機械学習入門。
コード、LINE連携など参考にさせて頂きました。
Author And Source
この問題について(気分に合わせた香りをおすすめ!顔の表情から感情を読み取り、最適なアロマオイルをLINEで送るよ!), 我々は、より多くの情報をここで見つけました https://qiita.com/YujiMachida/items/b6a4e00c4ec98842aafb著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .