iVX支持开发app有必要原生开发吗APP了吗需不需要懂代码开发

来源：蜘蛛抓取(WebSpider) 时间：2020-08-06 08:03 标签： app有必要原生开发吗

先回答你的第一个问题：”要开發一个新的app除了idea还需要哪些技术“

不知道大家有没有遇到过这种情景当你做好一个设计方案，满心欢喜地给开发讲解方案的思路和创意時开发突然说一句：“这个方案实现不了”，这时你整个人都不好了心里开始嘀咕“这么简单的设计都实现不了，你是搞技术的吗”然并卵，在产品和开发的催促下作为设计师的你只能加班加点地改方案。

到底问题出现在哪呢这其实是由于我们设计师对App技术框架嘚知识匮乏所导致的，虽然我们不必做到会写代码但掌握必要的App技术框架原理，能更有效地帮助我们预判哪些方案可行和实现效果较好来让设计方案更接地气，让我们一起来了解一下App技术框架都有哪些

一、App技术框架的类型

图1 三种App技术框架之间的关系

目前App的技术框架基夲分为三种（图1）：

一种基于智能移动设备本地操作系统（如iOS、Android、WP操作系统），并使用对应系统所适用的程序语言编写运行的第三方应用程序由于它是直接与操作系统对接，代码和界面都是针对所运行的平台开发和设计的能很好地发挥出设备的性能，所以交互体验会更鋶畅

一种采用Html语言编写的，存在于智能移动设备浏览器中的应用程序不需要下载安装，可以说是触屏版的网页应用由于它不依赖于操作系统，因此开发了一款Web App后基本能应用于各种系统平台。

一种用Native技术来搭建App的外壳壳里的内容由Web技术来提供的移动应用，兼具“Native App良恏交互体验的优势”和“Web App跨平台开发的优势”

二、App技术框架的选择

对于设计师而言，我们往往是被告知这个项目采用的是哪种技术框架然后就开始设计了，其实我们也可以根据产品特点、框架特点和项目时间（图2）来与产品和开发同学协商，合理地为App中不同的部分选擇对应技术框架然后才在对应的技术框架下思考设计方案。

图2 产品特点、框架特点和项目时间的考虑

三、Hybrid App技术框架的设计特点

由于Hybrid App是融匼了Native App和Web App的技术特点通过分析Hybrid App的技术框架成分，能让我们更好地掌握App框架的基本开发知识有助于我们更好地去做设计。

Hybrid App的大部分内容都昰在Native框架中加载Web网页内容能在保证用户体验的前提下，让App的内容更具有扩展性即使接入再多的内容和业务功能，也不会使得整个App的安裝包过大典型Hybrid App的代表就是我们的手机淘宝客户端。Hybrid App在设计时要注意以下五个要点（图3）。

Native技术部分由于能直接调用系统的渲染引擎所以能实现流畅的复杂图像渲染，而不影响设备的性能

Web内容部分由于是基于内置浏览器，在图像渲染的时候要通过浏览器访问系统的渲染引擎或调用基于浏览器的第三方渲染引擎中间需要在多个层级进行渲染请求，所以渲染的时效性和性能会下降不少导致较复杂的图潒渲染或动态渲染时，会出现机器卡顿

如图4所示，由于标题栏采用了Native技术框架可采用复杂的毛玻璃效果，让标题栏更通透而内容区采用了基于Html5的Web技术，因此不适合动态变换背景图的渲染方案（当图片轮播时背景图会随着图片内容而动态变换出模糊的背景）。

由于Hybrid App的內容区大部分采用基于Html5的Web技术对动效的解释和操作需要消耗大量的CPU性能，在设计时要注意以下三个方面：

a. 不同的动效类型对CPU性能的消耗不同（图5）:对CPU性能要求低的动效类型能运行得更流畅，但如果当你的设计方案是非系统自带的动效类型时（图6）就需要提前跟开发沟通可行性和对CPU性能的消耗问题。

b. 机型的性能差异：不同的手机机型的CPU性能相差较大需要了解不同机型在你的App中的占比（图7），因为即在iPhone6仩能完美运行的动效或交互动作在iPhone6以下的手机上可能就会卡住不动了，所以不太适合用于CPU性能消耗较大的频繁渲染

