作為設(shè)計師，我們是應(yīng)該努力把客戶端的體驗提升到最優(yōu)，還是在網(wǎng)頁應(yīng)用層面上做更多的設(shè)計？app開發(fā)一直是大家關(guān)心的話題。那么，我們首先應(yīng)該立體的認(rèn)識一下WebApp和NativeApp。

下面先是根據(jù)RAHulVARSHNEYA的文章翻譯寫出的原生app的制作教程。你可以選取教程中與你戰(zhàn)略最契合的內(nèi)容，也可以完全遵循它。但最重要的是你必須開始工作起來。

第一步：找到一個想法或問題。

如果你已經(jīng)有了一個App大致想法，請直接前往第二步。如果沒有的話，請繼續(xù)閱讀。想要做一款A(yù)pp卻毫無頭緒？這時候你真正需要的是問題，而且這些問題實際上隨處可見。

成功的創(chuàng)業(yè)者們會用我們從未想象過的方式去解決問題。當(dāng)你環(huán)顧四周，每一件你在使用的產(chǎn)品與服務(wù)都是為了解決問題而創(chuàng)造出來的，你有輛轎車是因為你想要從一個地方快速去到另一個地方，你有架飛機是因為你想要用更快的速度從一個國家去到另一個國家。

所以，多觀察你日常生活中的問題并將他們一一記錄出來。一但你有了一個詳盡的清單，就可以開始去思考你該如何解決問題，并把最可能實現(xiàn)的那些問題作為備選名單。

第二步：確定需求。

確認(rèn)過程會證明你的App是否存在需求。你可以使用GoogleKeywordPlannerTool(谷歌關(guān)鍵詞工具)或者百度關(guān)鍵詞規(guī)劃師去查找有多少人在搜索你想要嘗試去做的事情，這可以驗證你的想法。你也可以建立一個著陸頁去大范圍地宣傳你的App想法，并通過郵件注冊來找尋用戶興趣。

第三步：展示流程與功能。

確認(rèn)好了你的App想法意味著你已經(jīng)了解到人們想要使用的某樣?xùn)|西?，F(xiàn)在是時候用一份文檔詳細(xì)地記下你的產(chǎn)品特點，或者如果你打算做得更多更具體，可以使用線框圖工具。

當(dāng)你把想法寫在紙上時，記得要盡可能詳細(xì)。包括用戶會如何瀏覽App以及可以預(yù)見的所有功能。這樣做能幫助你的開發(fā)者清楚地理解你的期望。

第四步：砍掉非核心的功能。

在準(zhǔn)備好的流程圖與功能文檔里，你要開始去思考有哪些功能你是可以摒棄的，只保留App的核心價值。不要在第一個版本里創(chuàng)建一些“如果有還不錯”的功能，因為他們能夠在之后隨時作為更新被添加上去。這樣做會幫助你減少初期的開發(fā)支出并使你更快地進(jìn)入市場。

第五步：把設(shè)計放在第一位。

我聽過不少的創(chuàng)業(yè)者說他們只想要一個非?；A(chǔ)的設(shè)計，以便把精力都放在技術(shù)開發(fā)上面。他們錯了！設(shè)計不僅關(guān)乎于你的App外觀，更會影響用戶會如何使用你的產(chǎn)品。Khosla風(fēng)投公司的創(chuàng)始人VinodKhosla將設(shè)計一詞闡釋得好，他說：“設(shè)計，讓科技更有效?！彼裕フ乙晃荒馨言O(shè)計（用戶體驗和圖形設(shè)計）放在首位的開發(fā)者吧。

第六步：聘請設(shè)計師/開發(fā)者。

尋找一個擁有極佳設(shè)計才能和靠譜開發(fā)團隊的開發(fā)公司。在聘請開發(fā)者的時候，上網(wǎng)去查一下他的信譽以及他開發(fā)過的App。如果你在他的作品集里，能夠找到一個真正喜歡的作品的話，那么他就很有可能是你的好人選。

第七步：建立開發(fā)者賬戶。

