三端差异性对比
本文中提到的客户端为 ipad 端
产品体验差异
| 产品体验 | web 端 | 客户端(ipad) | 微信端(iphone) |
|---|---|---|---|
| 屏幕大小 | 最大 | 较大 | 适中 |
| 交互方式 | 光标点触 | 手指交互 | 手指交互 |
| 动作影响范围 | 很小 | 较大 | 较大 |
| 是否可以横屏 | 否 | 是 | 是 |
| 便携性 | 极差 | 适中 | 很好 |
| 开发人员配置 | 产品,服务器,前端, UI, 测试,运维 | 产品,服务器,UI,测试,运维 | 产品 服务器,测试,运维 |
| 持久化存储 | 极差 | 较好 | 较好 |
| 单一页面功能点 | 很多 | 较多 | 很少 |
| 交互流畅性 | 较好 | 非常好 | 适中 |
| 用户输入文字意愿 | 较高 | 较低 | 适中 |
| 用户使用出发点 | 不怕麻烦 | 方便使用 | 方便使用 |
硬件设施差异
| 硬件设施 | web 端 | 客户端(ipad) | 微信端(iphone) |
|---|---|---|---|
| 陀螺仪 | 不支持 | 支持 | 支持 |
| 加速传感器 | 不支持 | 支持 | 支持 |
| 光线传感器 | 不支持 | 支持 | 支持 |
| 支持 flash | 支持 | 不支持 | 不支持 |
| 支持 蓝牙 | 支持(隐藏较深) | 支持 | 支持 |
| 支持 GPS | 不支持 | 支持 | 支持 |
数据流向差异
web 端
PC上的浏览器 ---data---> 我们的服务器 ---data---> PC上的浏览器
客户端
http 通讯的情况下
客户端 ---data---> 我们的服务器 ---data---> 客户端
我们的服务器 ---data---> 苹果的服务器 ---data---> 客户端
微信端
手机上的微信端 ---data---> 微信服务器 ---data---> 我们的服务器 ---data---> 手机上的微信端
注:我们的服务器向主动和微信企业号通信,可以访问微信的接口,由微信服务器和微信客户端通信,原理都相似,就不画图了.
主要指导原则
客户端
宗旨:移动端更偏重体验!
关键词:[1]
- 遵从：UI能够更好地帮助用户理解内容并与之互动，但却不会分散用户对内容本身的注意力。
- 清晰：各种大小的文字应该易读，图标应该醒目，去除多余的修饰，突出重点，很好地突显了设计理念。
- 深度：视觉的层次和生动的交互动作会赋予UI新的活力，不但帮助用户更好理解新UI的操作并让用户在使用过程中感到惊喜。
引用自<iOS8设计规范>
原则:[2]
- 首先，去除了UI元素让应用的核心功能呈现得更加直接并强调其相关性。
- 其次，直接使用iOS的系统主题让其成为应用的UI，这样能给用户统一的视觉感受。
- 最后，保证你设计的UI可以适应各种设备和不同操作模式，这样用户可以在不同场景下舒适地享用你的应用。
特点:
- 客户端只要通过用户的触摸,拖拽来完成交互.
- 屏幕比较大.
- 便携性适中
原理:客户端是一个基于苹果公司的iOS操作系统上面的一个软件(进程),相对于 PC 来说,性能略差,不处理过于复杂的逻辑.所以需要和服务器来进行交互,如果把服务器比喻为数据的加工者,那么客户端就是数据采集以及数据展示者.当然客户端也可以有浏览器,只不过性能比 PC 上的浏览器略差,但是客户端的浏览器的独特之处在于他可以和客户端之间进行一些交互(比如点击客户端网页上的某个按钮,弹出客户端的提示框).
局限性
- 客户端的局限性是他的性能没有 pc 好
- 屏幕在功能设计上的局限性也是有的,这也是屏幕,体积的双刃剑
- 点触没有鼠标精准,这也是客户端本身的局限性,也是一把双刃剑
优点
- 交互性较强,手指操作灵活
- 便携,走到哪拿到哪
- 持久化存储方便,可以针对用户这个点,提升很强的定制化
14900839448012.jpg
web 端
宗旨:web 端相对比较偏功能和内容!
特点:
- web 端只要通过鼠标点击来完成交互
- 屏幕很大,鼠标较小,所以点击可以很精准.
- 便携性基本没有
原理: web 端是通过浏览器来对服务器进行交互的,其实 web 端的浏览器也是一个软件(进程),其功能强大,相比服务器,网页就是信息的采集者和展示者, web 端想和服务器交互有两种方式.
- html 通过http(短连接)来进行表单提交,服务端返回数据的时候,利用浏览器进行渲染.
- html 通过 js 来进行一些事件的驱动来让浏览器做一些事情,并发送 http(短连接)来和服务器进行交互,服务端返回数据的时候,利用js 和浏览器进行一系列事件的触发.
局限性
- pc 携带不便是他致命的弱点,谁没事拿着电脑到处跑啊?
- 通过网址来登录,没有点击就出现的效果好
- 复杂持久化存储机制不完善,开发者不能利用 web 端去给做一些针对用户个性化的持久化存储
优势
- 可以进行复杂的操作
- 屏幕大,看着很爽
web端的优势就是源于性能较好的 PC 端和强大的浏览器来和用户进行一系列较复杂的操作.
14900816447614.jpg
功能强大,一个界面布满所有功能.
微信端
宗旨:微信端设计更加轻量级,简单功能的完成,一些信息的传递.
特点:
- 微信端主要靠下面的选项栏和发消息(发送指定消息,返回给用户一些信息)来完成交互
- 屏幕较小
- 便携性较强
原理:前面我们提到,客户端是一个基于苹果公司的iOS操作系统上面的一个软件(进程),相对于 PC 来说,性能略差,那么微信端就是微信这个软件给一些公司提供的接口,微信的用户量较大,所以可以通过向一些有意向在微信上展示自己信息的公司收费,然后他们给我们提供接口,让我们可以再微信上展示一些我们自己的信息(按照他们的要求),所以微信端的开发是我们的后台开发人员通过他们的接口给腾讯的服务器提供数据,腾讯的服务器再去通知他们的客户端进行一些我们公司的信息展示
微信端的功能可以划分为两种
- 我们提供按照要求给他们服务器数据,他们服务器传递数据给微信,微信在他们的软件上进行一些展示(按照一种特定的形式)
- 我们给他们一个链接地址(web 端的页面),他们用软件内的浏览器进行一些展示.
局限性
- 既然使用别人的软件去展示你的信息,那么就要按照人家的规矩来.
- 目前微信提供的服务还不是很丰富,所以对业务展示来说,不能很好地支持,只能展示一些比较简单的信息.
优点
- 微信的用户基数大,让用户了解我们产品的代价较低,所以进行一些基本信息的展示效果很不错.可以通过新本信息去吸引用户去下载我们的 app
- 用户在接受我们信息的时候代价较低,人人都玩微信,获取我们信息很方便.
网友评论