如今，每一家具備在線業(yè)務的第三方公司都在考慮創(chuàng)建一個移動app或移動版網站。今天，我們來討論下哪種方式更方便，以及需要使用哪些技術用來征服移動市場。
從一開始，我想指出的是，幾年前在“移動版本的網站”下，我們暗示了需要單獨開發(fā)一個移動設備的獨立版本，而現在這個術語只意味著創(chuàng)建自適應模式的方案。
移動app或移動版網站
浮現在任何企業(yè)腦海中的第一個問題是選擇什么——一個移動 app或一個自適應模型？
決定到底什么樣的商業(yè)策略適合于您，最重要的是從開始制定攻克手機市場的時刻開始，就要找出您行動的目標。
如果你從整體局勢上來看，移動 app似乎更可取，也更適合投資。
從界面的角度來看，移動app總是看起來更美觀，因為它們獨立于每個移動設備的瀏覽器或者屏幕尺寸，他們是為特定的平臺（比如 ios）而創(chuàng)建的。安裝移動app后，很少需要上網做后續(xù)工作。
不過，選擇移動app也有一些缺點。最大的缺點是資源，移動應用在開發(fā)過程中需要更多的時間、金錢和人力資源。預估該項目的推出將更加困難，在應用商店中發(fā)布你的 app可能需要花3天到幾周的時間才行。
如果你不想從一種選擇跳轉到另一種選擇，那么你需要了解項目的主要參數（可供選擇的只有3個）——你想達到的目標，你的預算，你的目標受眾。大多數情況下，了解你的預算就足夠了——開發(fā)移動 app更昂貴。如果你沒有預算限制，最好是看一下主要目標：如果是這樣，你只需要提高你的 google索引（移動優(yōu)先的方法），這比開發(fā)移動版本的網站還管用。
如果你仍然不知道該選擇什么，那么我有一個折中的建議——帶有瀏覽器組件的移動app。
我可以給你舉一個例子，就是著名的 imdb應用程序。頁面的主模板在應用程序中，而一些頁面（即將上映的新電影）則是從瀏覽器中加載的。在這種情況下，你只需使用互聯(lián)網來加載新的內容（電影），但是你的應用程序將會在沒有網的情況下整體上穩(wěn)定運行。
為什么人們選擇移動app開發(fā)
根據我們的經驗，在創(chuàng)建移動app時，根據你的目標，我們可以看到幾個原因。主要的原因是你想要收集并擴大用戶數據庫，并且進入新的移動用戶群。有時，是因為公司想要引領潮流，站在技術和創(chuàng)新的前沿。此外，看看你的競爭對手，如果他們當中的前五名都有移動app，那么最好的方法是跟隨他們，保持競爭力。
當你決定創(chuàng)建一個移動app時從哪開始選擇平臺
首先，你需要在平臺上做出決定。你不需要同時為所有平臺開發(fā)一款app。此外，我們建議從一個平臺開始，也許你根根就不需要其它類型的平臺了。
要選擇一個平臺，你需要確定你的 app的目標和你想到達的受眾。如果你想從你的app中賺錢，專注于商業(yè)用戶，那么從ios開始更好，因為它的付費用戶最多。如果你想要吸引更多的受眾，你的app 沒有內購，最好從android開始——大多數廣泛使用的設備在這個平臺上工作。
決定移動app的任務
在這個階段，你需要考慮你的app將解決的任務。
你的主要目標將幫助你構造app的任務池。舉個例子，想象一下，你決定為你的在線商店創(chuàng)建一個app，目標是讓你的客戶有能力通過平板電腦和智能手機選擇和購買商品。
基于這個目標，你可以形成一個任務池：你需要方便的導航、商品搜索、快速排序處理、跟蹤和同步。
如果你有不同的目標，比如在你的商店運行期間引入社交功能，那么任務也會有所不同。對于這種目標，舉個例子，你可以在你的商店中加入輕社交，用戶可以在照片上標記項目（這些標簽將會通向特定的專題頁面）。通過這樣做，你就可以解決你的主要銷售目標，同時提高你的客戶忠誠度，以及他們在商店生活的參與度。
如果你的目標是征服一個國際市場，那么你的應用就需要解決其他問題。首先，它必須適應新的市場。這里我們舉例，如果你要去中國市場，你最好讓你的app能夠掃二維碼。
在定義完任務之后做什么
在這個階段，有必要進行競爭對手的app分析（如果你以前沒有做過的話）。如果你想讓你的app解決相同的任務，現有的app都能解決，那么最好再多想想。你還能做些什么來從競爭者中脫穎而出呢？
記住，當你創(chuàng)建一個移動 app時，你不需要把所有可能的功能都裝進去。最好還是保持一兩個主要功能，集中開發(fā)于它。
根據你的主要功能，決定你的應用將具有哪些組件。最后，你準備好了繼續(xù)。
在項目的這個階段，我們經常會有一個問題，那就是有沒有必要把你的網頁結構完全地應用到這個app中。在某些情況下，你可能會認為許多組件都被遺漏了，但實際上并非總是如此。我們的關鍵任務是從網絡上遷移用戶到你的移動app，而不會丟失他以前經常使用的關鍵功能。你的應用程序不需要在給用戶添麻煩的情況下工作。
讓我們來看一個簡單的例子，建筑材料的線上商店提供了大量的咨詢形式，有許多可供選擇的選項，比如交付類型（到付或自付），材料的數量，在哪里樓層交付你的訂單等等。如果你排除了交付選項的類型，那么習慣了網絡表單的用戶可能會在功能中迷失。這將導致訂單的丟失和對不方便app的卸載。
這就是為什么當你把結構從網絡遷移到移動app的時候，我們需要考慮用戶經常使用的功能特性。在某些情況下，網站地圖可能會幫助你。不過，你也需要對網站地圖保持謹慎。
如何使用網站地圖
如果你決定將你的網站地圖應用到你的移動app中，那么你將面臨致命的后果。你會混淆你自己和你的用戶，使app功能冗雜，使用變得不方便。
如果你真的想不忘記任何必要的細節(jié)，把網站地圖作為移動app的參考，那么它 會是你很好的助手。
網站地圖是你需要依賴的核心，但永遠不應該完全轉移到移動 app上。如果你認為你的app仍然充斥著信息，你可以通過組合不同類型的菜單添加一些空間。
正如你在圖片上可以看到的，app的標準屏幕示例，在移動設備上會有幾個傳遞信息的選項。
有很多不同類型的菜單并不取決于平臺，像頂部菜單，底部菜單和側邊菜單。此外，屏幕上的卡片也可以以不同的方式放置，比如，它們可以放在一個屏幕上，或者被劃到右側。
為了方便使用和卸載 app，你可以使用組合核心，當所有的主要功能都被放置在頂部或底部菜單中時，卡片會被刷新，側邊菜單被用于其他功能（反饋、技術支持、公司信息等等）。
你需要跟哪些網絡組件說再見
盡管在將你的項目從網頁轉移到移動端時需要保持許多特性，但是有一組基本的網頁元素是你不需要轉移的。首先，它的頁腳，頁眉，面包屑，復雜的分層場景和重品牌。
讓我們多談一下重品牌的問題。在你的 app中只需要使用現有品牌的配色方案，就足以讓你的圖標和屏幕上彰顯品牌性。你的 app仍然會引人注目，因為當你下載一個app時，你會看到一個圖標和出版商的名字，這已經足夠了。不要讓你的app充斥著品牌元素，它的主要關注點應該是用方便實用的功能去幫助用戶解決他們的任務，達到你的目標。
我想要給一些能幫助你簡化設計流程的建議。
更多的屏幕不等于更方便較少的功能并不總是正確的決策將你的網頁項目邏輯最大化并不總是勝利
記住，移動app不總是你的網站的一個輕量版本。此外，移動 app序在其結構中往往與網頁項目一樣復雜。
我想提的是，對于這樣的項目，在一定程度上最好有獨立的移動端設計師。即使你有優(yōu)秀的網頁設計師，他仍然無法想象所有的移動特性。
有什么是網頁設計師不知道的
在為移動 app創(chuàng)建設計時，你總是需要根據應用商店的指導方針來工作。移動app的結構和邏輯與網頁項目有很大的不同。你需要將你的注意力轉移到授權和用戶的匿名化上。 一般用戶使用屏幕的時間，更多來自于手勢和動畫，如果在網頁上，用鼠標點擊屏幕就足夠了，在移動 app中，我們會有更多的手勢，像推動，雙擊，長按，滑動和其他與你的屏幕交互的方式。
有什么移動app能做，網站不能做的
繼續(xù)討論移動和網絡之間的差異，其中最重要的是需要考慮到app 與網站的不同之處。你的網站沒有必要總是在你的手上，因為它需要網絡來加載，所以它不能根據你的位置給你發(fā)送推送通知和各種各樣的優(yōu)惠。
此外，平臺上各種各樣的本地功能，只有移動設備才能訪問。例如蘋果/安卓支付，與智能手表、日歷、地圖、錢包等的同步。
我們談到了設計，但是關于開發(fā)呢？
正如我在一開始提到的，移動 app的開發(fā)周期要比創(chuàng)建移動版網站要長得多。
通常，網頁項目更便宜，因為在移動app開發(fā)過程中，你需要服務器，與其他app的集成以及平臺的本地功能。
每個平臺都需要自己的開發(fā)，移動端模型不是動態(tài)的，你需要根據需要的平臺數量來創(chuàng)建幾個版本。
我想說的重點是，移動app并不總是網站的一個輕量版本。這就是為什么在你的網頁項目轉移到移動app時，你需要考慮到你的app許多特性，才能在應用商店中發(fā)布，以及實現你的目標。
以上是翻譯的文章。從市場行情來看，設計師從事移動端的薪水待遇也要比做網頁端平均高一些~如果大家伙不考慮興趣因素的話，建議轉向移動端~
翻譯：tsien
作者：elena lysiakova
原文：how to create a mobile app based on your website
原文地址：https://medium.muz.li/how-to-create-a-mobile-app-based-on