2021-10-19 ui设计分享达人
老板:给我来一套科技风,要炫酷,要眼前一亮的感觉
你:好嘞~(叮叮当当咚咚当当)
老板:哎呀,我要的不是这种太花了,不够高端
你:给您改(叮叮当当咚咚当当)
老板:哎呀,也不是这种太素了
你:行,改....(我刀呢)
没做过科技风格的新人缺乏对常见科技风格的了解,很容易根据甲方模糊的描述及要求,主观性的设计,还会在甲方要改的情况下十分委屈,我做的就是你描述的炫酷科技风啊。科技风格大类本身特征就是炫酷,眼前一亮的感觉,甲方没有了解只能粗略的表述。设计师主动了解市面常见的科技风格细分及其使用场景。就能够问出甲方爸爸更细化的需求,更客观的根据使用场景选择恰当的细分科技风,减少不断重改的成本。
FUI 就是 Fictional User Interfaces (Fictional GUI),就是 Fantasy User Interfaces,就是 Fake User Interfaces,就是 Futuristic User Interfaces,这些用户界面它们是科幻的,是未来派的,是奇幻的,是虚假的.观赏性大于实用性。
并不是所有风格的FUI都适合应用于现实中,比如——半透明介质且信息复杂的的UI,只适合出现在影视作品里面(和一些视频游戏当中)。它们的表现性强,看起来复杂精密,但对于信息展示功能很弱。其存在的目的是更好的配合场景,不会遮挡演员的脸部。想想看主角对复杂的数据一顿操作猛如虎,让观众眼花缭乱,对主角更加崇拜。
精致、高端、轻质感;简约干净、形体线条精细;功能感强
应用:
车载UI;金融UI;各种科技工具类产品的登录注册或官网Banner;商务海报等
特征:
1.商务科技配色较为严肃,低调。背景以深蓝色,深灰色背景居多。
2.元素的形状并不复杂、外轮廓整体规则,周围的细碎装饰较少。
3.强调品质感,会模拟一些较为细腻玻璃、金属或哑光的微质感。对于光的使用较为克制,较少大范围的使用辉光,多在边缘使用较细的流光,看起来更加的犀利精致。
(偏商务科技风格例子-图片来源于网络)
整体风格偏向机械、直观,其扁平特征是元素扁平纯色块或渐变,弱化图表空间感及体积感。多组扁平的数据可 视化图表,在空间层次的表现上更多是在同一平面上。
非常适合多数据后台数据展示,强调信息数据的清晰展示,较多使用纯色面元素作为底板,减少了环境的背景外扰因素。且数据分组展示,功能分区明显。
设计成本及实现成本较低,为目前大多数数据可视化大屏展示所选择。
(偏扁平科技风格例-图片来源于网络)
视觉多使用单色,点线元素。可以与现实背景结合度高。
应用:
电影(漫威系列FUI)、游戏、企业产品宣传视频、AR等展示型为主
特征:
1.颜色使用上单色居多,尤其多亮色白,亮色蓝,同色相多透明梯度变化。无质感或毛玻璃质感。
2.简洁而不简单,层次丰富,典型风格HUD。空间层次感丰富,使用半透的结构线3D模型或晶格模型,显得轻 巧而精致,用户能够透过信息层看到场景层,
3.极简科技风需要设计师把控好细碎元素的体量和数量,对信息不会进行过多的视觉干扰。
ps:
极简科技风数据的展示容量大于扁平科技风,看起来很复杂高端但通常实用性差。如果使用过多的数据,则显示 相似类型的图表展示相似的数据集在视觉上可能会缺乏新鲜感,但更易于理解和理解。具有不同的图表在视觉上是令人兴奋的,但用户需要花费更多时间阅读。
(偏极简科技风格例-图片来源于网络)
赛博朋克又称数字朋克、网络朋克。
应用:游戏、H5、运营banner配图等需要强视觉氛围的运营。代表电影如:攻壳机动队、头号玩家、银翼杀手等
特征:
1.张扬奇幻的娱乐感,技能风、故障风、视觉冲击强烈。常见元素:全息投影、义体、立体城市、高达机械元素 等。
2.人造光是赛博朋克在视觉上最大的特征,背景暗色,常用荧光黄、紫、蓝、粉 、绿灯内外发光,模拟霓虹灯管自发光效果,重点元素高亮辉光。
3.色彩冷暖撞色对比强烈,如:红蓝对比青紫对比黄橙对比等。
4.数码屏幕与全息投影是霓虹灯的一种延伸,既能体现未来世界的高科技的感,也能体现出人造和虚拟的概念。部分元素前后叠影色彩错位,有频次的闪动,模拟电子科技的偶发故障。机械化IP形象和字体设计常见金属感和拼接感。
(偏赛博科技风格例-图片来源于网络)
蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码ben_lanlan,报下信息,会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务