UI设计中常见的Banner设计风格解析

来源:温州麦职教育 时间:2023-07-09

UI设计中,Banner设计是网页和移动应用界面中常见的元素之一。不同的Banner设计风格可以给用户带来不同的视觉效果和体验。本文将对UI设计中常见的Banner设计风格进行解析,帮助设计师了解每种风格的特点和适用场景,以便在设计中做出更有吸引力和效果的Banner。

无论什么设计我们都需要在设计之前确定banner设计的风格。刚开始可能很难找准需要的banner风格,首先跟大家分享banner的设计思路。对设计风格一定要了解,要学会分析作品风格,分析风格找到合适的设计方向是至关重要的,它决定了整个设计的走向。

UI设计中常见的Banner设计风格解析

了解需求:做任何设计的前提就是了解设计需求,只有弄明白需求方到底想要什么,我们才能少改几次稿。我刚参加工作的时候就没少吃这方面的亏,那时候刚进公司脸皮薄,别人让干啥就立马撸起袖子打开ps开始工作。不明白的地方也不敢问太多,怕打扰别人工作。事实证明,这种想法是多么大的错误。需要了解的需求大体可以总结成以下几个方面。

确定文案信息、素材、尺寸大小、投放的平台

一般接到设计需求的时候,文案和素材都是需求方确定好的。但是有的需求方会说,你可以根据你的设计需要,稍微改动文案信息。本人亲身经历,这句话真的是一个火坑。文案的不确定会严重的影响设计进程,你改得好,改得他们满意还好,如果不满意,那就面临着重做。除此之外,有时候我们可以从文案和素材里获取设计灵感,确定设计的风格。

确定banner是为了实现什么目的而设计

比如需求方给到的文案信息是「金秋助学」,我们需要了解金秋助学的对象是谁,是大学生还是小学生,这会影响风格的确定和设计元素的选择。还要了解需求方想要这个banner起到什么作用,是想让更多人参与到这个活动中来,还是想通过这个banner让更多人了解某某企业热心于慈善事业,提升企业的有名度和好感,只有确定这些才能确定你的设计风格。

询问需求方的建议

需求方在把这个需求给到我们之前,可能心里就已经有了自己的想法,如果我们在设计之前可以了解到,会很大的降低改稿次数。而且我们主动询问他们的意见,会让他们感觉到自己的想法受到了尊重,以后交流起来也会更愉快。但是有时候他们的想法用语言可能描述不出来,这个时候我们可以用「情绪板」的方法,快速的获取视觉信息。

确定设计时间

如果时间很紧张,就尽量选择不易出错的板式和风格,如果时间比较充裕,可以细细打磨设计作品,多尝试一些以前没尝试过的表现方法。

根据需求确定设计风格:banner的设计风格可以拿人作为比对很好理解。有人外向,有人内敛。而这两种人的穿衣风格和举止言行在生活中也是不尽相同。和人难过会用哭表现,高兴会用笑表现一样,不同的设计风格,也对应不同的表现方法。下面我们主要分析不同的设计风格对应的表现方法,及给大家安利的一些可参考使用的素材,觉得有用的同学别忘了做下笔记。

关键词:文艺、气质、素雅、安静

比较明显的特点就是留白,大量的留白。

字体多采用宋体这样的衬线体,除一级标题字号略大些,其他的文案都非常小,给人精致的感觉。

色彩以灰白色系为主,其他的色彩饱和度和纯度低,明度高。

这类banner多运用在茶、棉麻制品、以简洁为特色的家居用品上。

点缀物多用细线条。

关键词:高冷、时尚

高冷的banner就和高冷的你一样,比较大的特点就是话少,一般就几个字。

用色大多采用黑白灰。

素材图一般都很大,突出细节,大牌的东西对自己的品质还是很有信心的,所以他们会放大放大再放大他们的细节,唯恐你们看不到。

很少运用点缀物,直接一张产品细节放大图,放几个字,就是这么自信。

关键词:传统、中国风、意境

字体采用书法字体,文案多用竖形排版、从右向左的顺序,因为古人是这样写字的。

可以选用的素材有印章,中国山水画,墨迹,扇面,剪纸,园林窗格,古纹样,祥云,京剧,卷轴等等。

关键词:青春、活力、年轻

很突出的一点就是模特都很年轻很有活力。

色彩的饱和度和纯度比较高。

排版你可以随便玩。

关键词:可爱、甜美

可爱风格的banner比较突出的特点就是他的字体,多采用少年字体、手写字体、卡通字体。

点缀物多使用卡通小元素,以手绘和矢量图为主,比如星星,云朵,短线条等。

色彩上多使用暖色调,营造软萌的感觉。

关键词:节日、促销、热闹

色彩丰富,红、黄、紫偏多,画面饱满,很少留白。