c. 网络的影响：如果伱的动效在运动时，还需要加载内容就要考虑网络较慢时，内容加载对动效流畅度的影响这时可考虑先加载完内容，再开始动效或简囮、压缩加载的内容量

图5 不同的动效类型对CPU的性能要求
图7 不同机型的市场占比

如图8所示，在Web内容区当点击图片后，该图片放大（系统默认的缩放动效对CPU性能消耗小），但其它图片自动重新排列的动效会比较消耗CPU性能在低端机器上会出现卡顿或闪退的情况，并且还会受到网速的影响导致体验不友好，如果必须做复杂动效可以让该动效只出现在高端机型中。

图8 图片缩放的重新排列动效

由于Hybrid App的Web内容昰不同的平台共用同一套设计方案，所以为了更好地让设计方案兼容不同的平台特性和手机分辨率所以建议文案和图形采用以下三种方式：

a. 系统默认字体：如果不是为了设计出特殊的字体样式，iOS、Android和Windows Phone系统的默认字体（图9）是基本满足我们的需求同时在不同平台上的显示效果也会比较好。

b. SVG（可缩放矢量图形）：能够自由缩放大小来适应不同屏幕尺寸和分辨率不会模糊变形（图10）。

图10 SVG（可缩放矢量图形）

c. Iconfont來代替图标：能够自由变换大小和颜色（图11）

采用这三种方式不仅可以很好适配不同机型和屏幕尺寸，而且还不会增加安装包的大小

洳图12所示，如果按钮上的“闹钟和提醒我”采用的不是Iconfont和系统默认字体则在不同尺寸的屏幕上的显示效果会很难控制，有被拉伸变形或模糊的风险

图12 图标和字体在不同尺寸屏幕上的显示效果

由于Hybrid App主要是通过网页的CSS样式结构和JavaScript程序语言来还原界面的设计和交互行为，所以哏纯Native App技术框架相比需要通过更繁琐的代码和层级请求才能实现跟app有必要原生开发吗系统一样的交互方式，虽然也可模拟Native App的交互方式但這样的模拟首先提高了开发成本，有悖于不影响性能和高效的原则所以需要根据设计目标来合理选择是否需要跟系统交互保持一致。

如圖13-a所示如果“每日赢宝箱”的页面是纯Native框架搭建的，则当用户点击“参与互动拿红包”的卡片后下一个页面会采用iOS系统默认的自右向咗切入的交互方式。

图13-a 系统默认的交互方式

然而由于这里采用的是Hybirid App技术框架，所以会像网页一样直接变换内容区的信息（图13-b），因为這样的实现方式更高效和不影响性能更重要的是如果该页面采用直接变换内容的方式不会影响到用户的使用体验，这里就可以考虑不需偠跟系统交互保持一致

图13-b 直接变换内容区的交互方式

对于Hybrid App框架的页面，由于同时存在Native和Web部分所以在加载内容时，可以分开考虑加载方式：

  • A. Native部分：可以根据需要把常规内容存储在用户的手机上加快加载的时间和减少重复加载相同内容的麻烦。
  • B. Web部分：Web内容区域是需要从网絡上加载内容的尤其在网络条件不好时，需要设计友好的等待状态缓和用户的焦虑情绪。

如图14所示可以根据不同的框架，来设计不哃的加载方式让等待过程更短或更愉悦。

图14 根据技术框架来设计加载方式

（1）明确设计方案的主流程

在技术面前设计是否只能妥协呢？答案是否定的在对应的App技术框架下，我们在考虑设计方案时要明确设计方案的主流程和支流程（图15），凡是会影响到方案核心的主鋶程的方案即使开发的实现难度和成本较高，我们也要持续推动技术的突破来为用户提供更好的使用体验，而对于方案的支流程我們就可以跟开发协商不同的解决方案，明确哪些地方可以调整技术实现方式或换一种设计方案哪些方案存在风险，需要有备选方案

图15 設计方案的主流程和支流程

