• AIGC落地实战!「什么值得买」如何用Midjourney提高设计效率?

    UI交互 2023-04-27
    写在前面早在今年 2 月份,我们就通过 Midjourney 辅助设计,上线了专题 「从入门到行家-单板滑雪篇」。一开始上线还是比较忐忑的,因为对于 AI 的探索大家都刚刚起步,害怕通过 AI 生产的专题会遭到用户的反感。但后续得到数据验证,并未影响线上效果,并且还能大大提升团队的工作效率。

    写在前面

    早在今年 2 月份,我们就通过 Midjourney 辅助设计,上线了专题 「从入门到行家-单板滑雪篇」。一开始上线还是比较忐忑的,因为对于 AI 的探索大家都刚刚起步,害怕通过 AI 生产的专题会遭到用户的反感。但后续得到数据验证,并未影响线上效果,并且还能大大提升团队的工作效率。自此,正式开启了值得买 UED 的 AIGC 探索之旅。

    随着 AIGC 持续火热,值得买 UED 团队也一直在探索如何使用 AIGC 能力辅助设计团队快速落地日常项目。我们边探索边实践的过程中,目前找到比较好的应用场景主要有「专题头图」和「banner 模版」生成。

    往期案例:

    AIGC落地实战!有赞如何用Midjourney提高设计效率? 一、项目背景 设计界总是一波未平一波又起,从区块链到元宇宙,这轮风开始吹到 AIGC,什么是 AIGC?

    阅读文章 >

    今天这篇文章主要给大家分享一下我们在「从入门到行家」这个重点栏目 IP 下,如何使用 Midjourney 帮助我们快速产出专题设计。

    「从入门到行家」系列专题,作为「什么值得买」的精品栏目之一,汇聚了各个行业优质的消费相关的内容。在 AIGC 辅助设计火爆之前,就已经形成了固定的视觉风格,也得到了用户的广泛认可。

    如何提高这个专题的设计效率,并保证统一的视觉风格,是我们一直在探索的问题。随着 AI 工具越来越强大,我们逐渐探索到了一些方法,并希望与大家一起分享学习。

    众所周知,一个专题从结构上看,可以分成顶部「头图」和下方「楼层」两个部分。

    在「入门到行家」这个专题头图中又可以粗略的分为三层元素,按照重要性从高到低,分别是标题、主体、背景。

    一、背景设计 背景是重要性最低的图,主要作用是烘托气氛,是最容易被 AI 直接完成的部分。

    以「从入门到行家」系列之潮流穿搭的专题头图为例。需求方想表现的是街头的潮流穿搭文化。这个时候用一张街拍图片做为背景再合适不过了。于是我在网上找的下面这张图,并简单处理一下。

    接下来用到了 Midjourney 的图生文功能。

    得到了以下提示词

    再加上网上收集的其他“咒语”

    得到如下图片

    虽然很多细节有问题,但是作为一张图背景图是够用的。最终完成的头图效果如下:

    二、主体设计 主体部分,我目前还是使用 Blender 进行制作。之所以不使用 Midjourney 原因如下:

    主体的人物形象作为这个系列专题的 IP 形象已经固定。而 Midjourney 的随机性较大,不适合生成固定的 IP 形象; 由于骨骼绑定、布料模拟等 3D 技术的加持,目前效率比在 Midjourney 里反复尝试更高。 但是,AI 技术是未来,相信它能很快克服这些问题。据说 Stable Diffusion 的可控性更高,接下来会进行尝试。

    三、标题设计 标题设计,目前基本上没有 AI 可以胜任。我推测原因有以下 2 点:

    设计字体,本质上是要创新,是要设计出没有出现过的形式,否则就是侵权行为。但是,AI 做的是学习海量的人类优秀作品,然后找出其中的规律,再应用这些规律来生成作品。所以,让 AI 以创新为目的来设计字体,它可能真的暂时做不到; 汉字的本质是有象征意义的抽象符号。汉字的每个笔划都有着严格的规范,稍有错误就完全不能接受。例如“土”和“士”,只是细微的笔画长短变化意思就完全不同。具象的物体就完全不同了,手指稍长或者稍短,如果要求不严,都是可以接受的。

    从上图可以看出,AI 总结出了汉字形式上的规律,但是生成的汉字没有一个是正确的。这方面很像艺术家徐冰的作品《天书》,只是形式上的汉字,却没有象征意义。如果想让它写正确,就需要 AI 把每个汉字都训练一遍,估计这个工作需要国内的公司来完成了。

    所以,我预测 AI 短时间对汉字的生成很难完成。看看会不会很快被打脸吧...

    四、楼层元素的设计 在楼层的元素设计中,我采用了另外一种方式来利用 AI,即对 AI 生成的图片进行深度修改。

    元素最终的应用效果如下:

    总结 Midjourney 的优点是快速、完成度高,缺点是可控性差。所以,目前我主要用它完成两方面的工作,一个是前期的灵感激发,另一个是重要性相对较低的背景图。在「从入门到行家」系列专题的设计中,这样做的效率提高约 10%到 20%。但是,在其他可直接使用 Midjourney 生成图作为头图的专题中,效率可以提升约 80%。

    如此大幅度地提高我们的工作效率,难怪比尔盖茨说 AIGC 的重要程度不亚于手机和互联网的诞生。我们会持续学习和探索 AIGC 在专题设计中的应用方式,并在这里与大家分享。

    欢迎大家关注我们微信公众号,一起在设计领域探索 AIGC,后续也会带来更多精彩内容。

    同时您还可以在小红书搜索「值得买 UED」关注我们,在那里我们会分享更多 Midjourney 实战咒语和教程。

    感谢您的阅读。

  • 打包下载!5款高质量的免费可商用英文字体推荐

    UI交互 2023-04-27
    大家好,这里是和你们聊设计的花生~最近又收集了一波免费可以商用的高质量英文字体,包括多种不同风格,而且都是免费可商用的,一起来看看吧往期回顾:打包下载!5款高质量的免费可商用英文字体推荐大家好,这里是和你们聊设计的花生~ 今天为大家推荐 5 款我最新收集的高质量英文字体,包含赛博朋克、优雅、圆润可爱、纤巧灵动等...

    大家好,这里是和你们聊设计的花生~

    最近又收集了一波免费可以商用的高质量 英文字体 ,包括多种不同风格,而且都是免费可商用的,一起来看看吧

    往期回顾:

    打包下载!5款高质量的免费可商用英文字体推荐 大家好,这里是和你们聊设计的花生~ 今天为大家推荐 5 款我最新收集的高质量英文字体,包含赛博朋克、优雅、圆润可爱、纤巧灵动等多个风格,而且都是免费可商用的哦~ 往期回顾: 一、Achron 字体设计师 Instagram 主页: https://www.instagram.co

    阅读文章 >

    一、FoxBot 字体 Behance 主页: https://www.behance.net/gallery/146133901/Foxbot-free-font-for-commercial-use

    FoxBot 是一款个性十足的手写笔刷字体,由艺术家 Syaf Rizal 设计,100% 免费供个人及商业使用。FoxBot 字体笔画粗细适中,清晰有力,笔触带有明显的飞白,有很强的手写质感;字体风格轻松洒脱,因为是全大写形式,所以适合用作大标题,适合与时尚潮流、体育运动有关的设计主题,也可以作为产品包装和 T 恤装饰图案的设计元素,能有效提升整体设计氛围和质感。

    海报设计如何更有个性?加上这个元素准没错!(附素材下载) 大家好,我是和你们聊设计的花生。

    阅读文章 >

    二、Pencil Child 字体 Behance 主页: https://www.behance.net/gallery/169029393/Penci

    Pencil Child 是一款圆润可爱的手写字体,依旧是由艺术家 Syaf Rizal 设计,100% 免费供个人及商业使用。它的字形并不规整,而是每个都有不同角度的轻微歪斜,因此混排后看起来也是歪歪扭扭的,就像小朋友写出来的一样自然可爱;笔画柔软俏皮,大小写字母之间强烈的负空间对比也让字体充满活力,适合与婴幼儿、甜品奶茶、生日派对有关的设计主题。

    三、Glitch Goblin 字体主页: https://ggbot.itch.io/glitch-goblin-font

    Glitch Goblin 是一款自带抖动故障效果的字体,由艺术家 GGBotNet 设计,基于 SIL 开放字体许可证,可以免费用于个人及商业用途。字体为全大写形式,适合用于大标题;自带屏幕故障造成的字体抖动效果,可以直接用在赛博朋克、游戏、潮流音乐等设计主题中。还可以多复制 2 份字体,填充不同的颜色并进行轻度位移,就能制作出类似抖音 Logo 那样的字体效果了。

    四、3D Isometric 字体主页: https://ggbot.itch.io/3d-isometric-font

    3D Isometric 是一款等距视角的立体英文字体,由艺术家 GGBotNet 设计,基于 SIL 开放字体许可证,可以免费用于个人及商业用途。字体为全大写形式,包含纯线框、半填充和全填充三种字形,它的字母可以作为图形化元素使用,或在 Ai 中拓展后做更个性化的编辑设计,这样就能直接作为海报或者画面中的主视觉。

    五、Coral Lovers 字体主页: Coral Lovers - Free Modern Ligature Serif on Behance

    Coral Lovers 是一款优雅现代的英文衬线体,由字体 设计师 Silver Stag 设计,可以免费用于个人和商业用途。相比于传统的英文衬线体,Coral Lovers 有多种连接词和备用字母,可以组合成不同的排版效果。字体气质优雅端庄,具有很强的装饰性,适合用在需要体现高端、奢侈、正式和品质感的设计主题中。

    以上就是本期为大家推荐的 5 款高质量英文字体,有需要的小伙伴可以到文末下载字体安装包。如果你想寻找其他风格的免费可商用英文字体,欢迎在评论区留言。喜欢本期推荐的话请大家多多点赞收藏进行支持,我会更有动力为大家推荐设计干货知识 ~

    推荐阅读:

    新手如何做好字体管理?快来看资深设计师的的4点建议 大家好,我是和你们聊设计的花生~ 与字体相关的话题一直都是社群小伙伴讨论的热点,比如免费可商用的字体哪里找、如何识别陌生字体并找到相应资源、下载的字体太多了有没有什么好的管理工具、字体版权范围如何弄清楚等。

    阅读文章 >

    告别商用焦虑!9 类设计师必备的高质量英文字体 大家好,这里是和你们聊设计的花生~ 不知不觉已经是 2022 年底了,最近为大家整理了一篇字体合集,包含了我从今年 3 月份开始收集的 9 类高质量的英文字体,涵盖经典、优雅衬线、纤细手写、粗犷笔刷、力量感等不同风格。

    阅读文章 >

  • 打包下载!5款高质量的免费可商用英文字体推荐

    UI交互 2023-04-27
    大家好,这里是和你们聊设计的花生~最近又收集了一波免费可以商用的高质量英文字体,包括多种不同风格,而且都是免费可商用的,一起来看看吧往期回顾:打包下载!5款高质量的免费可商用英文字体推荐大家好,这里是和你们聊设计的花生~ 今天为大家推荐 5 款我最新收集的高质量英文字体,包含赛博朋克、优雅、圆润可爱、纤巧灵动等...

    大家好,这里是和你们聊设计的花生~

    最近又收集了一波免费可以商用的高质量 英文字体 ,包括多种不同风格,而且都是免费可商用的,一起来看看吧

    往期回顾:

    打包下载!5款高质量的免费可商用英文字体推荐 大家好,这里是和你们聊设计的花生~ 今天为大家推荐 5 款我最新收集的高质量英文字体,包含赛博朋克、优雅、圆润可爱、纤巧灵动等多个风格,而且都是免费可商用的哦~ 往期回顾: 一、Achron 字体设计师 Instagram 主页: https://www.instagram.co

    阅读文章 >

    一、FoxBot 字体 Behance 主页: https://www.behance.net/gallery/146133901/Foxbot-free-font-for-commercial-use

    FoxBot 是一款个性十足的手写笔刷字体,由艺术家 Syaf Rizal 设计,100% 免费供个人及商业使用。FoxBot 字体笔画粗细适中,清晰有力,笔触带有明显的飞白,有很强的手写质感;字体风格轻松洒脱,因为是全大写形式,所以适合用作大标题,适合与时尚潮流、体育运动有关的设计主题,也可以作为产品包装和 T 恤装饰图案的设计元素,能有效提升整体设计氛围和质感。

    海报设计如何更有个性?加上这个元素准没错!(附素材下载) 大家好,我是和你们聊设计的花生。

    阅读文章 >

    二、Pencil Child 字体 Behance 主页: https://www.behance.net/gallery/169029393/Penci

    Pencil Child 是一款圆润可爱的手写字体,依旧是由艺术家 Syaf Rizal 设计,100% 免费供个人及商业使用。它的字形并不规整,而是每个都有不同角度的轻微歪斜,因此混排后看起来也是歪歪扭扭的,就像小朋友写出来的一样自然可爱;笔画柔软俏皮,大小写字母之间强烈的负空间对比也让字体充满活力,适合与婴幼儿、甜品奶茶、生日派对有关的设计主题。

    三、Glitch Goblin 字体主页: https://ggbot.itch.io/glitch-goblin-font

    Glitch Goblin 是一款自带抖动故障效果的字体,由艺术家 GGBotNet 设计,基于 SIL 开放字体许可证,可以免费用于个人及商业用途。字体为全大写形式,适合用于大标题;自带屏幕故障造成的字体抖动效果,可以直接用在赛博朋克、游戏、潮流音乐等设计主题中。还可以多复制 2 份字体,填充不同的颜色并进行轻度位移,就能制作出类似抖音 Logo 那样的字体效果了。

    四、3D Isometric 字体主页: https://ggbot.itch.io/3d-isometric-font

    3D Isometric 是一款等距视角的立体英文字体,由艺术家 GGBotNet 设计,基于 SIL 开放字体许可证,可以免费用于个人及商业用途。字体为全大写形式,包含纯线框、半填充和全填充三种字形,它的字母可以作为图形化元素使用,或在 Ai 中拓展后做更个性化的编辑设计,这样就能直接作为海报或者画面中的主视觉。

    五、Coral Lovers 字体主页: Coral Lovers - Free Modern Ligature Serif on Behance

    Coral Lovers 是一款优雅现代的英文衬线体,由字体 设计师 Silver Stag 设计,可以免费用于个人和商业用途。相比于传统的英文衬线体,Coral Lovers 有多种连接词和备用字母,可以组合成不同的排版效果。字体气质优雅端庄,具有很强的装饰性,适合用在需要体现高端、奢侈、正式和品质感的设计主题中。

    以上就是本期为大家推荐的 5 款高质量英文字体,有需要的小伙伴可以到文末下载字体安装包。如果你想寻找其他风格的免费可商用英文字体,欢迎在评论区留言。喜欢本期推荐的话请大家多多点赞收藏进行支持,我会更有动力为大家推荐设计干货知识 ~

    推荐阅读:

    新手如何做好字体管理?快来看资深设计师的的4点建议 大家好,我是和你们聊设计的花生~ 与字体相关的话题一直都是社群小伙伴讨论的热点,比如免费可商用的字体哪里找、如何识别陌生字体并找到相应资源、下载的字体太多了有没有什么好的管理工具、字体版权范围如何弄清楚等。

    阅读文章 >

    告别商用焦虑!9 类设计师必备的高质量英文字体 大家好,这里是和你们聊设计的花生~ 不知不觉已经是 2022 年底了,最近为大家整理了一篇字体合集,包含了我从今年 3 月份开始收集的 9 类高质量的英文字体,涵盖经典、优雅衬线、纤细手写、粗犷笔刷、力量感等不同风格。

    阅读文章 >

  • UI设计师如何用 Midjourney 生成界面?收下这份关键词总结!

    UI交互 2023-04-27
    目前国内外有很多热门的 AI 绘图工具,其中 Midjourney 是目前我觉得最容易上手的工具,对于完全不懂 AI 绘图、想试试看的新手来说,是很不错的入门选择。而且现阶段的 AI 已经能辅助进行设计,视觉效果相当吸睛。那么 UI/UX 设计师能用 Midjourney 加快哪些设计流程呢?

    目前国内外有很多热门的 AI 绘图工具,其中 Midjourney 是目前我觉得最容易上手的工具,对于完全不懂 AI 绘图、想试试看的新手来说,是很不错的入门选择。

    而且现阶段的 AI 已经能辅助进行设计,视觉效果相当吸睛。

    那么 UI/UX 设计师 能用 Midjourney 加快哪些设计流程呢?我们一起来通过具体的实操,从主体、配色、风格等方向探索 AI 在设计中的应用!

    更多实战案例:

    AIGC落地实战!「什么值得买」如何用Midjourney提高设计效率? 写在前面 早在今年 2 月份,我们就通过 Midjourney 辅助设计,上线了专题 「从入门到行家-单板滑雪篇」。

    阅读文章 >

    一、AI 设计指令 Midjourney 中没有固定的 Prompt(指令)来生成某种 APP,具体想要什么样的效果要多多尝试。

    如果没想好要输入哪些指令,可以先用这个指令模板:

    「ui design for [类型] application, mobile app, iPhone, iOS, Apple Design Award, screenshot, single screen, high resolution, dribbble」

    把里面的「类型」替换成你想设计的产品的关键词描述(英文),就能生成想要的 UI 设计图。来看看几个示例~

    1. 出行类

    关键词:「距离、车费、费用结算、优惠金额、地图」等。

    2. 餐饮类

    关键词:「介绍咖啡的特色、口味、咖啡豆产地、价格」等。

    3. 运动类

    关键词:「卡路里、步数、距离、某种运动」等描述。

    二、主体物指令 确定了产品类型后,如果还想更进一步突显产品的特色,可以在指令中加入主体描述来加强图片生成的效果。

    例如一个生鲜类 APP 想突显蔬果很新鲜,可以加上更多相关的关键词描述,例如「水果、蔬菜、新鲜」等,生成的图片看起来就会特别新鲜。

    电商类产品加上「模特实拍、商品列表、尺寸」等描述,就能得到一个常见的商品详情页设计图。

    三、配色指令 确定了 APP 类型和主体描述之后,还可以继续定制想要的主题色,配色方案可以试试这个指令:「xxx color scheme」。

    1. 餐饮类

    关键词:「beach style color」,就能生成一个沙滩风饮料订购页面,设计风格也很有意思。

    2. 快递类

    关键词:输入「Forest」指令,生成的图片会长很多树,有一种亲近自然的感觉。

    3. 生活服务类

    关键词:「glacier color scheme」,可以得到一个很有氛围感的订房界面。

    四、风格指令 如果只依靠输入配色指令无法满足你的要求,还可以指定某种艺术风格,甚至艺术家、设计师、插画家的名字。

    1. 天气类

    关键词:「Pop art」,一个色彩鲜艳配色大胆图案抢眼的波普艺术风格的天气 APP 就生成了。

    2. 社交类

    例如一个聊天类软件,输入关键词「K-pop fashion」,生成一个时尚流行的页面效果。

    输入「by Van Gogh」,就能得到一个带有梵高作品的 UI 页面。

    五、页面指令 如果想指定 AI 生成某个页面(首页、登录页等),只需要再加一段页面指令描述就可以,例如「landing page、Profile Page」。

    1. 社交平台

    关键词:「landing page」,一个社交平台的登录页设计就出来了。

    2. 信息类

    关键词:「Profile Page」,生成人力资源类产品的个人资料页,里面包含照片、自我介绍、基本信息等内容。

    最后 通过一系列的 AI 出图操作能发现,Midjourney 产出的设计图视觉效果都很不错,更适合在 APP 设计的初始阶段,例如头脑风暴和风格探索等过程中,为设计师提供更多灵感和创意。

    如果想让 Midjourney 产出的 UI 设计图直接落地开发,目前来看仍有一段距离,但按照 AI 现在的技术迭代速度,这个距离应该也不会太远…

    欢迎关注作者微信公众号:「Clip设计夹」

  • UI设计师如何用 Midjourney 生成界面?收下这份关键词总结!

    UI交互 2023-04-27
    目前国内外有很多热门的 AI 绘图工具,其中 Midjourney 是目前我觉得最容易上手的工具,对于完全不懂 AI 绘图、想试试看的新手来说,是很不错的入门选择。而且现阶段的 AI 已经能辅助进行设计,视觉效果相当吸睛。那么 UI/UX 设计师能用 Midjourney 加快哪些设计流程呢?

    目前国内外有很多热门的 AI 绘图工具,其中 Midjourney 是目前我觉得最容易上手的工具,对于完全不懂 AI 绘图、想试试看的新手来说,是很不错的入门选择。

    而且现阶段的 AI 已经能辅助进行设计,视觉效果相当吸睛。

    那么 UI/UX 设计师 能用 Midjourney 加快哪些设计流程呢?我们一起来通过具体的实操,从主体、配色、风格等方向探索 AI 在设计中的应用!

    更多实战案例:

    AIGC落地实战!「什么值得买」如何用Midjourney提高设计效率? 写在前面 早在今年 2 月份,我们就通过 Midjourney 辅助设计,上线了专题 「从入门到行家-单板滑雪篇」。

    阅读文章 >

    一、AI 设计指令 Midjourney 中没有固定的 Prompt(指令)来生成某种 APP,具体想要什么样的效果要多多尝试。

    如果没想好要输入哪些指令,可以先用这个指令模板:

    「ui design for [类型] application, mobile app, iPhone, iOS, Apple Design Award, screenshot, single screen, high resolution, dribbble」

    把里面的「类型」替换成你想设计的产品的关键词描述(英文),就能生成想要的 UI 设计图。来看看几个示例~

    1. 出行类

    关键词:「距离、车费、费用结算、优惠金额、地图」等。

    2. 餐饮类

    关键词:「介绍咖啡的特色、口味、咖啡豆产地、价格」等。

    3. 运动类

    关键词:「卡路里、步数、距离、某种运动」等描述。

    二、主体物指令 确定了产品类型后,如果还想更进一步突显产品的特色,可以在指令中加入主体描述来加强图片生成的效果。

    例如一个生鲜类 APP 想突显蔬果很新鲜,可以加上更多相关的关键词描述,例如「水果、蔬菜、新鲜」等,生成的图片看起来就会特别新鲜。

    电商类产品加上「模特实拍、商品列表、尺寸」等描述,就能得到一个常见的商品详情页设计图。

    三、配色指令 确定了 APP 类型和主体描述之后,还可以继续定制想要的主题色,配色方案可以试试这个指令:「xxx color scheme」。

    1. 餐饮类

    关键词:「beach style color」,就能生成一个沙滩风饮料订购页面,设计风格也很有意思。

    2. 快递类

    关键词:输入「Forest」指令,生成的图片会长很多树,有一种亲近自然的感觉。

    3. 生活服务类

    关键词:「glacier color scheme」,可以得到一个很有氛围感的订房界面。

    四、风格指令 如果只依靠输入配色指令无法满足你的要求,还可以指定某种艺术风格,甚至艺术家、设计师、插画家的名字。

    1. 天气类

    关键词:「Pop art」,一个色彩鲜艳配色大胆图案抢眼的波普艺术风格的天气 APP 就生成了。

    2. 社交类

    例如一个聊天类软件,输入关键词「K-pop fashion」,生成一个时尚流行的页面效果。

    输入「by Van Gogh」,就能得到一个带有梵高作品的 UI 页面。

    五、页面指令 如果想指定 AI 生成某个页面(首页、登录页等),只需要再加一段页面指令描述就可以,例如「landing page、Profile Page」。

    1. 社交平台

    关键词:「landing page」,一个社交平台的登录页设计就出来了。

    2. 信息类

    关键词:「Profile Page」,生成人力资源类产品的个人资料页,里面包含照片、自我介绍、基本信息等内容。

    最后 通过一系列的 AI 出图操作能发现,Midjourney 产出的设计图视觉效果都很不错,更适合在 APP 设计的初始阶段,例如头脑风暴和风格探索等过程中,为设计师提供更多灵感和创意。

    如果想让 Midjourney 产出的 UI 设计图直接落地开发,目前来看仍有一段距离,但按照 AI 现在的技术迭代速度,这个距离应该也不会太远…

    欢迎关注作者微信公众号:「Clip设计夹」

  • AIGC落地实战!「什么值得买」如何用Midjourney提高设计效率?

    UI交互 2023-04-27
    写在前面早在今年 2 月份,我们就通过 Midjourney 辅助设计,上线了专题 「从入门到行家-单板滑雪篇」。一开始上线还是比较忐忑的,因为对于 AI 的探索大家都刚刚起步,害怕通过 AI 生产的专题会遭到用户的反感。但后续得到数据验证,并未影响线上效果,并且还能大大提升团队的工作效率。

    写在前面

    早在今年 2 月份,我们就通过 Midjourney 辅助设计,上线了专题 「从入门到行家-单板滑雪篇」。一开始上线还是比较忐忑的,因为对于 AI 的探索大家都刚刚起步,害怕通过 AI 生产的专题会遭到用户的反感。但后续得到数据验证,并未影响线上效果,并且还能大大提升团队的工作效率。自此,正式开启了值得买 UED 的 AIGC 探索之旅。

    随着 AIGC 持续火热,值得买 UED 团队也一直在探索如何使用 AIGC 能力辅助设计团队快速落地日常项目。我们边探索边实践的过程中,目前找到比较好的应用场景主要有「专题头图」和「banner 模版」生成。

    往期案例:

    AIGC落地实战!有赞如何用Midjourney提高设计效率? 一、项目背景 设计界总是一波未平一波又起,从区块链到元宇宙,这轮风开始吹到 AIGC,什么是 AIGC?

    阅读文章 >

    今天这篇文章主要给大家分享一下我们在「从入门到行家」这个重点栏目 IP 下,如何使用 Midjourney 帮助我们快速产出专题设计。

    「从入门到行家」系列专题,作为「什么值得买」的精品栏目之一,汇聚了各个行业优质的消费相关的内容。在 AIGC 辅助设计火爆之前,就已经形成了固定的视觉风格,也得到了用户的广泛认可。

    如何提高这个专题的设计效率,并保证统一的视觉风格,是我们一直在探索的问题。随着 AI 工具越来越强大,我们逐渐探索到了一些方法,并希望与大家一起分享学习。

    众所周知,一个专题从结构上看,可以分成顶部「头图」和下方「楼层」两个部分。

    在「入门到行家」这个专题头图中又可以粗略的分为三层元素,按照重要性从高到低,分别是标题、主体、背景。

    一、背景设计 背景是重要性最低的图,主要作用是烘托气氛,是最容易被 AI 直接完成的部分。

    以「从入门到行家」系列之潮流穿搭的专题头图为例。需求方想表现的是街头的潮流穿搭文化。这个时候用一张街拍图片做为背景再合适不过了。于是我在网上找的下面这张图,并简单处理一下。

    接下来用到了 Midjourney 的图生文功能。

    得到了以下提示词

    再加上网上收集的其他“咒语”

    得到如下图片

    虽然很多细节有问题,但是作为一张图背景图是够用的。最终完成的头图效果如下:

    二、主体设计 主体部分,我目前还是使用 Blender 进行制作。之所以不使用 Midjourney 原因如下:

    主体的人物形象作为这个系列专题的 IP 形象已经固定。而 Midjourney 的随机性较大,不适合生成固定的 IP 形象; 由于骨骼绑定、布料模拟等 3D 技术的加持,目前效率比在 Midjourney 里反复尝试更高。 但是,AI 技术是未来,相信它能很快克服这些问题。据说 Stable Diffusion 的可控性更高,接下来会进行尝试。

    三、标题设计 标题设计,目前基本上没有 AI 可以胜任。我推测原因有以下 2 点:

    设计字体,本质上是要创新,是要设计出没有出现过的形式,否则就是侵权行为。但是,AI 做的是学习海量的人类优秀作品,然后找出其中的规律,再应用这些规律来生成作品。所以,让 AI 以创新为目的来设计字体,它可能真的暂时做不到; 汉字的本质是有象征意义的抽象符号。汉字的每个笔划都有着严格的规范,稍有错误就完全不能接受。例如“土”和“士”,只是细微的笔画长短变化意思就完全不同。具象的物体就完全不同了,手指稍长或者稍短,如果要求不严,都是可以接受的。

    从上图可以看出,AI 总结出了汉字形式上的规律,但是生成的汉字没有一个是正确的。这方面很像艺术家徐冰的作品《天书》,只是形式上的汉字,却没有象征意义。如果想让它写正确,就需要 AI 把每个汉字都训练一遍,估计这个工作需要国内的公司来完成了。

    所以,我预测 AI 短时间对汉字的生成很难完成。看看会不会很快被打脸吧...

    四、楼层元素的设计 在楼层的元素设计中,我采用了另外一种方式来利用 AI,即对 AI 生成的图片进行深度修改。

    元素最终的应用效果如下:

    总结 Midjourney 的优点是快速、完成度高,缺点是可控性差。所以,目前我主要用它完成两方面的工作,一个是前期的灵感激发,另一个是重要性相对较低的背景图。在「从入门到行家」系列专题的设计中,这样做的效率提高约 10%到 20%。但是,在其他可直接使用 Midjourney 生成图作为头图的专题中,效率可以提升约 80%。

    如此大幅度地提高我们的工作效率,难怪比尔盖茨说 AIGC 的重要程度不亚于手机和互联网的诞生。我们会持续学习和探索 AIGC 在专题设计中的应用方式,并在这里与大家分享。

    欢迎大家关注我们微信公众号,一起在设计领域探索 AIGC,后续也会带来更多精彩内容。

    同时您还可以在小红书搜索「值得买 UED」关注我们,在那里我们会分享更多 Midjourney 实战咒语和教程。

    感谢您的阅读。

  • 提升AI绘画质量!超多 Midjourney 关键词和参数大全

    UI交互 2023-04-26
    本文收集了 Midjourney 提升画面质量的关键词、参数和命令,让你产出更优质的AI绘画。更多MJ教程:如何用 Midjourney 轻松做出B端质感图?3分钟让你学会!

    本文收集了 Midjourney 提升画面质量的关键词、参数和命令,让你产出更优质的 AI绘画 。

    更多MJ教程:

    如何用 Midjourney 轻松做出B端质感图?3分钟让你学会! 一、Prompt 简介 Prompt 在 Midjourney 中扮演着重要的角色(不仅 Midjourney,其他人工智能语言生成领域都是),因为我们要通过它把我们的想法和意图输送给 AI,从而得到我们想要的设计图或图片。

    阅读文章 >

  • 用超多案例,帮你掌握「线」的10种设计表现手法

    UI交互 2023-04-26
    hi,我是鱼先生,专注平面视觉设计方向。前面我们讲了点的 8 种实战表现形式,今天来继续聊聊点线面中的线,前言不多说,直接开始干货吧。用超多案例,帮你掌握「点」的8种设计表现手法hi,我是鱼先生,专注平面视觉设计方向。

    hi,我是鱼先生,专注平面视觉设计方向。

    前面我们讲了点的 8 种实战表现形式,今天来继续聊聊点线面中的线,前言不多说,直接开始干货吧。

    用超多案例,帮你掌握「点」的8种设计表现手法 hi,我是鱼先生,专注平面视觉设计方向。

    阅读文章 >

    一、线的七情六欲,你都懂了吗? 视觉冲击力和设计感,一直是我们在 平面设计 中所追求的,而点、线、面就是我们经常所用到的设计三元素,线在我们生活中最为常见,你现在转头看看周边就可以看到无数的线元素。

    针对线的基础形式大家自行网络搜索就有很多,今天的重点就是跟着鱼先生来聊聊线的实际实战作用,我想这才是我们作为商业设计师必备的知识要点。

    先来聊聊不同的线会给我们带来什么样的感受和思考呢?

    一条线会因为不同的角度,从而让人产生不同的思考,水平放,看起来具备平衡感,给人以靠谱、稳定的感觉,右高左低,像上坡,感觉遇到了困难,左高右低,感觉下坡,垂直放,就感觉是一个间隔,比如像一堵墙,堵住了你的去路。

    我们稍微改变一下这个图片,加点趣味性,再看一下:

    上图,从上到下我加了一点小的元素,第一个是两个小孩玩跷跷板,第二个是人生成长期,很累但记得要坚持,第三个低谷期,以后你一定会感谢你人生过去的每一个低谷,第四个,大家都玩过的游戏,磁铁隔物吸,相比于第一张图是不是更加生动了些呢?

    但有一点,当你的元素越直接,那么想象力肯定会趋近于单一,为什么会有这样的感触呢?

    首先,人们会因为固有的知识形态而产生直接联想,意思就是当你看到一件事物的时候,如果这个东西你比较熟悉,那么自然有记忆,然后也会加以联想,比如第一张元素不多,就是线条,想象空间会更大一些,第二张图片,我添加了具体的元素之后,你的想象力就会被局限在我添加的元素之上,这也体现了我们作为设计师的重要作用。

    在设计工作中,图片和文字都会有这样的效果,比如“把 1000 首歌装进口袋”,这句广告语大家再熟悉不过了,是乔布斯发布第一代 ipod 的广告语,非常的具备想象力,在 20 多年前,任何人都会吃惊或者好奇如何把 1000 首歌放进口袋,当观众们惊奇、好奇的时候,这个时候从口袋掏出 ipod,那就起到了非常好的发布效果。

    同样的,图片视觉也具备这样的效果,比如当我们看到下面这张图片,你会怎么样?答案不言而喻,你感觉酸到流口水了,对吗?

    鱼先生说:视觉达到感官刺激,从而引发消费者产生不同的状态、心理,甚至是消费欲望,而我们作为设计师,就是要学会利用看不见的信息和思维,再利用一些设计手法和设计元素,把想法和文案变为视觉呈现,然后更好的表现出商业设计所需要的作用。

    比如现在我们看到的横线,上面已经分析过了,接下来我们就直接看一些应用案例:

    我们看到上面找了几张案例,里面都运用到了横线,比如第二张设计图,下面加了一条横线之后,会显得整个画面平衡、稳重,如果没有那两条线,会觉得这个人是没有重心的,要滑到的感觉,你自己可以在 PS 里面尝试去掉两条线看一下效果。

    再看第一张正方形边缘本身就是线的切割,所以有一种简单、稳当的感觉;第三张是线构成的书架,横竖线交叉所以更平稳,总体来讲,横线给人的感觉就是平衡、稳重,如果这条横线有性格的话,那么他做事一定会果断且靠谱。

    线条的倾斜,对比横线的平衡就更加的具备变化了,所以无论是左倾斜还是右倾斜,也会起到“破局”的作用。

    比如上图第三张设计作品就很明显了,黑暗中的一束光,打破了黑暗,给足了希望,另外就是针对这样的斜线运用的时候,我们可以看到都会在基本对称的角度上添加文字或元素进行补充,这样的作用就是为了“抑制”,或者说填补了横线的平衡属性,利用文字或元素与倾斜角度的搭配,让整个画面看起来比较平衡,但同时这样的平衡又比横线的平衡多了太多的画面张力。

    无论是左倾斜还是右倾斜,和我上面讲的道理都相同,所以这点我就不重复了。

    这里重点讲一下第三张,这种是文字倾斜加短线,然后组成整体的斜线,同时还保持了文字的阅读性,右上角补充文案信息增加平衡性,给人一种自由的规则感,字符本身就是自由、凌乱的,所以这种设计画面一般来讲,如果设计把握不好,很容易适得其反,这里有个忠告就是,千万不要为了炫技而失去商业设计的本质需求,在达到功能性的基础上,尽可能的美观,这便是商业设计的美学价值。

    竖线的感觉对比横线,少了一些稳重感,但多了一些倔强和反叛感,甚至还能让我感觉到,那种随时都要分道扬镳的感觉,哈哈。

    竖线也很容易掌握画面的平衡性,而且具备很强的分割性,比如第二、三张设计作品,很明显可以看出分割带来的视觉感,如果把竖线看作是有生命力的人物,那么竖线的性格杀伤力肯定要大于横线,横线属于稳重、修行派,而竖线则属于有点疯狂的极端派,看下第一张作品,中间的负空间形成了一条隐藏的竖线,文字全部靠近这个竖线,整个版面对称构图,看上去比较稳定,但同时因为中间的线是负空间,从而也显得有些活泼性元素在里面。

    这里要记住,同样的属性,每条线的运用或多或少都有,只不过是看那个要强那个要弱,这就好比两个人,一个人温柔,另一个人凶狠,但对于温柔的人来讲,你触犯他底线试一试?有一句话就是老实人发火,一般人承受不了,那么对于凶狠的人,同样也会有温柔的一面,这种理论对比于线的不同角度上,同样适用。

    二、“找不到”的线,大有作用 以上都是中规中矩的线的运用,那么线的运用有很多方面,要讲的话估计一万字都无法讲的完整,所以我们挑选一些实战性强的、常用的来给大家讲解一下。

    比如还有一种常用的线元素,就是曲线:

    曲线的运用比较综合,适应性很强,它就像是一个向往自由的孩子,随心所欲,而且非常的具备张力,它可以在需要打破僵局的时候破局而出。

    比如我们看上图第二张设计作品,下面的一个人顺着一个曲线往上爬,就增加了这张画面的故事性、张力,再看第三张,首先我们知道在点线面中两点一线,点多成面,画面中把琴键弯曲变成了一个字母 J,然后线条排列整齐,但通过弯曲的线整体看起来又具备韵律感。

    回过来看下第一张,把文字进行混合设计,细看是文字,远看就是一条条文字组成的曲线,上面的文字是给你阅读的,而上面的文字作为符号图形的存在,是为了表达整张画面的张力,也可以说明让你不要限制,尽情自由的发挥创作吧。

    那么类似这样的元素形成的线表现形式也有很多,比如下面案例:

    第一张,各种元素组成一列,形成线,就像我们生活中的排队一样,也是一种线的表现,这种方式具备了引导性、跳跃性,人们会不自觉的跟着作品的元素排列进行视觉移动,接下来分别是拉链形成的线,马路形成的线,植物的脉络形成的线,大家都可以多观察一些,结合实际设计需求去应用。

    再继续看些案例,加深理解:

    看似无规则实际有规则的曲线表现形式,根据产品自身的属性去思考,比如前两张的雪碧海报,用线的形式去表现那种喝完之后很爽的感觉,仅仅通过简单的抽象线条表现出来了。

    隐形但存在的线

    当然,还有一种线我并没有提起,那就是“隐形但存在的线”,比如海平线、地平线、天际线等,我们分别看看几个案例掌握一下吧。

    前两张是原研哉操刀的无印良品,比较出名,利用了地平线、海平线来设计,这种海报主要是传达品牌理念,如果你是刚开始的小品牌,根本没人知道你是谁的阶段,不建议这样去表现。

    后面的两张,左边红色帷幕的是海平线,右边是地平线,通过天空与陆地之间的分割,会给人一种视野开阔的感觉,画面感很广,这样的表现重点就是整体透视比较广阔从而形成了大场景,所以看上去比较辽阔,视觉冲击力比较强。

    前面我写过一篇教程,视觉冲击力有 3 宝,星空、爆炸、强透视,而上面看到的几张就是具备了强透视的特性,特别是最后一张通过产品大小摆放而造成的强透视感觉,从而形成强烈的视觉冲击力。

    [link https://www.uisdc.com/graphic-design-dimensio]

    线的张力和趣味性

    这一点实际上在本篇文章中已经提到过了,不过觉得比较有趣,并且实用性也很强,所以单独再点一下,让大家记得更清楚一些。

    上面的 3 张作品中,第 1 张和第 2 张思考点是一样的,都是通过一个物体对线进行了一定的触发之后产生的效果,第 2 张更明显,图中一个人在冲浪,通过线条的律动方向从而表现出了在海上的感觉,这种表现形式也经常被使用在我们的设计中。

    最后一张通过线的排列和透视,增加了画面的视觉冲击力,线在这里就具备了张力和速度感。

    线的错位表现

    线的使用还有一种形式就是会形成错位感,如下图设计作品:

    我们常用的一种错位表现方式就是线的分割,比如第二张就是利用横线的切割,然后人物的错位调整,让整个画面的视觉感看上去比较强烈,而第一张,就是利用折纸的效果,来做出错位的参差感,但是一定要注意,炫技的同时一定要注意文字的识别性。

    我们继续来看上面第 3 张作品,海平面以上和以下形成一条分割线,上下之间产生一种视觉错位感,从上面去看是一座小岛,殊不知已经进入了危险之中,对吗?

    如果是做海洋冒险海报的元素背景也是可以的,这种能够给人很大的想象空间,实际上就是通过海平面分割了上与下的一个错位感,但基于人的想象力,又会把这个熟悉的事物看作是一个整体,从而增加趣味性和视觉感。

    再加上天空与海之间的冷暖色彩对比,让整个画面活跃起来了,海和天空本身就都属于大场景画面,你想到海和天空,都会想到无边无际,这就是它们的特性,即使我们不去想,它已经存在于我们的潜意识里,既表现了人们的自由追求,又表现了危险可能随时在你身边,这就是设计的魅力。

    线的作用还有很多,比较简单熟知的,线的连接性、线的间隔性等,这些都比较简单,在设计中经常被使用,在这里就不作案例分析了。

    三、引申:设计与万物的联系 那么以上针对线元素,鱼先生带着大家学习了很多的设计方法及思考,学习再多最后都是为了使用,以及通过学习打开大家的思维。

    当你有了一定的感悟之后,也会清晰地发现,万物都可以成为我们的设计元素!

    在设计中我们需要去了解人们想看到什么,也就是消费者需求,或者干脆就直接用猎奇的方式抓住消费者的注意力,就像一开头提到的“把 1000 首歌装进口袋”,那么如果换一句话:“能够下载 1000 首歌的 Mp3”,那么我相信广告效益会大打折扣,所以别小看任何一种创意形式。

    还是跟着鱼先生在一些案例中加深理解一下:

    我们观察到上面几组案例,有公益作品,有商业作品,里面基本都用到了我们平面构成的基础知识,比如影构、分割构成、渐变构成、拟人形式等,希望大家可以多开拓思维,在这里鱼先生就不给大家多找案例了,大家自己平时要多看、多分析、多实践应用。

    写在最后 我经常说,设计师要多去了解人与人之间的联系,人与万事万物之间的联系,这会给我们带来很多的灵感积累,同时我们也要把基础知识打牢固,因为我们很多的创意来源都是以基础知识为基本而产生的。

    商业设计师需要遵循一些规则逻辑,并且在这些基础规则上,让商业设计具备更好的功能表达,最终产生更好的传播和商业价值。

    当然了,对于线的应用并不是单一的,我在讲解的时候进行拆分是为了让大家更好地理解,大家在具体的使用中,要根据具体情况来应用。

    正如设计的基础法则非常重要一样,你一定要去学习这些基础与规则,想要突破规则就先要了解规则,这也凸显了基础的重要性。

    OK,今天的设计教程就到这里,下期见!

    欢迎关注作者微信公众号:「摆渡鱼生」

  • 用超多案例,帮你掌握「线」的10种设计表现手法

    UI交互 2023-04-26
    hi,我是鱼先生,专注平面视觉设计方向。前面我们讲了点的 8 种实战表现形式,今天来继续聊聊点线面中的线,前言不多说,直接开始干货吧。用超多案例,帮你掌握「点」的8种设计表现手法hi,我是鱼先生,专注平面视觉设计方向。

    hi,我是鱼先生,专注平面视觉设计方向。

    前面我们讲了点的 8 种实战表现形式,今天来继续聊聊点线面中的线,前言不多说,直接开始干货吧。

    用超多案例,帮你掌握「点」的8种设计表现手法 hi,我是鱼先生,专注平面视觉设计方向。

    阅读文章 >

    一、线的七情六欲,你都懂了吗? 视觉冲击力和设计感,一直是我们在 平面设计 中所追求的,而点、线、面就是我们经常所用到的设计三元素,线在我们生活中最为常见,你现在转头看看周边就可以看到无数的线元素。

    针对线的基础形式大家自行网络搜索就有很多,今天的重点就是跟着鱼先生来聊聊线的实际实战作用,我想这才是我们作为商业设计师必备的知识要点。

    先来聊聊不同的线会给我们带来什么样的感受和思考呢?

    一条线会因为不同的角度,从而让人产生不同的思考,水平放,看起来具备平衡感,给人以靠谱、稳定的感觉,右高左低,像上坡,感觉遇到了困难,左高右低,感觉下坡,垂直放,就感觉是一个间隔,比如像一堵墙,堵住了你的去路。

    我们稍微改变一下这个图片,加点趣味性,再看一下:

    上图,从上到下我加了一点小的元素,第一个是两个小孩玩跷跷板,第二个是人生成长期,很累但记得要坚持,第三个低谷期,以后你一定会感谢你人生过去的每一个低谷,第四个,大家都玩过的游戏,磁铁隔物吸,相比于第一张图是不是更加生动了些呢?

    但有一点,当你的元素越直接,那么想象力肯定会趋近于单一,为什么会有这样的感触呢?

    首先,人们会因为固有的知识形态而产生直接联想,意思就是当你看到一件事物的时候,如果这个东西你比较熟悉,那么自然有记忆,然后也会加以联想,比如第一张元素不多,就是线条,想象空间会更大一些,第二张图片,我添加了具体的元素之后,你的想象力就会被局限在我添加的元素之上,这也体现了我们作为设计师的重要作用。

    在设计工作中,图片和文字都会有这样的效果,比如“把 1000 首歌装进口袋”,这句广告语大家再熟悉不过了,是乔布斯发布第一代 ipod 的广告语,非常的具备想象力,在 20 多年前,任何人都会吃惊或者好奇如何把 1000 首歌放进口袋,当观众们惊奇、好奇的时候,这个时候从口袋掏出 ipod,那就起到了非常好的发布效果。

    同样的,图片视觉也具备这样的效果,比如当我们看到下面这张图片,你会怎么样?答案不言而喻,你感觉酸到流口水了,对吗?

    鱼先生说:视觉达到感官刺激,从而引发消费者产生不同的状态、心理,甚至是消费欲望,而我们作为设计师,就是要学会利用看不见的信息和思维,再利用一些设计手法和设计元素,把想法和文案变为视觉呈现,然后更好的表现出商业设计所需要的作用。

    比如现在我们看到的横线,上面已经分析过了,接下来我们就直接看一些应用案例:

    我们看到上面找了几张案例,里面都运用到了横线,比如第二张设计图,下面加了一条横线之后,会显得整个画面平衡、稳重,如果没有那两条线,会觉得这个人是没有重心的,要滑到的感觉,你自己可以在 PS 里面尝试去掉两条线看一下效果。

    再看第一张正方形边缘本身就是线的切割,所以有一种简单、稳当的感觉;第三张是线构成的书架,横竖线交叉所以更平稳,总体来讲,横线给人的感觉就是平衡、稳重,如果这条横线有性格的话,那么他做事一定会果断且靠谱。

    线条的倾斜,对比横线的平衡就更加的具备变化了,所以无论是左倾斜还是右倾斜,也会起到“破局”的作用。

    比如上图第三张设计作品就很明显了,黑暗中的一束光,打破了黑暗,给足了希望,另外就是针对这样的斜线运用的时候,我们可以看到都会在基本对称的角度上添加文字或元素进行补充,这样的作用就是为了“抑制”,或者说填补了横线的平衡属性,利用文字或元素与倾斜角度的搭配,让整个画面看起来比较平衡,但同时这样的平衡又比横线的平衡多了太多的画面张力。

    无论是左倾斜还是右倾斜,和我上面讲的道理都相同,所以这点我就不重复了。

    这里重点讲一下第三张,这种是文字倾斜加短线,然后组成整体的斜线,同时还保持了文字的阅读性,右上角补充文案信息增加平衡性,给人一种自由的规则感,字符本身就是自由、凌乱的,所以这种设计画面一般来讲,如果设计把握不好,很容易适得其反,这里有个忠告就是,千万不要为了炫技而失去商业设计的本质需求,在达到功能性的基础上,尽可能的美观,这便是商业设计的美学价值。

    竖线的感觉对比横线,少了一些稳重感,但多了一些倔强和反叛感,甚至还能让我感觉到,那种随时都要分道扬镳的感觉,哈哈。

    竖线也很容易掌握画面的平衡性,而且具备很强的分割性,比如第二、三张设计作品,很明显可以看出分割带来的视觉感,如果把竖线看作是有生命力的人物,那么竖线的性格杀伤力肯定要大于横线,横线属于稳重、修行派,而竖线则属于有点疯狂的极端派,看下第一张作品,中间的负空间形成了一条隐藏的竖线,文字全部靠近这个竖线,整个版面对称构图,看上去比较稳定,但同时因为中间的线是负空间,从而也显得有些活泼性元素在里面。

    这里要记住,同样的属性,每条线的运用或多或少都有,只不过是看那个要强那个要弱,这就好比两个人,一个人温柔,另一个人凶狠,但对于温柔的人来讲,你触犯他底线试一试?有一句话就是老实人发火,一般人承受不了,那么对于凶狠的人,同样也会有温柔的一面,这种理论对比于线的不同角度上,同样适用。

    二、“找不到”的线,大有作用 以上都是中规中矩的线的运用,那么线的运用有很多方面,要讲的话估计一万字都无法讲的完整,所以我们挑选一些实战性强的、常用的来给大家讲解一下。

    比如还有一种常用的线元素,就是曲线:

    曲线的运用比较综合,适应性很强,它就像是一个向往自由的孩子,随心所欲,而且非常的具备张力,它可以在需要打破僵局的时候破局而出。

    比如我们看上图第二张设计作品,下面的一个人顺着一个曲线往上爬,就增加了这张画面的故事性、张力,再看第三张,首先我们知道在点线面中两点一线,点多成面,画面中把琴键弯曲变成了一个字母 J,然后线条排列整齐,但通过弯曲的线整体看起来又具备韵律感。

    回过来看下第一张,把文字进行混合设计,细看是文字,远看就是一条条文字组成的曲线,上面的文字是给你阅读的,而上面的文字作为符号图形的存在,是为了表达整张画面的张力,也可以说明让你不要限制,尽情自由的发挥创作吧。

    那么类似这样的元素形成的线表现形式也有很多,比如下面案例:

    第一张,各种元素组成一列,形成线,就像我们生活中的排队一样,也是一种线的表现,这种方式具备了引导性、跳跃性,人们会不自觉的跟着作品的元素排列进行视觉移动,接下来分别是拉链形成的线,马路形成的线,植物的脉络形成的线,大家都可以多观察一些,结合实际设计需求去应用。

    再继续看些案例,加深理解:

    看似无规则实际有规则的曲线表现形式,根据产品自身的属性去思考,比如前两张的雪碧海报,用线的形式去表现那种喝完之后很爽的感觉,仅仅通过简单的抽象线条表现出来了。

    隐形但存在的线

    当然,还有一种线我并没有提起,那就是“隐形但存在的线”,比如海平线、地平线、天际线等,我们分别看看几个案例掌握一下吧。

    前两张是原研哉操刀的无印良品,比较出名,利用了地平线、海平线来设计,这种海报主要是传达品牌理念,如果你是刚开始的小品牌,根本没人知道你是谁的阶段,不建议这样去表现。

    后面的两张,左边红色帷幕的是海平线,右边是地平线,通过天空与陆地之间的分割,会给人一种视野开阔的感觉,画面感很广,这样的表现重点就是整体透视比较广阔从而形成了大场景,所以看上去比较辽阔,视觉冲击力比较强。

    前面我写过一篇教程,视觉冲击力有 3 宝,星空、爆炸、强透视,而上面看到的几张就是具备了强透视的特性,特别是最后一张通过产品大小摆放而造成的强透视感觉,从而形成强烈的视觉冲击力。

    [link https://www.uisdc.com/graphic-design-dimensio]

    线的张力和趣味性

    这一点实际上在本篇文章中已经提到过了,不过觉得比较有趣,并且实用性也很强,所以单独再点一下,让大家记得更清楚一些。

    上面的 3 张作品中,第 1 张和第 2 张思考点是一样的,都是通过一个物体对线进行了一定的触发之后产生的效果,第 2 张更明显,图中一个人在冲浪,通过线条的律动方向从而表现出了在海上的感觉,这种表现形式也经常被使用在我们的设计中。

    最后一张通过线的排列和透视,增加了画面的视觉冲击力,线在这里就具备了张力和速度感。

    线的错位表现

    线的使用还有一种形式就是会形成错位感,如下图设计作品:

    我们常用的一种错位表现方式就是线的分割,比如第二张就是利用横线的切割,然后人物的错位调整,让整个画面的视觉感看上去比较强烈,而第一张,就是利用折纸的效果,来做出错位的参差感,但是一定要注意,炫技的同时一定要注意文字的识别性。

    我们继续来看上面第 3 张作品,海平面以上和以下形成一条分割线,上下之间产生一种视觉错位感,从上面去看是一座小岛,殊不知已经进入了危险之中,对吗?

    如果是做海洋冒险海报的元素背景也是可以的,这种能够给人很大的想象空间,实际上就是通过海平面分割了上与下的一个错位感,但基于人的想象力,又会把这个熟悉的事物看作是一个整体,从而增加趣味性和视觉感。

    再加上天空与海之间的冷暖色彩对比,让整个画面活跃起来了,海和天空本身就都属于大场景画面,你想到海和天空,都会想到无边无际,这就是它们的特性,即使我们不去想,它已经存在于我们的潜意识里,既表现了人们的自由追求,又表现了危险可能随时在你身边,这就是设计的魅力。

    线的作用还有很多,比较简单熟知的,线的连接性、线的间隔性等,这些都比较简单,在设计中经常被使用,在这里就不作案例分析了。

    三、引申:设计与万物的联系 那么以上针对线元素,鱼先生带着大家学习了很多的设计方法及思考,学习再多最后都是为了使用,以及通过学习打开大家的思维。

    当你有了一定的感悟之后,也会清晰地发现,万物都可以成为我们的设计元素!

    在设计中我们需要去了解人们想看到什么,也就是消费者需求,或者干脆就直接用猎奇的方式抓住消费者的注意力,就像一开头提到的“把 1000 首歌装进口袋”,那么如果换一句话:“能够下载 1000 首歌的 Mp3”,那么我相信广告效益会大打折扣,所以别小看任何一种创意形式。

    还是跟着鱼先生在一些案例中加深理解一下:

    我们观察到上面几组案例,有公益作品,有商业作品,里面基本都用到了我们平面构成的基础知识,比如影构、分割构成、渐变构成、拟人形式等,希望大家可以多开拓思维,在这里鱼先生就不给大家多找案例了,大家自己平时要多看、多分析、多实践应用。

    写在最后 我经常说,设计师要多去了解人与人之间的联系,人与万事万物之间的联系,这会给我们带来很多的灵感积累,同时我们也要把基础知识打牢固,因为我们很多的创意来源都是以基础知识为基本而产生的。

    商业设计师需要遵循一些规则逻辑,并且在这些基础规则上,让商业设计具备更好的功能表达,最终产生更好的传播和商业价值。

    当然了,对于线的应用并不是单一的,我在讲解的时候进行拆分是为了让大家更好地理解,大家在具体的使用中,要根据具体情况来应用。

    正如设计的基础法则非常重要一样,你一定要去学习这些基础与规则,想要突破规则就先要了解规则,这也凸显了基础的重要性。

    OK,今天的设计教程就到这里,下期见!

    欢迎关注作者微信公众号:「摆渡鱼生」


让你的品牌快速脱颖而出,抢占市场份额,提升销量
免费获取方案及报价
*我们会尽快和您联系,请保持手机畅通