AI: 軟體選項

  • 瞭解如何將機器學習模型集成到應用中
  • 開始編寫應用程式集成代碼

以下是本課的活動：

集成模型

到現在為止，希望您的團隊已經 

  • 使用健康的資料集訓練其 AI 模型。
  • 使用新的和多樣化的數據測試了模型

但你不能把它留在那裡！ 

你希望你的模型 根據它所做的預測採取行動。

您需要在 應用程式中實現您的模型 以使其有用。

brain hovering over a computer chip

選擇平臺

使用哪個平台對應用進行編碼將取決於：

  1. 您的移動應用編碼平臺偏好是什麼
  2. 您用於訓練模型的平臺

以下是第5單元中討論的機器學習平臺。按兩下每個選項以檢視用於將模型整合到應用程式中的一些選項。 

Teachable Machine是一個非常通用的平臺。您可以將模型保存到雲端或另存為檔，因此您有許多與編碼平臺集成的選項。

此 視頻 介紹如何導出模型。

  • App Inventor 具備由 Fabiano Oliveira 貢獻的 Teachable Machine 圖像分類擴充功能，可於擴充功能抽屜中下載並匯入。
  • Teachable Machine 提供代碼片段以與機器學習庫 Tensorflow 集成。它提供 3 個代碼片段選項：
    • Tensorflow.js – Javascript 語言將允許您創建網頁或 Web 應用程式。
    • Tensorflow – 用於創建 Web 應用程式的 Python 語言。
    • Tensorflow Lite – 用於創建行動應用程式的 Java 語言。 

所有 3 個代碼片段都為您提供了要複製的模型檔和代碼。根據語言的不同，您可能需要安裝庫和代碼編輯器。代碼片段提供了指向說明的連結。 

以下是使用 Tensorflow.js 選項的步驟：

    1. 複製代碼並將其粘貼到電腦上的新空白文本檔中。
      teachable machine code snippet
    2. 將其另存為index.html（或其他帶有 .html擴展名的內容）。 
    3. 在網頁瀏覽器中開啟檔案。系統將提供基本介面，讓您能根據模型對網路攝影機擷取的影像進行分類。
    4. 若您希望上傳圖片進行分類（而非使用網路攝影機），此程式碼可實現此功能。（由 Chris Hoyean Song 提供）請務必將原始程式碼片段中的模型網址複製至此檔案中。 

Tensorflow 和 Tensorflow Lite 選項需要安裝不同的軟體和編碼庫。請查看 github 網站以獲取進一步說明。

Technovation 集成： Python、App Inventor

目前，唯一完全適用於初級和高級部門的兒童機器學習集成是 Python。 

若要詳細瞭解如何將 Machine Learning for Kids 模型集成到 Python，請嘗試此 頁面上的其中一個工作表。從“生成類型”下拉列表中選擇“Python”。 

MIT App Inventor 是一個集成選項，但並非所有數據集類型都能完全正常工作。查看 Machine Learning for Kids 網站 ，確保您的數據集與 App Inventor 相容。 

App Inventor 中的擴展是向 App 添加功能的外部元件，但不是核心 App Inventor 元件的一部分。

當您使用 App Inventor 的分類器網站（圖像、聲音）訓練完圖像或聲音模型後，便可透過 App Inventor 的擴充功能，將模型應用於行動應用程式中。 

您可以按照以下步驟瞭解如何使用 App Inventor 的 AI 擴充套件。

所有 App Inventor 擴充套件均可在此下載，並匯入 App Inventor 使用。為您的模型選擇適當的擴充套件。

  1. 按兩下 Designer Palette 中的 Extension 。
  2. 按兩下導入擴展
  3. 按兩下 選擇檔案， 然後選擇從上述擴展頁面下載的擴展檔。
  4. 按兩下 「匯入 」按鈕以導入擴展及其塊。
import window

您還需要將 WebViewer 元件添加到您的專案中。可以在使用者介面抽屜中找到它。

在下面的範例中，我們將展示如何設定圖像分類器，但若您的模型涉及聲音，其操作方式與音訊分類器幾乎相同。