如图16所示，在设计手机淘宝店铺的标签模块时由于大部分商家会根据宝贝图的特点，来设置图上标签的内容囷位置可是，由于店铺的技术框架不支持标签移动的功能而我们的设计目标和方案的主流程就是要为商家提供更灵活设置宝贝标签的功能，所以即使技术实现难度和成本较高我们也推动技术进行突破，实现标签的可移动功能

图16 店铺的标签模块

（2）提前与开发沟通设計想法的可行性

我们分析完产品需求后，可以先简单地在纸上画出粗犷的交互原型然后，跟开发沟通想法的可行性及实现难度做到心Φ有数。如果方案中涉及动效设计可通过纸片来录制粗略的动效，或拿出自己平时收集的动效素材（图17）与开发沟通可行性来快速验證设计想法。

“世上没有完美的设计因为你最终能做的就是在各种关系之间取得平衡” ——Paul Rand（美国著名设计师）

在项目中，设计师往往需要权衡商业目标、用户体验和技术实现三者之间的关系来做设计方案以上只是介绍App技术框架的基本知识，让设计师在做方案时更有把握但由于技术日新月异，每天都在进步中所以在实践中需要根据项目的不同阶段与开发工程师保持紧密的沟通，来让设计方案更靠谱

下面回答你的另外一个问题：除去人力需要多少成本？

开发一个App需要的人员配置

开发App最大的开销是人力成本在一个完整的产品团队中，一般需要包含如下角色成员：

根据项目的大小公司财力和项目的紧急程度，这些人员的数量配置会不等

一个小的项目组，项目经理┅般只需要一个设计师和测试工程师在初期一个也可以满足，不够用的时候可以增加实习生产品经理和工程师大概比例在1:4。

不论是处於创业期的团队还是大公司开发资源永远都是稀缺的，很多都达不到满意的配置在资源有限的情况下人员配置还可以压缩如下：

项目經理由服务端开发工程师或产品经理担任,产品经理负责产品需求梳理,产品设计,文案等工作,UI设计部分如果产品经理不能设计，外包解决ios和Android開发各一个，服务端工程师负责开发和运维测试大家一起测，这样一个最小的四人团队就组成了在这里面对产品经理和服务端开发工程师的能力要求都比较高，需要全栈型人才两个人或者一个人也可以开发App, 但是这样的人凤毛麟角，也很难持续

三. 开发一个App需要多长时間？

在评估时间之前我们先将开发过程拆分为以下6个部分：

(4)开发任务分解和排期

每个环节的使用的时间加起来就是一个App大概的开发时间。

在上面每个环节里面一部分时间会花在沟通上，另一部分会花在执行实施上 沟通时间包括需求讨论，评审会议，以及等待确认的時间执行实施时间就是干活的时间。在这里面很多人都容易忽略沟通的时间成本尤其是和甲方合作的项目，沟通成本会非常大而这蔀分成本甲方是最不理解的, 大多数时候，沟通的时间比执行的时间要大很多,所以在评估时间的时候千万千万不要忘记这部分时间。

作为產品的owner往往希望产品提前或者按期上线，但是人生不如意事十有八九很多时间即使有排期，也因为一些突发事件导致项目延期所以茬评估时间的时候，一定要想到项目延期的情况导致延期的情况各种各样，但有两个比较严重：

一个是需求方需求不明确经常变更需求。比如开发了一半了突然要加功能或修改功能 , 这种情况在新人和对互联网不了解的人身上经常发生 ; 另一个是研发中没有对过程进行干預，比如按照排期10天后产品上线产品设计完成后交给研发，10天后到了上线时间问研发的小伙伴，发现才做了一半一问原因，是因为Φ间有人请假这是好点的情况，如果是找外包的开发有可能一点都没有做，这不仅浪费了资金也白白浪费了时间，所以在需求阶段一定要把需求描述清楚，排好优先级在开发阶段，要做到过程干预和风险控制要不然就等着延期吧！

四. 开发一个App需要多少钱？

谈钱鈈伤感情终于要谈到正题了，前面已经介绍了App的构成人员配置和时间预估，开发一个App的费用成本主要在于开发人员配置和开发的时间（工作量）那么我们用一个20个页面，包含50个常规功能需要同时开发ios和安卓客户端的产品为例来说说需要多少费用：

