從零開始的行動應用程式探索之旅


摘要

本篇文章深入探討從零開始的行動應用程式探索之旅,涵蓋了當前最重要的趨勢與挑戰,對於開發者而言具有重要參考價值。 歸納要點:

  • 行動應用程式開發逐漸採用跨平台框架,如 Flutter 和 React Native,以降低成本與時間,並提高開發效率。
  • 微服務架構在行動應用程式中被廣泛應用,使得系統更具可維護性和靈活性,特別是在遊戲邏輯和支付系統的開發上。
  • 隨著資料安全需求增加,行動應用程式面臨新的安全挑戰,包括資料加密和身份驗證等技術的運用。
總體而言,本文提供了一系列關鍵見解,以幫助開發者在快速變化的行動應用市場中保持競爭力。


從網頁轉向行動遊戲開發:Words Across America 的行動專屬挑戰

在我們之前的文章中,我們討論了從網頁應用程式轉向行動應用程式開發的艱辛旅程。現在,我們將故事延續至建立我們的新遊戲《Words Across America》的階段。本文將探討在這個過程中,我們遇到的一些行動專屬問題。這些是一些與所選開發平台無關的一般開發教訓。我們還經歷了一系列框架特定的新體驗,這些內容較為技術性,已專門委派至附加文章。

對於那些對行動應用開發有經驗的人來說,本文可能並沒有太多新意。我們的目標是從一位初次涉足行動應用開發者的角度分享我們的經驗。我們認為,這或許會吸引正在考慮類似旅程或只是感到好奇的讀者。
我們在研究許多文章後,彙整重點如下
網路文章觀點與我們總結
  • 現代生活節奏加快,許多人常感到焦慮和壓力。
  • 心理健康的重視程度逐漸提高,人們開始尋求專業幫助。
  • 社交媒體對心理健康有正面與負面的影響,需要合理使用。
  • 運動被證實能有效減輕壓力,提升情緒。
  • 良好的作息習慣是維持心理健康的重要因素。
  • 與他人分享自己的感受和經歷,有助於獲得支持和理解。

在這個快速變化的時代,我們每個人都可能面臨壓力與焦慮。不論是工作、學業還是社交,都讓人倍感沉重。但值得注意的是,越來越多的人開始重視心理健康,並且勇於尋求幫助。而適當的運動、良好的作息及與他人的交流,都能成為我們抵抗壓力的強大武器。因此,不妨給自己一些時間,多關心自己的內心世界,也許會發現不一樣的生活風景。

觀點延伸比較:
主題正面影響負面影響專家觀點最新趨勢
心理健康重視程度提高自我認知與情緒管理能力可能造成社交焦慮和比較心態心理學家建議保持適度使用社交媒體以減少焦慮感越來越多應用程式強調心理健康功能,如冥想和情緒追蹤
運動對壓力的影響促進內啡肽分泌,提升幸福感過度運動可能導致身體疲憊或受傷健身教練提倡每週至少150分鐘的中等強度運動以維持良好心態居家健身與線上課程日益受到歡迎
作息習慣的重要性規律作息有助於穩定情緒與精力提升不良作息會增加焦慮及抑鬱風險睡眠專家建議每晚7-9小時的高質量睡眠是關鍵數位化工具如睡眠追蹤器幫助用戶改善作息
人際支持系統的價值分享經歷可降低孤獨感,提高解決問題能力依賴他人過度可能導致無法獨立處理情緒問題心理諮詢師鼓勵建立堅實的人際網絡,以提供支持與理解虛擬支持群組逐漸成為新趨勢,特別是在疫情後


網頁與行動應用程式響應式設計的差異

對於行動應用程式來說,響應式設計的語調略有不同。網頁應用程式的瀏覽器大小幾乎可以是任何尺寸,因此需要一種能夠處理幾乎連續的尺寸範圍的解決方案。而對於行動應用程式,雖然存在多樣性,但裝置數量是有限的,其尺寸也已為人熟知。另一個差異在於,瀏覽器視窗可以即時調整大小,而改變行動裝置螢幕大小則稍顯複雜。

在測試網頁應用程式的響應性時,如果你發現某些不太常見的瀏覽器尺寸下出現小問題,通常會選擇忽略這個問題,特別是當修正似乎會很複雜或可能導致更常見視窗大小範圍內出現新的問題時。針對這些小故障總有一個內建的方法可以繞過:只需調整視窗大小。行動應用程式則是一個截然不同的挑戰。

