常见科技风格分类

2021-10-19    ui设计分享达人

老板:给我来一套科技风,要炫酷,要眼前一亮的感觉

    你:好嘞~(叮叮当当咚咚当当)

    老板:哎呀,我要的不是这种太花了,不够高端

    你:给您改(叮叮当当咚咚当当)

    老板:哎呀,也不是这种太素了

    你:行,改....(我刀呢)


    没做过科技风格的新人缺乏对常见科技风格的了解,很容易根据甲方模糊的描述及要求,主观性的设计,还会在甲方要改的情况下十分委屈,我做的就是你描述的炫酷科技风啊。科技风格大类本身特征就是炫酷,眼前一亮的感觉,甲方没有了解只能粗略的表述。设计师主动了解市面常见的科技风格细分及其使用场景。就能够问出甲方爸爸更细化的需求,更客观的根据使用场景选择恰当的细分科技风,减少不断重改的成本。


FUI:

    FUI 就是 Fictional User Interfaces (Fictional GUI),就是 Fantasy User Interfaces,就是 Fake User Interfaces,就是 Futuristic User Interfaces,这些用户界面它们是科幻的,是未来派的,是奇幻的,是虚假的.观赏性大于实用性。

    并不是所有风格的FUI都适合应用于现实中,比如——半透明介质且信息复杂的的UI,只适合出现在影视作品里面(和一些视频游戏当中)。它们的表现性强,看起来复杂精密,但对于信息展示功能很弱。其存在的目的是更好的配合场景,不会遮挡演员的脸部。想想看主角对复杂的数据一顿操作猛如虎,让观众眼花缭乱,对主角更加崇拜。


1.商务科技风:

     精致、高端、轻质感;简约干净、形体线条精细;功能感强

     应用:

    车载UI;金融UI;各种科技工具类产品的登录注册或官网Banner;商务海报等

    特征:

    1.商务科技配色较为严肃,低调。背景以深蓝色,深灰色背景居多。

    2.元素的形状并不复杂、外轮廓整体规则,周围的细碎装饰较少。

    3.强调品质感,会模拟一些较为细腻玻璃、金属或哑光的微质感。对于光的使用较为克制,较少大范围的使用辉光,多在边缘使用较细的流光,看起来更加的犀利精致。

(偏商务科技风格例子-图片来源于网络)

2.扁平科技风:

    整体风格偏向机械、直观,其扁平特征是元素扁平纯色块或渐变,弱化图表空间感及体积感。多组扁平的数据可    视化图表,在空间层次的表现上更多是在同一平面上。

    非常适合多数据后台数据展示,强调信息数据的清晰展示,较多使用纯色面元素作为底板,减少了环境的背景外扰因素。且数据分组展示,功能分区明显。

    设计成本及实现成本较低,为目前大多数数据可视化大屏展示所选择。


(偏扁平科技风格例-图片来源于网络)

3.HUD(仪表盘)科技风:

    视觉多使用单色,点线元素。可以与现实背景结合度高。

    应用:

    电影(漫威系列FUI)、游戏、企业产品宣传视频、AR等展示型为主

    特征:

    1.颜色使用上单色居多,尤其多亮色白,亮色蓝,同色相多透明梯度变化。无质感或毛玻璃质感。

    2.简洁而不简单,层次丰富,典型风格HUD。空间层次感丰富,使用半透的结构线3D模型或晶格模型,显得轻        巧而精致,用户能够透过信息层看到场景层,

    3.极简科技风需要设计师把控好细碎元素的体量和数量,对信息不会进行过多的视觉干扰。

    ps:

   极简科技风数据的展示容量大于扁平科技风,看起来很复杂高端但通常实用性差。如果使用过多的数据,则显示    相似类型的图表展示相似的数据集在视觉上可能会缺乏新鲜感,但更易于理解和理解。具有不同的图表在视觉上是令人兴奋的,但用户需要花费更多时间阅读。


(偏极简科技风格例-图片来源于网络)

4.赛博炫酷科技风:

    赛博朋克又称数字朋克、网络朋克。

    应用:游戏、H5、运营banner配图等需要强视觉氛围的运营。代表电影如:攻壳机动队、头号玩家、银翼杀手等

    特征:

    1.张扬奇幻的娱乐感,技能风、故障风、视觉冲击强烈。常见元素:全息投影、义体、立体城市、高达机械元素  等。

    2.人造光是赛博朋克在视觉上最大的特征,背景暗色,常用荧光黄、紫、蓝、粉 、绿灯内外发光,模拟霓虹灯管自发光效果,重点元素高亮辉光。

    3.色彩冷暖撞色对比强烈,如:红蓝对比青紫对比黄橙对比等。

    4.数码屏幕与全息投影是霓虹灯的一种延伸,既能体现未来世界的高科技的感,也能体现出人造和虚拟的概念。部分元素前后叠影色彩错位,有频次的闪动,模拟电子科技的偶发故障。机械化IP形象和字体设计常见金属感和拼接感。

(偏赛博科技风格例-图片来源于网络)

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码ben_lanlan,报下信息,会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。

文章来源:站酷  作者:唐小葱

分享此文一切功德,皆悉回向给文章原作者及众读者.

免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务



日历

链接

个人资料

蓝蓝设计的小编 http://www.lanlanwork.com

存档