首页 > 建站资源 > 网站运营 > Web APP与原生APP有哪些交互设计区别?

Web APP与原生APP有哪些交互设计区别?

时间:2015-01-30    来源:简书网

web-native-app-interactive-differences-1

@ChM_CuoreAzzurro :Web App和原生APP同为移动端,很少有时间研究这两项的交互区别,最近公司做了一次从原生APP到Web App(HTML5 )的移植,故总结一下期间遇到的问题及不同点总结。

从使用场景上,Web App用户面临比原生APP用户更严峻的问题:

1、页面跳转更加费力,不稳定感更强

思考点:如何减少跳转(扁平结构、页面布局技巧),增加数据及展示的流畅流程及稳定性(技术)

2、更小的页面空间(由于浏览器的导航本身占用一部分屏幕空间),更大的信息记忆负担

移动设备的屏幕要小得多。这种如同透过门缝进行的阅读增加了认知的负担。人脑的短期记忆是不稳定的,用户在滚动屏幕的过程中需要临时记忆的信息越多,他们的表现就会越差。——《贴心设计:打造高可用性的移动产品》

思考点:排版更清晰、信息更简练 (可在原生APP基础上去掉一些丰富、复杂的视觉表现)

3、导航不明显,原有底部导航消失,有效的导航遇到挑战

思考点:如何有效的提供导航?有哪些形式?

4、交互动态效果收到限制,影响一些页面场景、逻辑的理解。

思考点:比如登录注册流程的弹出、完成及异常退出,做好文字提示。

针对以上困境,解决方法总结如下:

首先,从APP到WAP版,在产品上,最明显且核心的:

1、精简功能,只将核心的任务实现,非核心的枝节可考虑删减。

2、做好新的Web App导航.

3、补充从Web App 对 下载原生APP 的引导。

>>>>> Web App导航怎样设计?

一、常见的几种Web APP导航样式

1.1顶部底部导航的设计:

jh201501297

1.2导航快捷键设计:

美团:顶部栏固定位置

淘宝:悬浮圆圈–可展开的按钮

优酷:非首屏时页面右侧悬浮

jh201501296

二、有效的导航设计

1、基本的快捷导航中包括 返回常用页面(如 首页 我的 等)的快捷方式

2、出现深层架构时 及时补充返回重要层级页面的快捷方式

3、情境式导航,方便用户快捷跳转到ta想去的页面,如购买结束时提供查看订单详情的按钮。

PS:Web APP更加需要画页面跳转的流程图,摸清各个页面的入口,尤其是页面返回的流程;有些简化的返回按钮,可以特殊注明返回到的页面

>>>>>>>>> 怎样引导用户下载APP?

在哪里出现引导?

一般首页、核心任务的页面(如 电商Web APP的商品详情页 、视频Web APP的视频观看页)

二、引导下载APP有哪些形式?

页面顶部放置下载条 页面底部悬浮层引导 融合在页面首屏中 下载按钮形式 底部Foot里含客户端下载入口

jh201501295

相关推荐
如何在6个月内自学成才成为一个互联网设计师?
好看好用?UI设计师不可不学的易用性原则
web设计师西乔:我正在过着非常奢侈的生活
如何打造一款用户喜爱的移动App应用?
遵循用户需求的设计:最美APP的9条闪光定律
试析社交APP设计思路:如何赢得市场和用户
从电商网站应用设计中学到的九个成功秘诀
4个因素设计出一款令用户上瘾的App
极简主义:移动应用设计之七剑下天山
今日最佳设计:人像即按钮 社交应用新趋势
App开发人自白:做APP是一场赌局你要会押注
如何给Android产品设计一款合适的图标?
一个老外产品经理如何看中国APP的
APP开发:短时间内外行人如何成为APP大神
App开发冷思考:初创App从零用户到冷启动
一次回归初心的探索!豆瓣App分析体验报告
这是个看脸的世界 即便你是APP也是如此
以微信网易为例:新闻型产品列表设计分析
干货:设计APP产品不得不知的4个心理学原理
百度官方出品!2015-2016交互体验趋势
APICloud:一站式实现快速APP开发、管理、测试的平台
APP产品设计:让用户看见 才是王道!
页面策划:空白页面应该如何设计?
nice 启示录: 看移动 App 的产品设计和运营策略
好的移动应用设计,就该这样
想要App做得美,这些UI/UX设计趋势你要知道啊
前网易PM总监:移动APP登录、注册等设计经验
设计一款APP产品需要考虑哪些因素?
从产品经理的角度算 做一个 APP 需要多少钱
微信老外产品经理的《中国移动应用设计趋势》
从交互设计角度 聊聊Web网站和移动App六大差异
iOS app制作教程:iPhone App制作不求人
APP开发教程:浅谈APP登录的逻辑设计
谷歌也中枪!APP如何用正确姿势获取用户权限?
为什么国外的App 乃至互联网产品通常都很简陋?
不断换脸的豆瓣 App,在这一版回到了原点

精彩推荐

热门教程