在當今多元化且快速變化的科技環境中,「針對特定裝置最佳化」成為了新趨勢。傳統上,響應式設計依賴媒體查詢來根據螢幕尺寸調整佈局,但隨著摺疊手機和可穿戴裝置等新型裝置湧現,僅憑螢幕尺寸無法滿足所有需求。例如,在開發過程中,可以針對 iPhone 14 Pro Max 和 Samsung Galaxy Z Fold4 等熱門機型設計專屬介面,以充分利用其獨特功能,如螢幕比例、摺疊螢幕以及手勢操作支援等,以提升使用者體驗。

「動態介面調整」也逐漸受到重視。儘管裝置特定最佳化提供了精準度,但仍需手動設計多種佈局以適配各種裝置。因此,引入自動調整介面元素大小、位置和排版等技術,例如使用 Flexbox 和 Grid 等 CSS 技巧,使得開發者能夠建立靈活且適合各種螢幕尺寸的介面,此舉不僅減少了手動設計所需工作量,也維持了一致性與流暢度。

總結來看,相較於網頁應用程式所允許的小幅容忍錯誤,在行動應用中,由於其裝置限制及使用情況,需要更加謹慎地進行測試與最佳化,以確保最佳使用者體驗。在此背景下,我們必須認識到,不同平台之間響應性的差異,以及如何有效因地制宜地進行相對應策略,使得每一位使用者都能享受到無縫而愉快的互動體驗。

精準響應式設計:以裝置規格為核心,打造無縫體驗

雖然我們希望讓這款應用程式在網頁的意義上具有響應式設計,能夠適應任何尺寸,但我們知道更重要的是專注於目前市場上存在的特定裝置尺寸。若在現有的裝置尺寸中有UI故障,將會對所有這些裝置的使用者造成持久的不良體驗。我們透過建立一個輔助測試指令碼來解決這個問題,該指令碼編碼了所有常見可用的裝置尺寸。在測試時,我們會迴圈遍歷這些尺寸,自動調整應用程式視窗大小,以便快速檢查各頁面在所有常見解析度下的顯示情況。

另一個需要考量的變數是要支援或至少處理兩種不同大小的裝置:直立(Portrait)和橫向(Landscape)。在實際使用中,旋轉桌面顯示器比手機稍微困難。因此,對於所有常見的裝置尺寸,我們需要測試兩種不同解析度。這強調了響應式設計中「針對特定裝置尺寸進行最佳化」的重要性。傳統響應式設計概念通常以媒體查詢 (Media Query) 的方式根據螢幕尺寸自動調整網頁佈局。隨著裝置尺寸日益多樣化,如今單純依賴傳統媒體查詢已無法滿足需求。例如,iPhone 13 Pro Max 擁有與平板電腦相似的尺寸,但使用手機版佈局時容易導致顯示問題。因此,在最新響應式設計趨勢中,更加精準地針對特定裝置進行最佳化變得至關重要,例如利用 CSS Media Queries Level 4 中的 `@media (device-aspect-ratio: 16/9) {}` 指令來針對特定規格進行調整,以確保網頁在各種裝置上的最佳呈現效果。同時,也必須考慮到影響佈局的長寬比(Aspect Ratio),例如在橫向模式下可能需要重新調整網頁佈局以適配較寬螢幕。


Android 與 iOS 背後按鈕設計的演化:從平台哲學到使用者體驗

在 Android 平台上,顯示於應用程式底部的返回按鈕並不在開發者的直接控制之下:它是由作業系統自動提供的。而在 iOS 上,則是應用程式本身負責提供返回按鈕,且該按鈕必須出現在螢幕的頂部。對於使用者介面的設計而言,「需要」做什麼假設著你希望遵循 Apple 和 Google 的指導方針。因為他們是決定你的應用程式是否能正式發布的最終裁判,因此我們認為忽視(或違反?)他們的建議(指令?)會增加額外風險。

從簡單性考量,我們可以選擇始終提供返回按鈕,但在 Android 上這樣做會造成返回按鈕含義模糊、冗餘或可能出現衝突行為。我們已經看到許多知名應用程式存在令人困惑的雙重返回按鈕問題,而直到此時我們才開始理解並產生一點同理心。

