温岭页面设计:H5移动端页面设计

作者:台州市久谦网络科技有限公司 浏览: 发表时间:2021-07-07 10:16:37

温岭页面设计:H5移动端页面设计

一、字体

建议最小不要超过18,其他字号双数,同种类别下用同个字号

二、排版

在有限的手机屏幕空间内,我们积累的经验告诉我们最好的效果是简单集中,最好有一个核心元素,中心元素不宜过多,突出重点为最优。相较而言,越左边的排版会越容易引起关注。这是因为我们懒惰的大脑里最初看到这种简洁排版会立刻出现“嗯 我可以马上看完不费劲”的潜意识信息而带着轻松的态度去阅读。

三、动效

1.前期跟前端设计师进行沟通,讨论页面中元素的动效呈现。例如一些元素的位移,旋转,翻转,缩放,逐桢,淡入淡出,粒子效果,照片处理等等,还有3D展示效果。 

2.背景动效其实比较推荐缓动效果,例子:星空中一闪而过的流星,间歇性出现不抢主角风头再好不过了。

3.复杂多变的动效不一定是好的,要考虑到加载速度等用户体验问题。

四、音效

1.考虑到用户使用场景的多样性,那种介绍类的如果要加背景音乐,尽量不要太粗暴。有一点循序渐进最好,给用户留时间在骚扰别人之前可以关闭。或者可以在开始时是关闭状态。但做游戏h5页面的时候,音乐可以没有关闭开启按钮,因为用户对接下来发生的事是有预知的。

2.考虑每一页音乐按钮放置的明显性。如果能用其他页面元素去替代音乐符号作为按钮也是极好的。

五、交互

1.展示型:有很多种不同的交互方式,最常见的是翻页,这种方式制作起来相对简单,多用于展示一些新的产品,功能,或者活动介绍等。除了翻页以外,还有点击,输入文字,擦除屏幕,滑动屏幕等,玩法非常丰富。

2.游戏型:像是起初朋友圈红过的围住神经猫,或者是我们的“拍拍Jump”这类需要计算逻辑,得出分数或者结论的小游戏。

3.产品型:有一些H5是作为一个长期运营的产品存在的,用户的访问可能会更固定,比如微信里的购物页面等。

手机端之间:一般我们先用640X1136进行设计,参考线会标在960高的地方,主要元素最好不要过高以适配各种机型。其他安卓机器前端切图时可以适当拉伸,变化不会太大就不用每个进行适配。

响应式设计:页面的设计与开发应当根据用户行为以及设备环境(系统平台、屏幕尺寸、屏幕定向等)进行相应的响应和调整。具体的实践方式由多方面组成,包括弹性网格和布局、图片、CSS media query的使用等。

为不同电子设备单个布局,尽量使用纯色而非渐变

六、想法

被大众主流乐于分享的信息大概有这么几种:

1.最直接的利益驱动,分享有奖或者需要众筹等,

2.对自己有用并且也对周围人也会有新鲜感的信息,

3.自己参与游戏或者测试得到的结果。

不管是分享给朋友或朋友圈还是QQ对话,让用户主动去分享你的带有很大性质的广告意味的信息在自己的社交群体中,此条信息与自己相关并且别人也能参与进来当然是最理想的。

在我们设计一个H5页面时,很重要的一点就是站在自己的角度跳出来去看你做的东西,首先一点是你和你周围的人愿意转发分享这个东西吗?它有趣吗?它对其他人也是有用的信息吗?

对于展示型和互动型H5来说最重要的还是想法。对于设计师来说,也许他们给到我们的只有几行文字,那时候前期构思这个H5的时间有可能比真正做的时间还要长。


我们也会坚持去研究和尝试,不管是新技术,还是更有趣的营销方式,和大家共勉。


温岭页面设计:H5移动端页面设计
长按图片保存/分享

台州市久谦网络科技有限公司  版权所有

 Copyright © 2020 All Rights浙ICP备2020041870号-1 Reserved      网站地图

台州市久谦网络科技有限公司  版权所有 

Copyright © 2020 All Rights Reserved 浙ICP备1245789785号-1      网站地图

添加微信好友,详细了解产品
使用企业微信
“扫一扫”加入群聊
复制成功
添加微信好友,详细了解产品
我知道了
浙ICP备2020041870号