你必須要注冊一個開發(fā)者賬戶，這樣就能在不同的App商店上分發(fā)銷售你的app。谷歌的Android系統(tǒng)收費每年25美元、Apple每年收取99美元。你可以選擇以個人身份或者已有的公司注冊。

(注：其實在第七步和第八步之間，還有很重要的一步：開發(fā)-測試-上線。在App發(fā)布之前，一定要做好測試，以一個新手用戶的身份來使用自己的產(chǎn)品，讓那些上線后將會出現(xiàn)在真正用戶面前的隱患提前暴露出來，可以有效減少將來用戶的抱怨。國內(nèi)的應(yīng)用測試托管工具有：云測Testin、FIR.im、BugHD)

第八步：集成分析。

分析方法能夠幫助你的App追蹤其下載量，用戶參與情況，以及用戶留存情況。確保你使用例如Flurry這類免費易得的工具，或者是Localytics,它同時提供免費與收費的版本。

第九步：快速及時地獲取反饋。

一旦你的App在應(yīng)用商店上線，第一批的用戶使用情況以及他們的行為，會讓你了解到應(yīng)該如何去改進(jìn)和提升你的App。改進(jìn)是長期且無止境的，所以，一定要持續(xù)關(guān)注用戶反饋并不斷進(jìn)行改進(jìn)。

第十步：引入新功能。

你已經(jīng)創(chuàng)建了只有核心功能的第一版App。(譯者注：還記得上文提到的第四步吧)現(xiàn)在是時候評估和引入在初期設(shè)計時未加入的功能特點。你將從分析結(jié)果和用戶反饋中知道當(dāng)初的那些功能是否還有必要加入。

當(dāng)然，這些步驟并不是完全不可修改的，它們只是一份基于經(jīng)驗總結(jié)的教程，可以指導(dǎo)你如何最高效地創(chuàng)建自己第一個App。當(dāng)你準(zhǔn)備好開始工作了，你也一定會意識到：做一個App是最簡單的部分，能在App上線后吸引到源源不斷的用戶才是最具有挑戰(zhàn)之處。

NativeApp的優(yōu)勢：

1.提供好的用戶體驗，最優(yōu)質(zhì)的用戶界面，最華麗的交互

2.針對不同平臺提供不同體驗

3.可節(jié)省帶寬成本

4.可訪問本地資源

5.盈利模式明朗

NativeApp的劣勢：

1.移植到不同平臺上比較麻煩

2.維持多個版本的成本比較高

3.需要通過store或market的確認(rèn)

4.盈利需要與第三方分成

下面則是我在做WebApp的一些心得，希望對做WebApp的朋友有點啟發(fā)，推薦使用咫尺即速應(yīng)用工具。

1、分析目標(biāo)人群，確定WebApp的定位：

首先我們應(yīng)該以解決客戶需求為出發(fā)點，再根據(jù)需求分析總結(jié)出用戶需要的應(yīng)用內(nèi)容，確定功能清單，之后就可以著手準(zhǔn)備制作了。比方做我想做一個微商城的WebApp，我希望用戶不需要通過其他軟件就可以在我的微商城購買物品，而且我只需要我的WebApp簡單易用，用戶不會因為功能過于繁多而無從下手。

【重點：定位好目標(biāo)人群】

2.開始WebApp的開發(fā)制作

【重點：熟悉布局功能組件，拉動組件到對應(yīng)的面板，設(shè)置好顏色，跳轉(zhuǎn)頁面及連接】

即速應(yīng)用在很大程度上參考了原生App的功能，所以提供了非常豐富的功能組件，比如導(dǎo)航組件，輪播圖組件，分類組件，視頻組件，音頻組件，按鈕組件，自定義組件，選項投票等等組件。確實可以不需要編寫代碼，只需把想要的組件拖動到對應(yīng)的面板里，完成頁面布局、顏色、字體設(shè)定，鏈接跳轉(zhuǎn)等，即可一鍵生成WebApp。當(dāng)然這也是我們只做WebApp過程中，最花時間的步驟，我們需要不斷的創(chuàng)建版塊和頁面布局，我們也需要時刻記得每塊模板都應(yīng)跳轉(zhuǎn)到對應(yīng)的頁面。