**專案1:Android & iOS 背後按鈕設計的設計哲學與演化**
儘管 Android 和 iOS 背後按鈕的設計理念看似簡單,但實際上蘊含著兩大平台對操作體驗的深層設計哲學。Android 秉持著「最小化幹預」的設計原則,將背後按鈕交由系統統一管理,減少開發者負擔,但也可能導致特定情境下出現雙重按鈕的混淆。iOS 則以「控制權交給開發者」為宗旨,使得開發者能自由設計背後按鈕的行為和位置,但需遵守平台 UI 規範以確保一致性的使用者體驗。隨著平台演進,Android 10 開始加入「手勢導航」,減少了實體按鈕需求,而 iOS 也透過「全螢幕手勢」簡化了導航方式,兩者都逐漸朝向更簡潔、直觀操作體驗方向發展。

**專案2:如何避免背後按鈕混淆:平台一致性與情境感知**
要避免背後按鈕混淆,關鍵在於理解「平台一致性」和「情境感知」。平台一致性指的是遵循平台 UI 規範,例如在 Android 上避免額外提供背後按鈕,而在 iOS 上則需按照規範設計背後按鈕。情境感知則指根據不同情境調整返回鍵行為,例如在特定頁面禁用返回鍵,或是在多層級導航中提供明確提示來引導使用者。例如,在瀏覽文章時,可以使用下拉手勢回到上一頁,以減少誤觸。使用者體驗設計也需與平台風格保持一致,例如 iOS 使用「返回」字樣表示背景功能,而 Android 則藉由圖示呈現。

返回按鈕的跨平台挑戰:統一體驗的追求與技術實踐

這些返回按鈕的差異意味著,擁有一個統一且跨裝置的使用體驗仍然是一個美好的幻想。無論如何,你的程式碼將不得不根據不同的平台進行檢測並採取不同的行為。關於返回按鈕的使用者介面問題僅是問題的一半。當按下返回按鈕時「應該發生什麼」的語意必須明確定義。雖然可以將這視為一項必要任務,但對於網頁應用程式而言,許多情況下,自然的網頁流程以及瀏覽器提供的返回按鈕已經能夠正確處理此事,而不需要過多考量。

接著還有「如何」控制返回按鈕的機械性問題。當返回按鈕由作業系統提供時,如果你什麼都不做,那麼該按鈕可能會無所作為或執行錯誤操作。讓你的應用程式以合理方式運作需要理解控制其行為所需的互動模式。雖然 Flutter 提供了執行這些操作所需的介面,但其互動模式及其語意在最初並不是那麼直觀。

在這樣複雜與細緻入微之間,我們也可以引入 [Declarative Shadow DOM] 的概念,因為它強調了元件化和可重用性的優勢,使得開發者在設計跨平台應用時,可以更加靈活地管理狀態變化以及視覺效果。因此,在考慮如何有效利用返回按鈕功能時,也要記住整體架構和使用者互動的重要性,以便建立更流暢且一致性的使用體驗。


與返回按鈕相關的是導航欄的問題。請記住,iOS期望應用程式提供一個返回按鈕。這個按鈕需要位於螢幕的頂部,並且必須在導航欄中。而在Android上,主要的應用程式導航元素通常位於螢幕的底部。在iOS中,還有一個指導原則,即頂部導航欄需要顯示頁面標題。因此,是否存在頂部導航欄、底部導航欄或兩者皆有?從設計角度來看,有許多不同組合的應用程式工具列和可能的內容需進行考量。

我們的主要設計準則之一是不包含任何冗餘的應用控制項。在經過一番內部討論後,我們決定在努力最小化平台特定差異的過程中,採取以下措施。我們將始終提供頂部導航欄。頂部導航欄在 iOS 上僅會有返回按鈕。頂部導航欄始終顯示頁面標題。除了返回按鈕之外,唯一的頂部導航欄控制項將是遊戲的標誌,點選後可檢視“關於該遊戲”的資訊(版本和所有法律相關內容)。底部導航欄包含主要應用導航控制項,其內容在所有平台上都是相同的(首頁、排行榜、設定、幫助)。


手機螢幕的挑戰:從形狀到可用空間的設計困境