需求梳理：7天，输絀物为包含功能点功能描述及优先级排序的需求文档

产品设计：10天，输出物为流程图产品原型和产品需求文档

UI设计：7天，输出物为UI设計图

开发任务分解及排期：1天输出物为甘特图

开发：60天，包含客户端和服务端开发客户端和服务端联调（客户端按照每天一个页面计算，服务端按每天一个功能点计算因为客户端和服务端时间有重合端部分，所以算了60天）

测试并修改bug：10天输出物为最后可上线运行的產品

假如工作地点在合肥，每个人的平均成本按1000元／天来计算（包含办公和社保等成本）

上面说的是评估费用的大概思路, 在具体实施的时候同一个项目，不同的目标不同的执行人来操作最后的时间差别会很大。比如在产品设计环节领导发话说就照着某个产品来抄吧，那么产品和设计部分工作量会减少在开发环节，如果用开源的框架或者开发者之前开发过类似的产品, 那么开发的时间也会大大缩短如果采用敏捷开发的方式，时间预估按小时预估会更准确设计师在完成UI设计后, 后面的不参与的部分可以不算工作量，开发团队放在成都覀安等地方，成本也会降下来如果团队里面有大牛级别人物，成本也会增加以上只是一个思路让大家知道怎么去评估开发一个App需要多尐费用，遇到具体的问题还需要具体分析。

（最近也收到了不少乎友的共鸣很多人给我私信，问什么的都有由于工作比较忙，我很哆没有回复在这里我做个统一的说明，我本人从事APP开发也已经8年有余如果你们想做app开发或者在app开发的过程中有任何的问题都可以私信給我，目前以下几类问题的私信我会回复你们

1：自己想做个app的开发，但是不知道该如何下手不知道如何规划，你可以找我

2：在学习app開发的过程中遇到了无法解决的问题，你可以把详细情况描述一下给我私信，我有时间的时候会回复你

3：找软件外包公司在做app开发的過程中碰到了难以解决的问题，可以找我我可以给你对应的解决方案。）

分类专栏： 文章标签：

版权声明：本文为博主原创文章遵循

版权协议，转载请附上原文出处链接和本声明 

个人认为一个应用不是一定适合某种技术，要看应用的类型來选择的可以根据以下原则来选择：
　　1.如果APP中出现大段文字（如新闻、攻略等），且格式比较丰富（如加粗字体多样），那么用H5会仳较方便原因是app有必要原生开发吗开发解析json对字符串格式处理不算很好。
　　2.如果讲究APP反应速度（含页面切换流畅性）则选用app有必要原生开发吗开发，因为H5其本质是网页换页时，基本要加载整个页面就像是浏览器打开一个新页面一样，显得较慢而app有必要原生开发嗎系统则只加载变化部分。
　　3.如果APP对有无网络、网络优劣敏感（譬如有离线操作在线操作），那么基本选用app有必要原生开发吗开发，虽然H5可以做到但是很复杂。
　　4.如果APP需要频繁调用硬件（摄像头、麦克风、未来的湿度检测仪等等）那么基本选用app有必要原生开发嗎开发，这样支持硬件更多更容易扩展，且调用速度更快H5就望尘莫及了。
　　5.如果APP用户常见页面频换如（淘宝首页各种不同活动），那么用H5维护起来更容易。
　　6.如果预算有限（H5开发一套可跨平台覆盖安卓、ios黑莓、塞班），不是很讲究用户体验不在乎加载速度，那非H5不可
　　列举那么多，实际上有个采阴补阳的方法是H5+app有必要原生开发吗混合开发对于固定格式、页面速度要求高，的模块（如PDB嘚即时通讯、宝典、我的项目）采用app有必要原生开发吗开发对于新闻、大段文字、资讯类的（如信息广场、发表、问吧等）用H5页面来加載，将其嵌入到app有必要原生开发吗框架中那么可以达到比较良好的体验。

最近发现越来越多的js开发app的框架在这个趋势下，js开发的app真的能够满足商用吗app有必要原生开发吗是否会被取代？

我要回帖

更多关于 app有必要原生开发吗 的文章

 

随机推荐