要從分類器連結模型，請先從分類器網站下載模型，然後， 

  1. 選擇 個人圖像分類器 元件。
  2. 在「屬性」面板中，按兩下模型「下的」無“，然後上傳下載的model.mdl檔。（該檔可以重命名任何名稱，但其名稱中必須包含 .mdl 擴展名）。
  3. 按一下 WebViewer並選擇 WebViewer元件。
screenshot of webviewer in app inventor

請注意「InputMode」屬性，其值可設定為「Video」或「Image」。若選擇「Video」，系統將持續嘗試分類顯示於 WebViewer 中的視訊串流；若選擇「Image」，則需新增相機或 ImagePicker 元件以獲取待分類的影像。無論選擇何種模式，皆需搭配 WebViewer 元件方能執行影像分類功能。

inputmode for webviewer

在以下影片中，觀看如何將單元 5 中的健康與病害水果模型加入 App Inventor，以建立可使用手機相機辨識健康與病害水果的行動應用程式。

在第2部分中，您將對分類器的塊進行編碼。

所有 App Inventor 擴充套件均可在 這裡下載，並匯入 App Inventor 使用。為您的模型選擇適當的擴充套件。

  1. 按兩下 Designer Palette 中的 Extension 。
  2. 按兩下導入擴展
  3. 按兩下 選擇檔案， 然後選擇從上述擴展頁面下載的擴展檔。
  4. 按兩下 「匯入 」按鈕以導入擴展及其塊。

您還需要將 WebViewer 元件添加到您的專案中。可以在使用者介面抽屜中找到它。

在下面的範例中，我們將展示如何設定圖像分類器，但若您的模型涉及聲音，其操作方式與音訊分類器幾乎相同。

要從分類器連結模型，請先從分類器網站下載模型，然後， 

  1. 選取個人影像分類器元件。
  2. 在「屬性」面板中，按兩下模型「下的」無“，然後上傳下載的model.mdl檔。（該檔可以重命名任何名稱，但其名稱中必須包含 .mdl 擴展名）。
  3. 按下WebViewer下的“None”，然後選擇剛剛添加到專案中的WebViewer元件。

screenshot of webviewer in app inventor

請注意「InputMode」屬性，其值可設定為「Video」或「Image」。若選擇「Video」，系統將持續嘗試分類顯示於 WebViewer 中的視訊串流；若選擇「Image」，則需新增相機或 ImagePicker 元件以獲取待分類的影像。無論選擇何種模式，皆需搭配 WebViewer 元件方能執行影像分類功能。

inputmode for webviewer

在以下視頻中，觀看如何將第 5 周的健康和患病水果模型添加到 App Inventor 中，以創建一個可以使用手機攝像頭識別健康水果與患病水果的行動應用程式。

在第2部分中，您將對分類器的塊進行編碼。

使用 Ximilar 製作的模型可以使用 API 將其整合到應用程式中。 您可以使用 Thunkable 的 Web API 元件，將 Ximilar 等平台的外部模型整合到應用程式中。注意：在下一單元中，我們將介紹Thunkable 中的 API。 觀看 Pratham 影片的第二部分，將第五單元的珊瑚 AI 模型整合到 Thunkable 手機應用程式中。

活動：集成 AI 模型

預計時間：60+ 分鐘

根據您選擇的平台進行集成

  1. 查看您的特定平臺需要什麼才能將經過訓練的 AI 模型添加到專案中。
  2. 在您選擇的平台中創建一個新專案並添加您的模型。你如何做到這一點將取決於你的特定平臺的流程。
  3. 下手！將元件和代碼添加到平臺，以便您的專案根據模型的預測採取行動。

反射

您已經開始編寫 AI 應用程式的動作部分！在這裡，您可以查看模型的結果以及它真正可以做什麼！

現在是檢查您的項目計劃/畫布以查看您的專案進展情況的好時機。您可能需要根據您正在使用的平臺以及實現項目目標所需的步驟來調整時程表和任務。

一旦你讓你的代碼工作，也是時候重新與你的用戶簽到了。找一些人來測試你的應用並提供反饋。

checklist

關鍵術語的審查

  • 軟體 – 在電腦或設備上運行的程式或應用程式的術語
  • 擴展 – 向現有程式添加功能的套件

其他資源

棉花糖分揀機使用Teachable Machine和Coral。

觀看這些視頻，瞭解更高級的 AI 工具！

上一課
回到課程
下一課