我是選擇空白模板，自己建模板。自己沒UI的，如果你們想省時間，我覺得可以套用模板，可以比較快的生成自己想要的WebApp，畢竟能快就快，能省就省才是王道嘛。

來看看我大致的首頁布局吧！

首頁布局

看不懂組件名稱，不懂組件怎么用？看看《幫助》咯！《幫助》都已經(jīng)把大致的布局進(jìn)行了粗略的介紹。至少不會讓自己對功能模模糊糊。如果對某個組件還是不清楚，那么可以點擊那個組件的右上角的小問號圖標(biāo)，會有一個詳細(xì)的介紹。

看完組件說明就直接創(chuàng)建一個空白模板開始制作WebApp

制作第一步：我先插入一個頂部導(dǎo)航組件，作為首頁，頂部導(dǎo)航的標(biāo)題我建議都是大家的公司或者商城名稱。

制作第二步：然后我創(chuàng)建了一個輪播圖組件做Banner，因為我做的是微商城，我仿照了TB，用輪播的方式播放一些我修好的商品圖片。然后在右邊的組件內(nèi)容中對每個輪播圖片逐一添加相對應(yīng)頁面鏈接去向。

制作第三步：接著我創(chuàng)建了一個圖片列表，并在頁面屬性中把行列設(shè)置成了4列1行，我再修改圖片高度直接設(shè)置為圓形，系統(tǒng)就自動調(diào)整圖片高低了。接著我更換了圖片，替換成按鈕圖片，并在點擊事件中的頁面鏈接至相對應(yīng)的頁面。如下圖

制作第四步：因為我想在這一行左右分開，并且是做成左邊是大圖，右邊是上下分開的小圖加標(biāo)題。

所以我先插入一個雙欄組件，再在右邊的欄里再插入一個雙欄，這樣就實現(xiàn)了欄目的劃分。接著在最左邊的雙欄位置插入一個大圖，并且對它的寬度和高度調(diào)節(jié)。然后對最右邊的雙欄也插入一個圖片組件，并且右鍵復(fù)制一個圖片組件到下面（小技巧），如下圖，接著拖入文本插件，這里需要注意，拖入第三文本框后，需要先對它的上間距進(jìn)行調(diào)整，再拖入第四個文本框，這樣才可以做到上下圖片對應(yīng)文字的標(biāo)題與內(nèi)容。（小技巧）

制作第五步：插入底部導(dǎo)航組件，任何的App都有底部導(dǎo)航，所以我這里需要提醒，每個頁面的編輯完后，都需要插入一個底部導(dǎo)航。我自己一般是先編輯一個純底部導(dǎo)航的頁面，然后編輯其他頁面的時候，我先復(fù)制這個純底部導(dǎo)航的頁面再編輯，這樣能省下我不少時間。（小技巧）

基本上的頁面編輯和布局大致是這樣的，編輯過一次之后就會你發(fā)現(xiàn)這個WebApp的制作并不難。

接下來我想講的是高級組件中的商品列表組件。這功能滿方便的，這個組件添加到你商品頁面之后，你在前端的App制作只需要編輯一下這個版塊的分布和排版就好。因為所有的商品數(shù)據(jù)和圖片都是在后臺中上架和調(diào)整價錢的，這也是方便后臺的數(shù)據(jù)管理吧。不過我想吐糟一下，后臺的數(shù)據(jù)整理和圖片上傳后，前端制作也看不到圖片，需要自己預(yù)覽App才能看見。

進(jìn)入后臺管理，我們就看到商品管理這個選項。我們先添加分類，保證自己上架的物品不會混亂難以管理。分類好后再在每個對應(yīng)的分類中添加商品和填寫商品的信息即可。如下圖

在商品管理后臺上傳了所有的商品數(shù)據(jù)后，現(xiàn)在只需要回到前端制作App的頁面，在商品頁面給每個商品填上對應(yīng)后臺的鏈接就可以了。非常方便快捷。

