大數據文摘出品

來源：anishathalye

編譯：洪穎菲、秦澤宇、錢天培

１美元可以做什麼呢？買一瓶水，買半個冰激凌，或者讓你用上半小時的GPU。但這些都不夠酷！

今天，文摘菌決定，只用１美元，給MacBook裝上觸摸屏！

你沒有聽錯，只要１美元！用上1美元的硬件，和一點計算機視覺原理，一個來自MIT的小哥Anish Athalye在與幾個隊友的合作下，就將MacBook變成了觸摸屏。

此項目已經在Github上開源，趕緊來學一學！

Github鏈接：

https://github.com/bijection/sistine

基本原理

該項目背後的基本原理很簡單。從一個特定角度看屏幕，屏幕會反光，你可以通過檢查手指是否碰觸到自己的鏡像來判斷手指是否接觸到屏幕。

我的隊友Kevin在初中就發現了這種現象，並建立了ShinyTouch這一軟件。該軟件只需利用外部網絡攝像頭，就可以輕鬆構建一個觸摸輸入系統。

ShinyTouch軟件鏈接：

https://antimatter15.com/project/shinytouch/

我們想試試是否可以將這個系統進一步簡化，並使其在沒有外部網絡攝像頭的情況下工作。我們的想法是，在MacBook的內置網絡攝像頭前改裝一個小鏡子，這樣網絡攝像頭就會以銳角向下拍攝電腦屏幕。相機可以看到手指懸停或觸摸屏幕，這樣我們就可以使用計算機視覺將視頻輸入轉換為觸摸事件。

硬件

我們的硬件設置很簡單。我們所需要的只是在網絡攝像頭前面以適當的角度放置一面鏡子。這是我們的物料清單：

• 一個小鏡子
• 硬紙盤
• 門鉸鏈
• 熱熔膠

經過一番重複實驗之後，我們決定使用刀和熱膠槍在幾分鐘內完成設計。

這個是最後的成品：

手指檢測

處理視頻幀的第一步是檢測手指。以下是網絡攝像頭看到的典型示例：

手指檢測算法需要找到觸摸/懸停點以進行進一步處理。我們目前的方法是使用經典計算機視覺技術，處理方式包括以下步驟：

1. 通過膚色進行過濾，並設置相應的二進制閾值;
2. 找到手指及反射輪廓;
3. 找出兩個最大的輪廓並確保輪廓在水平方向上重疊，而較小的輪廓在較大的輪廓上方;
4. 將觸摸/懸停點標識為連接較大輪廓頂部和較小輪廓底部的線的中點;
5. 根據兩個輪廓之間的垂直距離區分觸摸和懸停。

上面顯示的是將此過程應用於網絡攝像頭的每一幀的輸出結果。手指和反射（輪廓）以綠色標出，邊界框以紅色顯示，觸摸點以紅色顯示。

映射和校準

處理輸入的最後一步是將觸摸/懸停點從網絡攝像頭座標映射到屏幕上的座標。這兩者是與單應性相關的。我們通過校準，即找到用戶觸摸屏幕上的特定點，得到單應矩陣。在我們收集了相應的網絡攝像頭座標的數據後，可以使用RANSAC準確地得到其單應性。這為我們提供了一個投影矩陣，這個矩陣可以將網絡攝像頭得到的座標映射到屏幕上的座標。

上面的動圖演示了校準過程，其中用戶必須在屏幕周圍跟隨綠點移動手指。該動圖包含一些調試過程，這些過程會覆蓋網絡攝像頭的實時視頻。網絡攝像頭座標中的觸摸點以紅色顯示。在校準過程完成之後，投影矩陣會以紅線的方式顯示出來，並且軟件切換到以估測點為藍色的模式。

應用

在當前的原型中，我們將懸停和觸摸轉換為鼠標事件，使現有應用程序可以隨時隨地啟用觸摸功能。

如果我們編寫自己的觸控式應用程序，我們可以直接使用觸摸數據，如懸停高度等信息。

結論

我們的項目是一個概念性項目，你只需1美元的硬件即可將筆記本電腦變成觸摸屏。作為一個原型，它的效果非常好！

通過一些簡單的修改，例如更高分辨率的網絡攝像頭（我們的是480p）和一個允許網絡攝像頭捕捉整個屏幕的曲面鏡，Sistine可以成為一個實用的低成本觸摸屏系統。

相關報道：

https://www.anishathalye.com/2018/04/03/macbook-touchscreen/