Hybrid设计--核心交互

普通网页中跳转使用a标签,这里我们要对跳转进行更多的干预,所以将全站的跳转收口到框架层,用forward去实现。拒绝用a和window.location。如果我想对所有跳转做一个处理,开动画或者对跳转做一个统计,统计打点,这里如果用a或者window.location会很不好做,要做好收口。
location.href = "url" 页面中很多这种跳转,如果说需要对所有跳转做个统计,就需要找到每个href然后打点。这样是很不好的。如下这样做就好得多。

例如在写定时器的时候,我们也不会直接用,而是进行一下封装。在清掉定时器的时候可以全部清掉,还要自己封装,否则只能清一个。


back:hybrid与浏览器中的行为保持一致就可以。
back在webview中会检查记录,如果大于1就后退,否则就返回上一步操作。
history乱了:支付成功后点击后退,我们不希望回退到订单填写页面。以下有解决方案,看公司需求在选择不同方案

Native Path化:
H5页面都有自己的链接到这个页面,Native也会有但是也不一定,Native在做的时候没有考虑到一个页面有多少页。Native在列表页的时候可能就把订单填写页和产品详情页的信息全都请求下来,这样他在产品详情页的时候就不需要再请求数据。这是H5和Native不一样的地方,H5在列表页跳转到产品详情页的时候就要重新请求数据,H5在产品详情页的时候可能会做各种入口页或者落地页。举例来说:我们在搜索引擎上搜索产品详情页,我们的产品列表也可以过去,或者手机里的短信链接也可以到产品详情页,或者点击某个广告进入。这里如果,进入的入口不同,所展示的页面逻辑不同的话,就会更复杂一些。这里我们需要的是让Native页面也有path链接,让每一个页面都有一个path映射。好处:1、H5可以到任何一个Native页面2、H5这里有一套统一打点的机制的话,Native页面path化的话,这就更好处理了。

