因為陸續會收到網友詢問「記憶中交錯的光影」這一系列App是如何製作的?由於各自回覆實在太繁複,因此整理一下我開發這個App系列的歷程。先聲明一下,有些細節不是不願意分享,而是真的蠻瑣碎的。

首先要開發iOS平台的App,我大致上研究過幾種方案。第一種是透過Adobe inDesign,第二種是透過第三方平台,由他們提供工具製作App,第三種才是我目前採用的方式,是利用Webkit的Framework來製作的。第一種方式,要學會用inDesign來排版,這應該不是最困難的,困難的是要下載轉檔工具,但上傳App之前得先傳到Adobe的伺服器去檢查,只是費用相當的驚人(困難的就是資金)。對這個方案有興趣的人,可以參考這個連結。 小麥梗資訊工作室

2011.6 本月書單

[全文:]

第二個方案理論上是最簡單的,我後來有買了Presstation的會員資格。我是沒去上課,因為課程都在台北,其實只要去上過一次課,就可以成為他們的會員,使用他們的平台。我是直接匯了三千塊,然後取得帳號密碼的。但是透過他們平台的工具,封裝好的App只能掛在他們家的App書庫裡,就是使用者得先下載他們家書城的App,才可以看到我們自己做的App。他們家的App就像Apple的書報攤App。另外他們規定,上架的App一定要定價,不可以是Free的。同時有一些嚴苛的合約條款,例如得上架多少年等,他們還會再抽成。就是Apple先跟你抽三成,Presstation還會再抽成一次。如果想要封裝成獨立的App,沒記錯一個App的報價是四萬塊,而且提供給我們之後,我們還是得自己擁有Apple的開發者帳號(以及Mac電腦跟Xcode)。總結,我花了三千塊,才發現了這些殘酷的事實。

第三個方案,就是要有一台Mac的電腦,然後購買Xcode開發程式,同時再購買Apple開發人員的會員資格,會員資格是一年NTD$3,200塊。我想說我都花了一堆錢了,所以就繼續加碼下去。簡單來說,為了開發這個測試用的App,我自己大概投入一萬五千多塊左右。這還不包含開發用的電腦,因為電腦是我自己要用的,哈哈。

這是Baker的連結,它是一個Xcode的Framework,採BSD授權,所以可以用做商業使用。而這就是我最後採取的方案。當然有興趣的人,也可以採取方案四,那是我原本規劃的最後一步,就是通通自己來。不透過Framework,自己用Xcode跟Objective-C來開發。有關Baker的使用,官網上有詳細的說明,而且有討論區一同討論功能上的改變跟目前的Bug。

light - light.xcodeproj

如果本身沒有想法來設計電子書本身的版型與框架,可以參考Laker這個網站,作者提供他自己設計的電子書樣板,免費供使用者下載使用。

App頁面框架與UI規劃

簡單彙整一下上面的資訊,要開發iOS的App需要的是:一、買一台Apple的電腦,不管桌機、筆電都可以。二、下載Xcode,目前是Free的,我當初下載時舊版Xcode 3.2是Free,但新版Xcode 4是我花錢買的。三、到Apple Developer註冊一個開發人員的帳號,它有三種開發人員資格,除Safari Dev不用錢之外,iOS Dev跟Mac Dev都要錢,我註冊的是iOS的開發會員,所以可以發佈的App只能給iOS的設備使用,如果想要開發給Mac電腦使用的App,可以多註冊一個Mac Dev的資格。iOS Dev的會費一年是NTD$3,200。

如果跟我一樣,要採用Framework來當做開發的基礎,那可能要具備一些基本的知識。首先要懂程式語言,不管你懂的是哪一種。我最熟的是Assembly,因為之前都在搞單晶片程式的開發。接著是C,但是這些都是好幾十年前的事了。現在則是對網頁開發語言有一定的熟悉度,但我平時是不負責Coding的。由於Xcode是用Objective-C,所以對我來說還算是OK。因此這是第一步,如果不懂程式語言,如果可以看的懂Xcode的基本設定,基本上勉強應該也可以弄的出來。不過因為我有去改App的程式,所以花了許多時間了解Baker的程式架構。

由於Baker提供的Framework是Webkit的模式,因此一定需要熟JS、CSS,以及HTML 5。基本上如果這個不會,那就根本不用談開發App這件事了。

light - light.xcodeproj

我製作的流程,大致上是這樣:一、產出App的網頁版,需整理好圖片、文案、版型。(使用HTML 5、CSS、JS)二、丟進Xcode裡包裝,修正Xcode的程式(Baker提供的框架本身可以不另外修正,只需進行設定即可編譯成App格式)。三、分別丟進iOS模擬器,iPhone、iPad裡去測試。在這時候,得先到iOS Dev Center去申請認證跟加密的憑證(包含App ID與加密憑證,憑證需匯入Xcode)。四、先透過iTunes Connect去開一個新的App的資料,把這些設定好,才能夠上傳App到Apple。五、將程式碼「封裝/編譯」成程式,透過Xcode先檢查,再丟到Apple檢查一次(透過iTunes Connect )。最後就是把程式上傳,等待Apple的審核。審核時間大約六天到十四天不等。