主标题很大,多用刚硬,棱角,夸张有视觉冲击力的字体。

可以用到的点缀物有光效、鞭炮、舞台、灯光、五彩的渐变、冲击性的线条和多边形等。

关键词:未来、科技

科技类的banner概括来讲就两个要点,科技感的文字+科技感的背景图,g级一点的还包括科技感的小点缀。

用色以蓝,黑色,紫等冷色调为主,画面给人硬朗,空间感,速度和力量的感觉。

可以用到的点缀物有光效、金属效果、线条、光点,宇宙等。

关键词:严肃、规矩、党

因为我们伟大的毛 喜欢红色,所以党喜欢红色,所以政府类的网站也好,banner也好,大多都会采用红色,点缀色多为蓝色黄色,字体多选用端庄古典的衬线体或中国风味浓厚的毛笔字体。

可以用的背景和点缀物有红旗、城市背景、党徽、英雄雕塑、故宫、石狮子等。

关键词:手绘风

把手绘风格单拿出来是因为它真的很好用,而且很常用到。

手绘风格可以用在文案上。产品本身也可以用手绘的形式,如上图左一,简单的几笔就让整个画面一眼就能看懂,而且充满乐趣。手绘风格用的比较多的是点缀物,通过不同手绘风格的点缀物营造不一样的氛围。

设计的风格该是多种多样的,要是被局限住了很难设计出满意的作品,但是,基础不好UI设计小白肯定是要从了解UI设计基础知识开始的,一步一步练习形成自己的设计思路,最后熟能生巧,快速设计出符合需求的设计作品。就像一些UI设计中常见的Banner设计风格,其他设计风格一定是熟知才能更好的传达信息。

新闻资讯

办公软件卡顿严重,除了重装还有其他优化方法吗?

2026-01-05

Excel文件有水印,但在线预览时不显示怎么解决?

2026-01-04

跨设备登录微软账号,验证后仍要求输入未知PIN怎么办?

2026-01-04

OneDrive个人保管箱快捷键被禁止,如何恢复使用?

2026-01-03

新电脑激活OfficeHome2024时提示“无法设置帐户”怎么办?

2026-01-03

PPT批量修改字体时,部分艺术字不生效怎么处理?

2026-01-02

Office2024文件图标被改为365图标,怎么改回原样?

2026-01-02

如何用PPT制作支持图片上传的互动课堂测验?

2026-01-01

PPT中嵌入的Excel表格,怎么设置才能编辑后不跑版?

2026-01-01

手机端编辑PPT时,无法插入本地图片怎么解决?

2025-12-31

热门问答

邬女士 提了一个问题 2026-01-10
麦职教育的室内设计课程怎么样?有实战项目教学吗?
学员您好。麦职教育的室内设计课程注重理论与实践结合,课程中包含多个真实户型案例和实战项目教学,让学员在模拟项目中锻炼设计能力,提升就业竞争力。欢迎前来咨询课程实战内容!
金女士 提了一个问题 2026-01-05
麦职教育的设计课程会教PS、AI等软件吗?
学员,您好!麦职教育的设计课程核心内容包括Photoshop、Illustrator等主流设计软件的系统教学,从基础工具到高级技巧,让您熟练掌握软件操作,为设计工作打下坚实基础。如果您有需要,可以致电获取软件学习详情!
凤先生 提了一个问题 2025-12-31
想学习UI设计,麦职教育的课程适合零基础小白吗?
学员您好!麦职教育的UI设计课程专门为零基础学员设计,从设计基础讲起,循序渐进到界面设计和交互逻辑,老师会手把手教学,确保小白也能轻松入门。欢迎您前来咨询更多课程详情!
皮小姐 提了一个问题 2025-12-26
麦职教育有平面设计的培训课程吗?
学员您好,感谢您对麦职教育的关注。我们开设有系统的平面设计培训课程,涵盖设计理论、软件操作和实战项目,帮助学员掌握从创意到落地的完整设计技能。如果您有需要,可以致电获取专属课程大纲!
姚 提了一个问题 2023-08-16
浙江麦职会计实操课怎么样?
您好,浙江麦职会计实操课程由多年经验的教学经验老师负责授课。授课内容包含建账、凭证、明细账、总账等全套教学内容,并提供多个领域的实操。教材也是有经验丰富的老师进行研发,为了方便学生学习,还开设出了无纸质化考试复习题,和模拟考试系统。在授课过程中不仅有工作经验丰富的会计教做账,更有专职教师在一旁实时跟进,随时解答你不会的会计税务问题。除了传统的教学模式,还会让学员到企业中进行实操,通过真实场景,进行模拟教学,强化学员的会计实操能力。想学习会计实操,浙江麦职是一个不错的选择哦!

Copyright © 郑州为学信息技术有限公司版权所有 豫ICP备2022015557号 Powered by 乐问乐学