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设计与交互之反馈示篇
为了帮助用户了解应用当前要做什么,也给用户的下一步行为做参考,以及了解操作后所产生的结果 ,当用户和系统需要交互时,使用不同的模式来反馈信息或结果.当设计者使用反馈或者自定义一些反馈时,请注意:为用户 ...
随机推荐
- Android开发实战(申明:来源于网络)
Android开发实战(申明:来源于网络) 地址:http://so.csdn.net/so/search/s.do?q=Android%E5%BC%80%E5%8F%91%E5%AE%9E%E6%8 ...
- 在ASP.NET Core中实现自定义验证特性(Custom Validation Attribute)
这是我们在实际ASP.NET Core项目中用到的,验证用户名中是否包含空格. 开始是这么实现的(继承ValidationAttribute,重写IsValid方法): public class No ...
- CodeForces 1056E - Check Transcription - [字符串hash]
题目链接:https://codeforces.com/problemset/problem/1056/E One of Arkady's friends works at a huge radio ...
- [No0000177]详解/etc/profile、/etc/bash.bahsrc、~/.profile、~/.bashrc的用途
之前安装Linux的一些软件时,总要修改Linux的配置文件.当时也是一知半解.而且,网上有些安装教程,会说,修改配置文件后要重启Linux.但事实上是不需要重启的. Linux安装时可能要修改的配置 ...
- 查看CUDA和cuDNN的版本号
1.查看cuda版本 cat /usr/local/cuda/version.txt2.查看cudnn版本 cat /usr/local/cuda/include/cudnn.h | grep CUD ...
- OLW Test
第一篇使用Open Live Writer 发布测试. Code Insert: #include <stdio.h> main() { printf("Hello World! ...
- LeetCode 728 Self Dividing Numbers 解题报告
题目要求 A self-dividing number is a number that is divisible by every digit it contains. For example, 1 ...
- js面向对象、创建对象的工厂模式、构造函数模式、原型链模式
JS面向对象编程(转载) 什么是面向对象编程(OOP)?用对象的思想去写代码,就是面向对象编程. 面向对象编程的特点 抽象:抓住核心问题 封装:只能通过对象来访问方法 继承:从已有对象上继承出新的对象 ...
- AT2134 Zigzag MST 最小生成树
正解:最小生成树 解题报告: 先放下传送门QAQ 然后这题,首先可以发现这神奇的连边方式真是令人头大,,,显然要考虑转化掉QAQ 大概看一下可以发现点对的规律是,左边++,交换位置,再仔细想下,就每个 ...
- VB改写C#
1.VB的Val()函数 先从程序集中引入Microsoft.VisualBasic命名空间.不过,即便是引入了Microsoft.VisualBasic命名空间,还是不能直接使用像Val()这样的函 ...