既然商品都上架，并且讓自己的商品在售了，那就需要學(xué)會管理后臺的訂單和查看訂單，即速應(yīng)用這個也是仿照了TB做出了這樣一個后臺管理，著實讓我這個小白也會用這個來管理訂單，下面po一個我朋友的訂單管理頁面。

好啦，我大概的制作過程和心得也差不多是這樣啦！雖然即速應(yīng)用有著蠻多的高級功能組件，其中商品列表組件（電商支付功能），BBS組件（社交娛樂功能），自定義表單組件（數(shù)據(jù)統(tǒng)計功能），個人中心組件等等是每位WebApp作者都愿意去制作和研究的。但是我只用過商品列表組件，所以只能寫一下商品列表的組件內(nèi)容與情況啦，如果有其他的朋友也用過這款工具，有機會大家可以多多交流。

WebApp的優(yōu)勢：

1.開發(fā)成本低

2.適配多種移動設(shè)備成本低

3.跨平臺和終端

4.迭代更新容易

5.無需安裝成本

WebApp的劣勢：

1.瀏覽的體驗短期內(nèi)還無法超越原生應(yīng)用

2.消息推送不夠及時

3.調(diào)用本地文件系統(tǒng)的能力弱

總結(jié)心得：引用來自豆瓣的（達(dá)眾網(wǎng)絡(luò)）

業(yè)界精神領(lǐng)袖喬布斯創(chuàng)建了應(yīng)用商店(AppStore)，但他卻極富遠(yuǎn)見地告誡開發(fā)者，“雖然現(xiàn)階段NativeApp給了用戶更好的體驗，但Web才是未來。如果現(xiàn)在的開發(fā)者不有效利用Web技術(shù)，那他就落伍了。”(原載：infotoall網(wǎng))

在很多開發(fā)者眼里，WebApp開發(fā)成本低，輕松實現(xiàn)跨平臺，保證體驗的一致性；同時，迭代更新更加容易，用戶使用成本和門檻較低。但WebApp目前的不足也十分明顯，如瀏覽體驗短期內(nèi)無法超越NativeApp、調(diào)用本地文件系統(tǒng)的能力有待提高等。

對于NativeApp，有開發(fā)者認(rèn)為，原生應(yīng)用有更好的交互界面和交互體驗，收費的盈利模式明朗，可更好的訪問本地資源等。當(dāng)然NativeApp移植成本高、上線需要應(yīng)用市場確認(rèn)等劣勢也不能忽視。

“WebApp和NtiveApp各有長短，互相補充，WebApp不能取代傳統(tǒng)App?！比f維網(wǎng)聯(lián)盟中國區(qū)代表李安琪表示，當(dāng)前WebApp與NativeApp仍然無法相互替代，兩者是相互學(xué)習(xí)、相互促進(jìn)的關(guān)系。當(dāng)Web的體驗與Native相近的時候，用戶更愿意把精力集中在內(nèi)容上，而并非是交互界面，在這種情形下，WebApp的優(yōu)勢將更加明顯。

“WebApp代表未來，NativeApp只是過去，這也為蘋果、谷歌、微軟等公司所公認(rèn)?！彬v訊無線瀏覽器產(chǎn)品部工程師夏李表示，用戶期待著WebApp所帶來的那種跨平臺同步的無縫體驗，所有的WebApp將不再是一個個孤島，而是達(dá)到資源的充分互補，從而加快手機瀏覽器商業(yè)模式成熟的步伐。除了相對成熟的廣告模式外，云服務(wù)會在HTML5的基礎(chǔ)上讓W(xué)eb凸顯更大的價值。

本文題目：手機app開發(fā)如何思考理念？
網(wǎng)站網(wǎng)址：http://aaarwkj.com/news48/213848.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián)，是專注品牌與效果的網(wǎng)站制作，網(wǎng)絡(luò)營銷seo公司；服務(wù)項目有App開發(fā)等

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)