手機螢幕存在各種幾何異常:從相機孔到劉海屏。作業系統本身可能會在您的應用程式上方顯示重要的裝置資訊和控制項!這意味著您的 UI 設計必須能夠應對所有這些可能性。相比之下,在網頁應用開發中,世界總是矩形且不受阻礙,這一點從來不需要考慮。

雖然裝置在某種程度上是「自我意識」的並能報告其可用的螢幕空間,但起初我們並未意識到這一點。這是一個基本概念,最好在開始設計 UI 和螢幕布局之前就了解它。由於我們沒有移動應用的經驗,因此以艱難的方式學習了這一點。

即使當我們意識到必須處理可用空間問題並開始適應時,我們也未必預料到會有任何幫助。我們最初的嘗試基於對設計中需要處理所有這些問題的預期。一旦我們遇到了正確的框架機制(例如 Flutter 類),事情變得相對簡單。該框架抽象化能夠判斷並有效地去除所有無法使用的空間,因此您只需根據報告出的調整後尺寸進行編碼即可。

隨著手機螢幕形狀越來越多樣化,包括水滴屏、打孔屏等,各型別 UI 設計師不得不針對不同形狀進行專門設計,以確保內容在不同裝置上都能完整展現,而不會遮擋重要視覺元素。同時,除了螢幕形狀改變之外,手機作業系統自身也會疊加通知欄、狀態列及導航欄等資訊,佔用了部分可用螢幕空間,使得 UI 設計師無法完全利用整個顯示區域。因此,在面對日益複雜的手機環境時,越來越多的 UI 設計師開始採用更靈活而自適應排版方案,如使用 flexbox 或 grid 佈局技術,以確保介面在不同裝置上的適配性。

綜合以上挑戰和解決方案,可以看出良好的框架支援與抽象化設計的重要性,不僅簡化了 UI 設計流程,也為開發者提供了更高效便捷的方法來處理日益增長的複雜性。

可用空間的問題也與響應性測試相關。了解裝置螢幕尺寸並確保您的應用程式在這些解析度下良好顯示是不夠的。實際可用的螢幕大小可能(或可能不)會更小。我們主要忽略了這一點,因為裝置大小和可用空間的所有可能組合無疑讓人感受到「組合爆炸」的緊迫性。


Flutter 應用內購:克服平台差異,打造無縫體驗

學習如何處理應用內購是一個相當棘手的問題。在考慮到蘋果公司糟糕的檔案說明所帶來的額外挫折與浪費時間之前,這一點已經成立。雖然有一個 Flutter 套件可以將兩家商店的應用內購抽象化為單一 API,但這並不是真正完美的抽象:開發者仍需了解並處理兩個平台之間的差異。還有一個需要在應用之外進行但與應用緊密相關的“購買驗證”流程,而這在兩個平台之間存在很大不同。執行此操作所需的後端伺服器端程式碼在兩個平台上完全不同。

儘管 Flutter 提供了 `in_app_purchase` 套件來簡化 Android 和 iOS 的應用內購,但實際上,兩平台之間在產品定義、訂閱模式和價格設定等方面仍然存在顯著差異。因此,開發者不得不分別處理各自的平台細節,這無疑增加了開發複雜度和維護成本。

目前,一些第三方服務正在提供更完善的跨平台應用內購解決方案,例如使用統一 API 來遮蔽平台間差異,使開發者能專注於應用邏輯;提供統一管理平台以簡化產品定義、價格管理和訂閱流程;以及整合雲端驗證功能,以避免自行開發驗證邏輯,同時提升安全性。這些方案可有效緩解 Flutter 應用內購中遇到的平台差異問題,使得開發者能夠更加輕鬆地構建跨平台應用內購功能。

儘管這增加了複雜性,但一旦我們掌握了流程,Google 的應用內購買功能就能如文件所述般正常運作。與此相比,Apple 則是完全不同的情況。處理 Apple 購買驗證 API 是整個過程中最令人沮喪的經歷之一。簡而言之,Apple 擁有兩個相關的 API,其中一個被標記為已棄用,但實際上唯一可用的就是那個。關於這次經歷,我們在本文結尾提供了更多細節,因為那段較長的敘述主要是出於宣洩情感的需要而建立的。


