AI 應用案例AIAndroid實用工具小工具小米教學

Vibe Coding 實作測試:不用寫程式,開發功能型 Android 應用「四角熱點」|AI 應用案例

Vibe Coding 實作測試:不用寫程式,開發功能型 Android 應用「四角熱點」|AI 應用案例 四角熱點 AI 應用案例, AI, Android, 實用工具, 小工具, 小米, 教學

這陣子有一個詞彙經常被人提起:Vibe Coding,簡單講就是一種「即時互動式」的開發方式。開發者甚至可能不用寫一行代碼,只需要用自然語言不斷地與 AI 大模型溝通,就能成功生成、修改甚至發佈一款應用程式,衝擊開發者圈。

真的不用寫一行代碼嗎?身為一個並沒有開發經驗、也不會寫程式的骨灰級電腦玩家,我使用 Gemini 2.5 Pro 做實驗,還真的成功做出了一款 Android 功能型應用:四角熱點。

Vibe Coding 實作測試:不用寫程式,開發功能型 Android 應用「四角熱點」|AI 應用案例 四角熱點 AI 應用案例, AI, Android, 實用工具, 小工具, 小米, 教學

四角熱點:將 macOS 的「Hot Corners」功能帶進 Android 平板電腦使用

我先大概說明一下,為什麼我會做這款應用。身為一個手機、平板、電腦三棲的玩家,我經常會將藍牙滑鼠連上平板電腦(Xiaomi Pad 7 Pro),搭配磁吸懸浮鍵盤,把平板搞得很像電腦一般的使用。

然而,有一個痛點始終圍繞著我:當我開啟全面屏手勢,想要連去「最近應用」或是「回首頁」的時候,都必須將滑鼠移動到畫面底端,然後按著左鍵向上提拉,才能實現想要的系統互動,這其實非常不直覺,體驗不佳。

而我在使用 macOS 的時候,若想要快速切換應用、或是一覽現在開啟的所有程式,都會搭配「熱點」(Hot Corners)來使用。將滑鼠移動到某個設定好的點位,不必點擊,就能立刻呼叫出「現在正在運行的所有視窗」等功能,相當直覺且快速。

Vibe Coding 實作測試:不用寫程式,開發功能型 Android 應用「四角熱點」|AI 應用案例 四角熱點 AI 應用案例, AI, Android, 實用工具, 小工具, 小米, 教學

然而,Android 陣營的設備,我找不到任何類似的應用程式。如果使用 Android 平板 + 滑鼠時,可以直接將滑鼠移動到某個角落,就能開啟「最近應用」或是「回首頁」,整個交互邏輯、流暢性想必都能再上一個台階吧!

所以,我透過 Vibe Coding,與 AI 不斷的溝通,最終開發了這款 Android Hot Corner 應用。有興趣嘗試的人,可以自己下載下面的 apk 檔案。目前我設定左上角是「最近應用」,左下角是「回到首頁」,為了開發方便起見,無法修改。

下載點:Google Drive

備註:在使用時,你必須開啟 Android Hot Corner 應用程式的「懸浮窗」和「無障礙服務」這兩個敏感權限,如果你不會開啟,可以直接詢問 AI 怎麼做到。這兩個權限是必要的,若不開啟,就無法使用四角熱點。本應用無任何連線功能,也不搜集用戶資訊,一切都在本地端完成,不用擔心隱私外洩等資安問題。
Vibe Coding 實作測試:不用寫程式,開發功能型 Android 應用「四角熱點」|AI 應用案例 四角熱點 AI 應用案例, AI, Android, 實用工具, 小工具, 小米, 教學

Vibe Coding 有什麼技巧

如果你也跟我一樣,沒有任何的軟體開發經驗,想要透過與 AI 互動來完成開發,那麼我可以提供幾個小技巧給你:

先問清楚,從零到一會需要哪些工作,哪些 AI 可以代勞、哪些不行

首先是你必須有個 Whole Picture,知道接下來會發生什麼事情、會需要經過哪些動作,除了讓 AI 幫你寫程式外,你自己又無可避免的需要做哪些工作,都先查清楚,會對接下來的開發很有幫助。

例如,我就在自己電腦安裝了 Android Studio 軟體,這是開發 APK 時不可或缺的,也是 AI 無法代替你完成的。

Vibe Coding 實作測試:不用寫程式,開發功能型 Android 應用「四角熱點」|AI 應用案例 四角熱點 AI 應用案例, AI, Android, 實用工具, 小工具, 小米, 教學

說清楚你的需求,說清楚你的能力極限,請 AI「一步一步帶領你實現」

為了避免開發到一半,你看不懂 AI 在跟你說什麼,你必須很誠實的告訴 AI 你的能力極限在哪裡。什麼都不會也沒關係,說清楚你現在能做到的程度,AI 會針對你的能力來將工作拆解,手把手的帶你完成軟體開發。

記得,在與 AI 溝通時,一開始就要請它「一個一個步驟教你如何實現」,AI 會化身一個很有耐心的老師,不厭其煩的帶著你從零到一開發出全新的應用。

卡住了?截圖詢問

如果在開發的過程中,你不幸卡住了,可能是 AI 教你的做法行不通、AI 介紹的畫面跟你看到的介面不一樣,總之高機率會遇到。由於現在的主流大模型大部分都擁有多模態理解的能力,你將不懂的地方截圖上傳詢問,AI 多半能看著你的截圖,幫你解決難題。

Vibe Coding 實作測試:不用寫程式,開發功能型 Android 應用「四角熱點」|AI 應用案例 四角熱點 AI 應用案例, AI, Android, 實用工具, 小工具, 小米, 教學

最後,你需要很有耐心

雖然 AI 可以幫你完成大部分的代碼撰寫,但是你要從零到一的生出一款應用,還是會經歷非常多的工作準備,以及不斷地溝通迭代,修修補補。

這時候,耐心就非常重要了;若你做到一半就關掉,那就前功盡棄了。打破砂鍋問到底,是 Vibe Coding 的小訣竅。

Vibe Coding 實作測試:不用寫程式,開發功能型 Android 應用「四角熱點」|AI 應用案例 四角熱點 AI 應用案例, AI, Android, 實用工具, 小工具, 小米, 教學

如果你有時間、願意嘗試,一定要試試看 Vibe Coding 喔!成就感滿滿。最後,我也曾經用 AI 做過別的應用,放在底下供您參考:

我用 AI 製作了一款 macOS 專用「選單列空氣品質監測」工具|AI 應用案例

Written by
黃郁棋

《科技人》站長,在科技業打滾十年的老屁股,每天都覺得自己要被新技術取代了,完了完了。

公開留言

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

打賞科技人|祝您有個美好的一天