坐姿不對，螢幕就變模糊！小姐姐教你用TensorFlow做一款“隐形背背佳”

作為一個上班族，每天坐在電腦前那麼久，難免出現腰酸背痛的情況，時間長了甚至脊柱都歪曲變形了，這可不行！一定要克制住自己的坐姿。

這裡有款“隐形背背佳”，要不要了解一下？

一位名叫Olesya Chernyavskaya的俄羅斯程式媛就用TensorFlow開發了一款坐姿監督工具，一旦你歪着身子，螢幕就會變模糊，在無形中幫你矯正坐姿~

Olesya為這個項目專門做了一個網站，小姐姐表示這個網站不會竊取網友的資料，想體驗這款坐姿監督工具的小夥伴可以猛戳：

https://fix-posture.glitch.me/

這聽起來有點意思，文摘菌也來試試！

駝背、歪頭、托腮通通逃不過系統的檢測，眼看着螢幕變模糊

打開網站，最上面這個框裡有個“開始”的按鍵，點選之後攝像頭就開始檢測你的坐姿啦，文摘菌側下身子果然螢幕就變模糊了，這種感覺似曾相識，這難道不是本菌摘下眼鏡的瞬間嗎！

吓得文摘菌趕緊坐直了，話說這款工具也不是特别靈敏，有時候會有一些延遲，即使坐直了也要等一會螢幕才能清晰，還有時候會識别不出來。

而且，隻有在這個網站上才能實作自動模糊，在浏覽其他網站或者微信私聊的時候就沒什麼變化啦。

盡管項目不太成熟，但創意依然可佳！就連TensorFlow官方也pick了這個項目。

原來這是TensorFlow舉辦的一個名為“TFCommunitySpotlight”的參賽活動，旨在為年滿18歲的程式員提供一個面向全球展示自己的平台，隻要在項目中用TensorFlow架構開發就行，官方會選舉出一些他們認為的技術與創意俱佳的作品進行展示。

在報名涵上沒有看到參賽的截止日期，這應該是一個長期的項目選秀，現在還可以報名哦，想展示自己項目的小夥伴還不快來~👇

https://services.google.com/fb/forms/tensorflowprojectrecognitionform/

說到這裡，來和文摘菌一起看看Olesya是如何實作這個項目的吧。

記錄初始體态位置，每秒檢查坐姿，一旦發現不同螢幕立刻模糊

在這個項目中，她用了TensorFlow.js PoseNet模型來檢測身體部位，并借助ml5.js建構PoseNet模型，還用了p5.js幫助處理畫布和攝像頭。

關于檢測人體體态，Olesya有兩個點子：

建一個模型，并教它了解什麼是錯誤的坐姿；

讓人一開始保持正确的坐姿，讓模型記錄眼睛和肩膀的位置正确。然後每秒鐘check一遍新的位置，并與正确的位置進行比較。

Olesya果斷選擇了第二種方法，因為這更容易也更快實作。

具體來說，當模型開始采集人的體态時，會先記錄下一個正确的坐姿，可以想象有一個垂直于雙眼和雙肩所在平行線的y軸，這樣就可以記錄正确坐姿下的資料特征。當你彎腰駝背時，模型可以檢測出你雙眼和雙肩代表的兩條平行線在y軸上的位移，由此判斷出你沒有好好坐着。

那我不駝背，我悄悄托個腮總行了吧！除非你的眼睛和肩膀都沒有歪，否則還是會被系統檢測出你的坐姿不正确。Olesya還想到了很多種不良坐姿，以她可愛的畫風展示在了圖中，比如把腳放到了桌子上，或者腳踩椅子翹起膝蓋，這些統統都能被檢測到。

說完了體态檢測的事情，該說一說如何模糊螢幕了。

話不多說，直接放出代碼，要想螢幕變模糊，就得這麼敲：

function blurScreen() {

document.body.style.filter = 'blur(10px)';
document.body.style.transition= '0.9s';           

}

要想變回清晰的螢幕，移除一下就行：

function removeBlur() {

document.body.style.filter = 'blur(0px)';           

當我們按下開始鍵，系統會記錄眼睛的位置作為預設的正确位置。

while (defaultRightEyePosition.length < 1) {

defaultRightEyePosition.push(rightEye.y);

開始檢測後，系統就會一直比較預設位置和目前位置。如果差異超過15，就意味着沒有保持良好的姿勢，而且程式會調用模糊螢幕的功能：

if (Math.abs(rightEye.y - defaultRightEyePosition[0]) > 15) {

blurScreen();

如果差異小于15，就說明坐姿保持的不錯：

if (Math.abs(rightEye.y - defaultRightEyePosition[0]) < 15) {

removeBlur();

除此之外，Olesya連她做這個網站的過程也都貼心的寫了下來，感興趣的小夥伴可以猛戳：

Github指路：

https://github.com/monolesan/fix-posture

這是一位沉浸在自己程式設計世界裡的程式媛

好奇的文摘菌想看看這位小姐姐還做過什麼項目。

看了她的推特，文摘菌覺得這是一位内心很有想法的程式媛，對程式設計有着強烈的熱愛，總是能做出一些創意小項目，完全是興趣使然。

Olesya經常會分享一些項目過程中她認為有趣的地方，比如一個可以跟随人臉移動的“大衛”：

比如當她在用TensorFlow的手勢模型做項目時，系統識别到了她拿起杯子的手，她覺得很有趣就做了個“别人喝茶和我喝茶時”對比的表情包。

沉浸在自己的程式設計世界裡，做着自己熱愛的項目，想必是很愉快的事情~ 和文摘菌一樣好奇的同學可以去她的推特感受一下：

https://twitter.com/monolesan