收藏本站 关于我们

一个血槽的诞生(含切图方式)(原创文章)

发布时间:2016-12-15 23:13:35   来源:PS教程   人气:0

前言:对于整个项目的设计工作量来说这一块也就是几十分之一的工作量,设计时间也不算长,但和程序的接触过程中还是多了些新的了解,在这里做一点分享给大家

对于整个项目的设计工作量来说这一块也就是几十分之一的工作量,设计时间也不算长,但和程序的接触过程中还是多了些新的了解,在这里做一点分享给大家,当然老手可以直接忽略了,毕竟这对你们来说只是皮毛而已!

---------------------------------------------------------------------------------------------------

先直接放张效果图大家看下了,其实就是两个条条……/(ㄒoㄒ)/~~


\


然后先大概介绍一下这个功能在项目中的作用和使用目的

1、是直播形式的综艺节目

2、节目中会分为A、B两队,在节目中进行话题讨论或游戏PK

3、观众(水友)在活动中可以随时对A、B两队进行投票(互冲形式)

4、PK血槽会随时出现或收起,节目中的现场会出现较多变换

备注:单纯的UI分享,所以只介绍血槽UI的设计和展现方式,其它项目细节都保密咯(*^__^*) !!


一、初步分析和问题

1、由于直播节目画面和录播或游戏完全不是一种形式,现场画面会变化较大,不太适合做纯游戏类型的UI血槽设计(透明和半透明区域较多),因为缺少修饰边缘,在有相近背景纯色的时候多会难以完整展现

2、每期嘉宾或阶段话题不一样,需要能够方便快速的更换头像和队名

3、UI组件中需要展现头像、队名、票数、平局、胜队、局数、

4、需要出现投票状态,让底层用户(免费礼物)也有更强的参与感


然后下面就是设计的基本样式了,其实线上的还增加了很多功能,这里都已隐掉,

血槽和头像边缘加了4像素渐变边,因为要避免直播环境繁杂变换,保持始终清晰可见。



然后在投票状态的时候,有一个问题出现“就是如果每次投一票光线运动的时间内,如果再连续投票是否要展现连续光线样式,是否会出现过大的视觉干扰”,在做出了动态效果展示后,基本的反应都是保留连击的光线流动效果会更好(会增加用户的点击欲望)!



\


999b584bbe5fa801219c77265c0a.jpg


---------------------------------------------------------------------------------------------------


特别备注:

1、项目前期和产品多沟通做到真正的了解项目目的,再在按流程模拟一遍,其实我也是在设计部同事那里学到了很多,很感谢张道成和马林两位同事;

2、不要100%依照产品的要求做,尽可能的在框架要求和规范内实现视觉更加完善展现,不然出来的设计,就很容易产品满意自己想吐;

3、对于设计的最终使用环境多对比分析,如这个血槽的描边用100%、80%、20%的透明度在深、浅和繁杂的环境下都会有不同的效果,没有哪个最好,只能选择更适合的!


好吧!本期Xiabibi就到这里了,感谢大家能够耐心看完,虽然我知道有很多人没看完就拖动到最后了/(ㄒoㄒ)/~~


本文来自PS教程网www.46PS.com,转载请注明!关键词:GUIGUI教程原创自译教程


PS教程