創作分享: 預約王 - 我的第一個 Windows Store App


這是本人第一次創作 Windows App 放上 Windows Store (程式市集) 發售,當中經歷不少難關,並獲得寶貴經驗,以下就與各位分享…

[19/6 更新消息]: 「預約王」推出兩星期,受到多個外國網站報導及介紹,包括 [Wind8Apps.com] [WindowsITPro]、[BetaNews],同時在 Windows Store 首頁顯示,更排列商務App的第一位

1 選定目標
首先思考日常生活中,有甚麼可以「自動化」,例如很有名的 Evernote,就是用手機記事而代替紙筆。
當諗到後便去 Windows Store 搜尋有無同類程式,雖然 Windows Store 推出只有兩年,但已經有超過 400,000 個 Apps (資料來源),所以要尋找一個功能獨有的 App 不易。如未有同類 Apps 就最好,有的話,就要了解它們的功能,取別人所長及彌補別人不足,如果對自已有信心的話,就可以全力進發,就算做不到取而代之,也起碼要分一杯羹。而且不同定價,有不同功能。當有清晰定位後,便開始創作…

2 建立使用者介面
a) 先把心目中所有功能,用文字逐點記錄,然後歸納到不同層級,例如:
主畫面應有:
  • 介紹圖片
  • 主菜單
  • 統計、分析圖表
b) 製作意念樣模,以下是用 Balsamiq Mockup 製作「預約王」的介面:
主畫面
畫面1
畫面2
附註:
  • 篇幅所限,省略其它畫面
  • 以下是「預約王」的成品:
最終主畫面樣子

3 建立系統架構
對於App來說(相對網站),系統架構比較簡單,只需選定:
  1. 程式語言:必定是近期電腦語言王者 Javascript/HTML5/CSS3
  2. 軟件配件:要做 Windows App,必定是 WinJS
  3. 開發環境:毫無疑問,一定是用全世界最先進的開發環境 Visual Studio 2013 Express for Windows
  4. 數據庫 (Database):由於 WinJS 本身是在 HTML5 之上,所以「預約王」內的數據庫是 IndexedDB

4 開始編程
這是第一次正式創作 Windows Store App,必須要先補補課,多謝 Microsoft Virtual Academy,裡面已經包含所有 Windows Store App 開發課程教授,花了兩星期,便能掌握基礎技術,我便急不及待開始。編程過程重點是有(篇幅所限,本文不會完整記述):
  • 僅記 WinJS 與傳統網站結構有少許分別,WinJS 是 Single Page Web,畫面之間轉換時,新畫面的 CSS 的 style codes 不可以與 default.css 重疊,否則會影響主頁。
  • 為使 App 成達到最佳速度及與 Windows App 視覺一致性,控制元件 (control component) 應盡量用 WinJS 提供 controls,包括 Hub、ListView、SearchBox、BackButton、NavBar、Charms、Flyout、Binding Template 等,而且用法很直接簡單。
  • 其它元件盡量用開源套件(Open Source Packages),「預約王」就用了:jQuery、jQuery UI、jQuery IndexedDB plugin、prototype.js、underscore.js、moment.js、numeral.js。(如無以上套件,「預約王」起碼多花半年)
  • 到開始編寫每個畫面,實際是 HTML 網頁,對於編寫慣網站而言,很快便完成。

5 測試程式
編寫完成後,便可測試。Visual Studio 2013 不愧為全世界最先進的軟件開發環境,測試 App 時可以選擇在本身的電腦,或本機的 Windows Tablet 模擬器,令我驚喜的是更可以透過 Wifi 網絡,傳送到其它的 Surface RT 進行「預約王」測試,所有執行變數直接傳送到 Visual Studio,令我可以完全掌握到「預約王」在實際電腦上的運行情況,把誤差減到最低。

6 登記 Windows Store Developer
當詳細測試後,便準備遞交到 Microsoft 取得認證,整個過程都是在 Visual Studio 進行,見下圖:
在 Visual Studio 的 STORE 菜單,續一進入並完成它便可
一步一步完成以下驟:
  • 登記成為 Windows Store Developer,Microsoft 提供有兩種開發者:個人或公司,我今次是用個人名義推出「預約王」,所以就登記成為個人開發者,年費只需HK$147,非常便宜
  • 開啟收賬戶口,只需提供香港銀行戶口及填報美國稅務局 W-8BEN 表格
  • 申報 App 特性 (Edit App Manifest),例如製作不同大小的 Icons 影像
  • 取得開發者執照,所有 Windows Store App 開發者必須有執照
  • 注冊「預約王」為 Windows Store App
  • 執行在「本機核實」,這是程式認證的第一次核實,是在本機執行,這是審查程式是否與申報的相同,及執行速度是否達標等…
  • 製作程式檔,Visual Studio 會把核實成功程式包裝成 upload package
  • 把 upload package 上戴到 Windows Store
  • 等待 Microsoft 的測試人員測試及審批,達標的話便批准上架
  • 會有電郵通知程式而經面世
「預約王」驗證過程中有二十多次在「本機核對」中失敗,修正上載後又遭到微軟測試人員拒絕 1 次,到最後成功面世,需時大約 3 天,現在「預約王」在 Windows Store 出現:
網址:
http://apps.microsoft.com/windows/app/booking-manager-place-or/d5e5dfab-77c1-43fb-bcc6-5a9698cdc9b7

整個審批過程感覺是:既嚴謹地保障廣大 Windows 使用者,但又很方便開發者。

7 宣傳推廣活動
程式開售後,便要計劃推廣,Windows Store 提供兩種十分強大的宣傳功能:
  1. 試用版功能:相比其它市集(App Store、Google Play),這是 Windows Store 獨有的,「預約王」現時提供 30 日試用期,當 30 日試用期後,Windows 會告訴用者試用期屆滿,用者可以購買繼續使用或解除安裝。從程式碼角度,Windows 提供完善 API,讓我的程式知道試用情況,程式碼只需 10 句,便可做到試用版功能,相當簡單。
  2. 在 Windows Store 開發者網站內,可以為「預約王」設定推廣期,可以在指定日期內有指定特價,事實上我已把「預約王」在 2014-05-28 至 2014-06-11 免費贈(原價HK$78),各位請快手下載
  3. Windows Store 容許我設定搜尋字元,正時在市集中的搜尋輸入如:預約、場所、設施、booking、rental、appoint等字元,「預約王」都會在結果中出現,這是十分有幫助的。

總結
整個程式開發時間大約兩個月,假設兩年內全球售出300套(因為是中、英文版),每套HK$78,總銷售額為$23,400,扣除 Windows Store 佣金 30% 及美國利得稅 15%,我實得大約 $12,870(新台幣$50,072),銀碼不多,但這是一個App,如有更多 Apps 出售,作為額外收入也不錯。除了金錢以外,最重要能夠證明自已的創作,達到世界水準,也達成多年心願。

請各位盡量介紹「預約王」給有需要的朋友,和多給予意見!

-------------------
各位如果對本網誌有興趣的話,請在畫面右邊成為追蹤者,日後有新網誌時 Blogger.com 會自動通知,多謝支持(聲明:電郵由系統發出,電郵地址不會給予及不經作者)

留言