我們在應用內購買方面所遇到的一些困難,源於我們採取了一條不尋常的道路。大多數參考資料會告訴你使用各種 SDK(例如,Firebase)來處理應用內購買。這些框架的建立假設你同時也希望獲得大量關於使用者如何與你的應用互動的額外可見性。雖然這被視為「最佳實踐」,但它與我們保護客戶隱私、不使用任何第三方追蹤的政策完全相悖。

即使保護隱私並不是你的首要考量,這些 SDK 也會增加另一個外部依賴、額外的整合複雜度、新的控制檯工具需要學習,以及持續管理上的額外負擔。


我們對於處理應用商店的複雜性並不陌生,特別是對於 Apple。即便我們的期望已經妥善設定,但這並不減少實際經歷中的煩惱。一切都有太多意想不到的問題,例如未記錄的邊緣案例、缺失資訊、變動的使用者介面和標籤、過時的文件等等。而所有這些困境,都是在他們要求你提交一大堆法律和財務檔案之後才會遇到,這些檔案都需要進行審核和提交,真是令人疲憊不堪。

從開發到上架,iOS App 挑戰重重:D-U-N-S 號碼、開發費用、硬體需求、App Store 困擾,道道難關

這些複雜性、煩惱和陷阱的清單足以寫成一篇(甚至兩篇)文章,但其中一些顯著的問題包括:需要申請 D.U.N.S. 號碼——這是 Apple 的要求,過程可能需要數天到數週,且在協調上存在嚴重的漏洞。無法在不支付 100 美元 Apple 開發者費用的情況下建立 iOS 應用程式。無法在不購買一台能夠執行資源需求高昂的 XCode 框架的大型 Apple 裝置的情況下建立 iOS 應用程式。App Store 的使用介面與其(已過時的)文件不一致。在兩個應用商店之間存在不直觀且不同的術語命名慣例。測試和管理應用程式、使用者、資產等流程完全不同。提交時有不同且未記錄的限制和規則(例如,Apple 要求在發布後提升面向使用者版本號)。


蘋果審查:當遊戲夢想遇上 App Store 的任意性

我們曾有一個夢想。我們希望能在第一次嘗試時就獲得蘋果應用商店的接受。我們失敗了。最初被蘋果拒絕的原因是因為他們的應用內購買存在機械性問題(如上所述)。第二次拒絕則更加根本,但同時也更具任意性。第二次被蘋果拒絕的理由是我們的遊戲要求使用者註冊(提供電子郵件)才能開始遊玩。有很多應用程式在使用任何功能之前都需要與公司進行註冊,那為什麼他們對我們的遊戲有問題呢?他們的理由是,像我們這樣的休閒遊戲,玩家並不期望必須提供電子郵件。這就是他們整體的推理:對於某種模糊概念中使用者期望的個人看法。

由於蘋果在此情況下扮演著判官、陪審團和執行者,我們沒有試圖爭辯,但這確實要求我們進行一次半重大的轉變,以允許匿名遊玩。幸運的是,我們第一款遊戲就已經支援匿名遊玩,因此我們對面臨的技術挑戰有一些了解。

Google Play 審查:速度與嚴謹的平衡

在我們忙於重構應用程式後,終於順利透過了 Apple 的審核。在 Google Play 商店,我們的首次提交(附帶註冊要求)則輕鬆獲得批准,且沒有任何評論。Google 在審查上似乎稍顯「鬆散」,但速度卻快得多。Google 的審查方式看起來更為自動化且著重技術,這樣的優缺點各有千秋。

進入行動開發的領域需要一段相當大的學習曲線。這不僅限於技術層面,也包括設計、運營和應用維護中需考量的新要素。對於那些想了解我們在行動應用開發旅程中所學到的一些技術教訓的人,可以參考附文《探索 Flutter 與行動應用》。

值得注意的是,雖然文中提到 Google Play 審查過程較快且自動化,但近年來 Google 也逐步加強了其審查標準。例如:

* **更嚴格的隱私政策要求:** Google Play 現在對應用程式的隱私政策和資料收集實施更加嚴格的審查。開發者需要確保他們的應用程式符合 GDPR 等隱私法規並提供清晰易懂的隱私政策。