light - light.xcodeproj

我被發了好人卡兩次(程式審核被退回),所以被發卡後得改程式,然後重新來一遍。兩次退回的原因不一樣,第一次是我沒設定程式可以上下旋轉,就是當使用者改變裝置的方向時,App的內容應該要能夠跟著旋轉。Apple有規定至少要能有兩個方向的旋轉,例如上跟下。而另一次退回的原因,是我在發行Lite版時,在說明上不小心植入了「試閱」兩個字。Apple有規定,提交的App不能有Demo、測試、試用版......等描述,且App也必須是完整的功能(可以簡化或輕量化,但不能是不完整的)。

light - light.xcodeproj

如果對於我上面所寫的這些,都看不太懂,那我覺得可能去上實體的開發課程會比較有幫助,因為我通通都是靠Google、iTunes U上的史丹佛開發課程,跟買來的工具書籍,自修來開發出App的。

這是我開發過程收記錄的書籤,如果想開發的話,可以自行參考我收錄的這些書籤,雖然訊息有一點雜亂,但透過這些訊息的整理跟了解,能幫助你進入App開發的領域裡。

另外史丹佛的iPad and iPhone Application Development (HD)這個開發課程很不錯,我是先下載回iTunes,然後每晚下班後,在iTunes上自修的。

補上一些相關的工具書,我大概買了五、六本,實際上買了幾本我也忘了,是開發過程中陸陸續續買的。另外要感謝Alvin幫我處理這一系列App在設計跟版型的問題,到最後提交到Apple的這幾個版本,JS、CSS跟設計,通通是Alvin包辦的。

所以說這一系列是兩個人合力完成的App。我負責內容(圖片與文案),Xcode的Coding與封裝,以及Dev上的設定與上傳,Alvin處理Icon、電子書版型(HTML 5、CSS、JS),還有記憶中交錯的光影產品官網。如果只有我一個人做,我猜大概到2012年的年中,最多也只能產出一個吧!

我必須要說,這一整個系列的App,真的是我的心血,支撐這些的不是工作上的要求,而是我自己對於這一整件事的熱情。雖然我沒有打NBA,但我想我有林書豪的那種信念,XD~

所以想投入App開發,別忘了要保有熱情,以及遇到各種低潮與挫折時,別忘了林書豪帶給我們的精神。




2012-03-08  -  duncan Email  -  16861  -  iOS App - 回應(4)

回應管理, Pingbacks:

回應來自: 安妮 [訪問者] Email
當先生你好,感謝你不吝分享這麼詳細的説明,想請問一下,申請ios Dev的資格,用的apple id是台灣的帳號嗎?因為電子書的部份,ibooks,用台灣帳號申請的目前都仍無法上架到store裡,不曉得ios Dev的資格是不是就不會有這種情況了?
全文連結全文連結 2012-10-28 @ 16:55
回應來自: duncan [成員] Email · http://duncan.tw
我用的是台灣的帳號沒錯。我還沒測試過iBooks,所以不清楚iBooks的上架情況。
全文連結全文連結 2012-11-12 @ 16:11
回應來自: 小成 [訪問者] Email
當先生您好,有關apple iOS app開發時的問題。
如果要幫人測試app的問題~
是否要測試未上架的app 要在iphone上測試是否定需要安裝憑証,
關於安裝憑証這邊是否回將機碼之類綁定在他人電腦之類。
安全性方面是否會有問題呢?怕幫他人測app後,會讓自己手機
安全下降,煩請解惑!
全文連結全文連結 2013-12-27 @ 10:39
回應來自: duncan [成員] Email · http://duncan.tw
憑證本身有時間限制(時間過期憑證就失效了,失效前會通知是否要移除),安裝在手機上也可以隨時刪除,所以除非你認為該App有安全上的疑慮,不然一般測試是沒什麼問題的。測試完可將測試App跟憑證一併刪除,因為它的時效過後,iOS系統也會通知你移除。
全文連結全文連結 2013-12-28 @ 00:06

有一篇等待審核的回應

讀者回應:


你的Email位址將不會顯示在這個站點.

您的URL將被顯示.

允許的XHTML標記: <p, ul, ol, li, dl, dt, dd, address, blockquote, ins, del, span, bdo, br, em, strong, dfn, code, samp, kdb, var, cite, abbr, acronym, q, sub, sup, tt, i, b, big, small>
Enter this code:
authimage

(換行會被轉換為 <br /> 標記)
(將你的姓名及Email及網址記在Cookie中)
(讓使用者可以直接寫訊息給你(不會顯示你的Email).)

上一篇文章: iPhone App-記憶中交錯的光影2下一篇文章: 當式咖啡