频道的入口点有一个疑惑:
例如在频道有ABCD4个入口,其中ABC是需要完成某种通用验证才能访问,比如登录和实名制才能访问。这就有2种做法:第一种:Native不关注,因为里面是H5的页面,H5做健全,如果是他没有登录的话,直接跳转到登录页面。登陆成功再跳回H5的页面。第二种:Native关注整个设计,在访问H5页面前先访问登录,如果成功了再访问H5页面。
H5能做的就H5做,H5做不了的Native做。如果是全局性的业务,又出于体验的话可以Native做。这里最好H5做,因为ABC需要验证可能需要改动,又需要其他验证,如果改动,Native就要改了。如果我们要细致到频道里面入口里面,因为频道自己关注自己样要干什么,Native不一定要关注到某个业务频道里要做什么事情,这时还是H5自己做比较好。
体系化:
例如:H5唤起了一个登陆,登陆中做了很多事情,可以跳到一个H5页面或者Native页面,这些都是可以设置的。如果都能跳过去,说明整个跳转体系已经相通了。
Hybrid设计--核心交互的更多相关文章
- Hybrid设计--账号体系的建设
前后端分离:开发效率高,没有SEO 现在是重客户端设计:交互和业务逻辑是前端来写,适合做前后端分离.对前端更友好,提高了效率. 传统模式开发:整个业务逻辑是server端写,不适合做前后端分离.ser ...
- 设计师们做UI设计和交互设计、界面设计等一般会去什么网站呢?
明明可靠颜值吃饭,却偏偏要靠才华立身,UI设计师就是这样一群神奇的物种.面对“大的同时小一点”.“五彩斑斓黑”.“下班之前给我”……这些甲方大大刁钻的需求,设计师每天都在咬牙微笑讨生活.你可以批评我的 ...
- Django项目:堡垒机(Linux服务器主机管理系统)--02--02堡垒机设计后台交互程序
#main.py #本文件写所有的连接交互动作程序 #————————————————02堡垒机设计后台交互程序 开始———————————————— from django.contrib.auth ...
- 前端的UI设计与交互之布局篇
布局是页面构成的前提,是后续展开交互和视觉设计的基础.设计者在选择布局之前,需要注意以下几点原则:明确用户在此场景中完成的主要任务和需获取的决策信息.明确决策信息和操作的优先级及内容特点,选择合理布局 ...
- 前端的UI设计与交互之字体篇
跨平台的字体设定,力求在各个操作系统下都有最佳展示效果.字体是界面设计中最重要的基本构成之一,用户通过文本来消化内容和完成工作,优雅的字体将大大提升用户的阅读体验及工作效率.在满足不同终端始终保持良好 ...
- 前端的UI设计与交互之设计原则篇
1.亲密性 a)纵向间距示例这三种规格分别为:8px(小号间距).16px(中号间距).24px(大号间距). b)在这三种规格不适用的情况下,可以通过加减『基础间距』的倍数,或者增加元素来拉开信息层 ...
- 开发辅助 | 前端开发工程师对 UI设计、交互设计的认知
1.UI 用户界面 UI:User Interfase 用户界面 UID:User Interfase Designer 用户界面设计师,多指移动 app 的界面设计: 2.一个合格的 UI 设计师, ...
- 游戏数值——LOL篇 以LOL为起点-说游戏数值设计核心思路
附 文 文档在今年三月份我动笔写了一小部分,但当时思路凌乱,行文梗阻,于是丢在一边构思了半年,现在又回过头来慢慢写,希望能写好写完吧,初衷是希望即时萌新也能看懂,但是好像并不能行——本 ...
- 前端的UI设计与交互之反馈示篇
为了帮助用户了解应用当前要做什么,也给用户的下一步行为做参考,以及了解操作后所产生的结果 ,当用户和系统需要交互时,使用不同的模式来反馈信息或结果.当设计者使用反馈或者自定义一些反馈时,请注意:为用户 ...
随机推荐
- 蓝桥杯_算法训练_区间k大数查询
问题描述 给定一个序列,每次询问序列中第l个数到第r个数中第K大的数是哪个. 输入格式 第一行包含一个数n,表示序列长度. 第二行包含n个正整数,表示给定的序列. 第三个包含一个正整数m,表示询问个数 ...
- [No0000163]卷福、神秘博士和一群老戏骨表演群口相声:To be or not to be该咋念,简直高潮迭起
'To be or not to be, that is the question',<哈姆雷特>中这句经典台词到底应该怎么念? 这是古今无数哈姆雷特演员最爱琢磨的问题,一千个人就 ...
- python 过滤掉字符串中的回车符与换行符(\t\n)
我们在文本数据预处理前,要将数据统一整理成需要的格式,其中有回车(\t)或者(\n)符号,会对我们的数据保存有影响,那么就需要将其过滤掉. 比较简单的方法,用replace()将这些符号替换为空,一定 ...
- splash 安装
搞定NVIDIA显卡后,开始弄splash 根据 https://github.com/paperManu/splash 提示 最简安装就是用apt sudo apt install flatpak ...
- 使用XPath对象解析xml文件
使用XPath对象解析xml文件 1.DocumentBuilderFactory类 工厂API,使应用程序能从XML文档获取生成DOM对象树的解析器 其构造方法受保护,用newInstance() ...
- dp进阶——饥饿的奶牛
饥饿的奶牛oj上n只有1000,过于水,O(n^2)的算法很容易水过,洛谷上这是一道提高加的题,很难啊,所以要好好拿来练习今天写博客再次复习一下,oi最怕遗忘了. 这道题呢实质是一个区间覆盖的dp,首 ...
- 关于javascript中defineProperty的学习
语法 Object.defineProperty(obj, prop, descriptor) 参数 obj 要在其上定义属性的对象. prop 要定义或修改的属性的名称. descriptor 将被 ...
- zabbix准备:mysql安装
php在编译时需要mysql的配置,这样PHP远程连接mysql才有用.1.创建mysql用户和相关目录(配置文件里设置的目录) groupadd mysql useradd -g mysql -M ...
- 图解HTTP笔记
http 0.9 1990年 http 1.0 1996年 Tcp/Ip分层模型 应用层: 如Ftp Http DNS. 传输层: 如 TCP UDP .将报文分成报文段.“传输”指的是端对端( ...
- 嵌入式Qt4.8.0支持ttf字库,并显示中文
引言 最近在做QT项目发现中文没法显示,于是百度QT嵌入式显示中文,基本上提示的都是把ttf字库转换为QPF(QT专门支持二进制的),发现这个qpf本身制作就很麻烦,按照网上的做法实实在在来了一边,发 ...