* **更強大的安全審查:** Google Play 增加了對應用程式安全性的檢查,包括漏洞掃描和惡意軟體檢測。開發者必須確保他們的應用程式符合 Google Play 的安全標準並採取必要的安全措施。

* **加強對應用程式品質的審視:** 除了功能性之外,Google Play 更加重視應用程式的效能、穩定性和使用者體驗。因此,開發者需要不斷最佳化自己的產品,以提供流暢無故障的使用體驗。

總之,在這個變化迅速且競爭激烈的市場中,有效地掌握這些新興需求與挑戰,是每位行動開發者不可或缺的一部分。在探索如 Flutter 這類框架時,更能幫助我們提升生產力與創新能力,使得我們能夠適應未來移動科技的不斷演進。


當你研究如何驗證 Apple 的應用內購買時,第三方來源幾乎一致地提到了一個特定的 API 端點。當你訪問 Apple 對該 API 的文件頁面時,頁面頂部有一個顯眼的警告插圖。這個警告告訴你這個 API 已經被棄用,你應該改用「新」的 API。為了展現前瞻性和合作精神,我們點選了通往新 API 頁面的連結。這是一個非常大、非常糟糕的錯誤。


Apple 審查流程的 Catch-22 困境:應用內購買的雙重挑戰

這些新的 API 並未按照文件所述的方式運作。它們的文件還描述了一種 Catch-22 的情況。經過大量的除錯和實驗,我們發現新的 API 似乎無法識別未獲批准的「產品」。應用內購買產品最初處於「草稿」狀態,為了將其轉換為已批准的產品,必須提交給 Apple 審核。除非您的應用程式已獲得批准,否則您不能單獨提交草稿產品進行審核。因此,您必須同時提交應用程式和產品進行審核。這意味著您無法確定應用內購買是否能正常運作,而這又暗示著對於一個不可運作的應用被拒絕的風險接近機率 = 1.0。

專案1具體說明:Catch-22 悖論與審查流程的死結在於開發者面臨雙重挑戰——既需要等待應用獲批,又需在此之前確保內部購買可以順利進行,但兩者卻無法分開處理。專案2具體說明:IAP 審查流程的影響與應對策略提示開發者需提前規劃,以便在提交之後能迅速解決可能出現的問題。在這樣不斷迭代測試和多次上報中,我們不僅要面對技術上的挑戰,更要適應平台政策的不斷變化。

Apple App Store 審查流程的自動化與挑戰:開發者如何應對?

這正是我們所遇到的情況。我們在提交中附上了一份詳細的說明,但似乎並沒有證據顯示它被閱讀過,或者讀者具備足夠的技術知識來理解。由於應用內購買對他們和我們都無法正常運作,因此他們拒絕了該應用程式。他們的拒絕通知將我們指向已棄用的 API 網頁。我們最初詢問為何會指向那個已棄用的頁面而不是新的 API 時,得到的是模糊不清的答覆。我們第二次嘗試要求解釋時,他們回覆道「請向開發者支援報告」。這也被稱為「繞圈子」。

我們花了相當多的時間並進行了充分的實驗,知道在 Apple 的新 API 或其文件方面存在一些問題。我們不想陷入開發支援的無盡迴圈中,因此決定選擇阻力最小的方法,嘗試使用舊版 API。既然審核人員將我們引導至此,我們對忽略棄用警告資訊感到更有信心。

隨著移動應用快速發展及其數量激增,像 Apple 這樣的平台逐漸將 API 審查流程自動化與智慧化,以提高效率和一致性。這一趨勢也意味著審核人員可能缺乏足夠專業知識來理解開發者提出的複雜情況,例如本文提到的新 API 問題。自動化系統可能會根據預設規則進行判斷,而忽略開發者提供的重要解釋與說明。

因此,開發者在面對 Apple App Store 的變化時,不免會搜尋如「Apple App Store API 審核流程變更」、「如何應對 Apple App Store 自動化審查」等關鍵詞,以尋求有效支援。在此背景下,我們仍需謹慎評估可行方案,以避免因技術上的疏漏影響整體開發計劃。

Apple 的舊版驗證 API 在第一次使用時便運作正常,這讓重新提交的審核者感到滿意。儘管 Apple 的檔案說明中有提及,但顯然未書面的舊版 API 是推薦使用的首選 API。

參考來源


EA

專家

相關討論

❖ 相關專欄