加入收藏 | 设为首页 | 会员中心 | 我要投稿 应用网_丽江站长网 (http://www.0888zz.com/)- 科技、建站、数据工具、云上网络、机器学习!
当前位置: 首页 > 站长资讯 > 传媒 > 正文

手机app开发

发布时间:2016-05-26 21:59:41 所属栏目:传媒 来源:站长之家用户
导读:未来是WebApp的天下,还是NativeApp的天下?作为设计师,我们是应该努力把客户端的体验提升到最优,还是在网页应用层面上做更多的设计?这个一直是大家关心的话题。那么,

即速应用在很大程度上参考了原生App的功能,所以提供了非常丰富的功能组件,比如导航组件,轮播图组件,分类组件,视频组件,音频组件,按钮组件,自定义组件,选项投票等等组件。确实可以不需要编写代码,只需把想要的组件拖动到对应的面板里,完成页面布局、颜色、字体设定,链接跳转等,即可一键生成WebApp。当然这也是我们只做WebApp过程中,最花时间的步骤,我们需要不断的创建版块和页面布局,我们也需要时刻记得每块模板都应跳转到对应的页面。

我是选择空白模板,自己建模板。自己没UI的,如果你们想省时间,我觉得可以套用模板,可以比较快的生成自己想要的WebApp,毕竟能快就快,能省就省才是王道嘛。

来看看我大致的首页布局吧!

首页布局

APP开发 App开发平台

看不懂组件名称,不懂组件怎么用?看看《帮助》咯!《帮助》都已经把大致的布局进行了粗略的介绍。至少不会让自己对功能模模糊糊。如果对某个组件还是不清楚,那么可以点击那个组件的右上角的小问号图标,会有一个详细的介绍。

APP开发 App开发平台

看完组件说明就直接创建一个空白模板开始制作WebApp

制作第一步:我先插入一个顶部导航组件,作为首页,顶部导航的标题我建议都是大家的公司或者商城名称。

制作第二步:然后我创建了一个轮播图组件做Banner,因为我做的是微商城,我仿照了TB,用轮播的方式播放一些我修好的商品图片。然后在右边的组件内容中对每个轮播图片逐一添加相对应页面链接去向。

制作第三步:接着我创建了一个图片列表,并在页面属性中把行列设置成了4列1行,我再修改图片高度直接设置为圆形,系统就自动调整图片高低了。接着我更换了图片,替换成按钮图片,并在点击事件中的页面链接至相对应的页面。如下图

APP开发 App开发平台

制作第四步:因为我想在这一行左右分开,并且是做成左边是大图,右边是上下分开的小图加标题。

所以我先插入一个双栏组件,再在右边的栏里再插入一个双栏,这样就实现了栏目的划分。接着在最左边的双栏位置插入一个大图,并且对它的宽度和高度调节。然后对最右边的双栏也插入一个图片组件,并且右键复制一个图片组件到下面(小技巧),如下图,接着拖入文本插件,这里需要注意,拖入第三文本框后,需要先对它的上间距进行调整,再拖入第四个文本框,这样才可以做到上下图片对应文字的标题与内容。(小技巧)

制作第五步:插入底部导航组件,任何的App都有底部导航,所以我这里需要提醒,每个页面的编辑完后,都需要插入一个底部导航。我自己一般是先编辑一个纯底部导航的页面,然后编辑其他页面的时候,我先复制这个纯底部导航的页面再编辑,这样能省下我不少时间。(小技巧)

APP开发 App开发平台

基本上的页面编辑和布局大致是这样的,编辑过一次之后就会你发现这个WebApp的制作并不难。

接下来我想讲的是高级组件中的商品列表组件。这功能满方便的,这个组件添加到你商品页面之后,你在前端的App制作只需要编辑一下这个版块的分布和排版就好。因为所有的商品数据和图片都是在后台中上架和调整价钱的,这也是方便后台的数据管理吧。不过我想吐糟一下,后台的数据整理和图片上传后,前端制作也看不到图片,需要自己预览App才能看见。

APP开发 App开发平台

进入后台管理,我们就看到商品管理这个选项。我们先添加分类,保证自己上架的物品不会混乱难以管理。分类好后再在每个对应的分类中添加商品和填写商品的信息即可。如下图

APP开发 App开发平台

在商品管理后台上传了所有的商品数据后,现在只需要回到前端制作App的页面,在商品页面给每个商品填上对应后台的链接就可以了。非常方便快捷。

既然商品都上架,并且让自己的商品在售了,那就需要学会管理后台的订单和查看订单,即速应用这个也是仿照了TB做出了这样一个后台管理,着实让我这个小白也会用这个来管理订单,下面po一个我朋友的订单管理页面。

APP开发 App开发平台

好啦,我大概的制作过程和心得也差不多是这样啦!虽然即速应用有着蛮多的高级功能组件,其中商品列表组件(电商支付功能),BBS组件(社交娱乐功能),自定义表单组件(数据统计功能),个人中心组件等等是每位WebApp作者都愿意去制作和研究的。但是我只用过商品列表组件,所以只能写一下商品列表的组件内容与情况啦,如果有其他的朋友也用过这款工具,有机会大家可以多多交流。

WebApp的优势:

1.开发成本低

2.适配多种移动设备成本低

3.跨平台和终端

4.迭代更新容易

5.无需安装成本

WebApp的劣势:

1.浏览的体验短期内还无法超越原生应用

2.消息推送不够及时

3.调用本地文件系统的能力弱

总结心得:引用来自豆瓣的(达众网络)

业界精神领袖乔布斯创建了应用商店(AppStore),但他却极富远见地告诫开发者,“虽然现阶段NativeApp给了用户更好的体验,但Web才是未来。如果现在的开发者不有效利用Web技术,那他就落伍了。”(原载:infotoall网)

在很多开发者眼里,WebApp开发成本低,轻松实现跨平台,保证体验的一致性;同时,迭代更新更加容易,用户使用成本和门槛较低。但WebApp目前的不足也十分明显,如浏览体验短期内无法超越NativeApp、调用本地文件系统的能力有待提高等。

对于NativeApp,有开发者认为,原生应用有更好的交互界面和交互体验,收费的盈利模式明朗,可更好的访问本地资源等。当然NativeApp移植成本高、上线需要应用市场确认等劣势也不能忽视。

(编辑:应用网_丽江站长网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

推荐文章
    热点阅读