没有美术基础,如何在iPad上做出有设计感的图片?

首先,这不是一个专业设计教程,本教程适合那些没有设计经验又渴望设计出赏心悦目内容的人,特别是考虑到这篇可能成为一系列iPad轻设计的第一篇入门,门槛更要低一些,这次只讲最简单的,只需要你拥有一台iPad甚至只是一台手机,就拥有了另外一种人生(当然不是键盘侠的人生)!

接下来就讲讲我、一个不是摄影师,更不是设计师的三线城市网管,没有任何正规培训,尝试着用iPad这种非专业工具,做出一些具有设计感的内容。

温馨提示:

先略微讲讲个人的分析,在我一个野生尝试设计者的理解里,做出一些有设计感的图片,往往有两种风格或者说趋势:极简和写实。

极简在实战应用上来说,就是提取事物的最主要特征,省略不重要的细节以大量的纯色区域代替,如果仅仅是简单,是很容易做到的,你只需要打几个字、选择几个字体、或者画几个简单的图形、大量的留白,但是我认为这不属于极简。

像非常纯粹的极简类的平面设计我个人认为目前是不太适合商业上的应用,更多的时候,优秀的商业设计是极简和写实兼而有之,这样会更有视觉张力,所以就引出了下一个话题:设计写实效果。

写实,在平面设计中要凭空创造写实可以运用3D渲染方面的软件,不过这个门槛较高,对于普通人也并非必要,实际上使用PS类软件就能实现非常棒的效果,完全可以满足日常需要,那么,作为入门选手,如何实现写实的效果呢?最初级的应该是塑造层次感,而塑造层次感最简单直接的办法就是阴影效果的运用,不过说阴影可能不准确,比较准确的表述应该是明暗。

思路:遮罩的原理也很简单,就是物体前后关系,后面物体的光线无法穿透前面的物体,一般最佳途径是用图层实现,但是有些平面图片里的元素是一整个平面,没有图层关系,所以添加其他一些元素的层次感,添加后面的物体就需要通过擦除前面物体的部分来实现。

步骤:

首先,我们要确定选择的背景图片是否需要处理。例如我选择了这张手机拍摄的图片作为背景,我们需要大致预判一下,加什么样颜色的字符合图片基调,这里我计划把字加在图片正中,采用白色字体,但是由于正中位置也是灰白色,所以我可能会用两种方案突出字体效果:给字体加阴影,或者将图片亮度降低。

尝试以后发现给字体加阴影后依然不是很凸显,所以我采取了后者——降低图片亮度。注意这个降低亮度和拉曲线不同,是将整个画面亮度等值降低,有两种方法。

第一种是直接使用系统相册app内置的照片编辑功能。这个很简单,在相册中点开图片,点图片右上角的编辑,在编辑界面中找到「曝光」,将滑条拉到你认为合适的数值就好。

由于系统相册的照片编辑功能亮度调节的幅度不是很大,有时可能满足不了一些特殊需求,所以就要用到第二种方法。

将这个图层选择填充黑色,并将透明度拉低至合适。然后导出图片。

将导出的图片继续导入Phonto,添加文本,输入你的文字,这里我选择了一个Futura字体的变体1,将文本排版居中对齐。

点「移动」,可以看到有横向和竖向的自动居中按钮,各点一下就完全居中了,文字需要与画面语义内容有所重叠,注意既要有所重叠又要保证文字内容的可识别度。

这一步就到了呈现设计感的抹除遮罩了,将选项菜单右划,看到有一个「Erase」选项,点进去,有一个提示,大致意思是抹除遮罩后就不能作为字体来编辑了,实际上就是被「栅格化」的意思,点继续。

你可以一边放大画布一边缩小笔刷,并提供了撤销上一步操作的选项。

注意,屏幕上有两个小点,为了防止手指遮挡,你的指尖或者笔尖点击屏幕的位置并不是抹除的笔刷位置,那个与你指尖触点有一定距离的空心圆才是。按图片透视抹除需要的区域点击「完成」后导出图片就得到了一张略有设计感的图片。

更多样例:

当然,你还可以做得更好一些,比如下面的方法。

思路:在简单遮罩的基础上,你可以融入一些写实的质感,而这时Phonto这种便捷的App就无法满足高度定制的要求了,这时我们就要引入那个很多数码艺术家都听说过的Procreate,对于许多入门绘画的人,这个工具强大而友好,不仅是绘画,YouTube和B站上的大量视频博主已经证明这款软件在设计方面的价值。

选取和观察一张图片素材的构图,选择合适的位置添加文字,这张我决定在上一个教程的基础上更进一步,做出树叶遮挡文字的阴影。

步骤(如果有ApplePencil就赶紧用上吧):

在开始之前有一点需要注意,Procreate设计初衷是为了绘画,所以它并不是一款为设计量身定做的App,其中图层中的素材在画布上调整完成后不会保持原始分辨率,会在缩小后适应画布的分辨率,当你再放大分辨率还是缩小后的,而且调整后超过背景边缘的区域会裁掉。所以入门选手注意规避它的这种限制就好,学习能力强的也可以使用AffinityPhoto来制作,图层逻辑是一样的。

导入图片,左上角第一个图标(「图库」右侧)里的「添加-添加文本」,选择合适的字体,这里我选择的是NEUTRA的变体。

将文字移动到与树叶的重叠处,然后隐藏文字图层。

选择叶子所在的图层,点击左上角第三个「选区」图标,点底栏第一个「自动」选项。

然后点住文字和叶子的重叠处并左右滑动,调节选区阈值,这个阈值其实就是根据算法的自动抠图,我们只需让选区中包含树叶遮住文字的区域就够了,选择好后点一下图层。

再显示文字图层,再点一下文字图层,然后选择菜单栏里的「清除选区」,这就是直接抠好图了,基本不需要像Phonto那样的手动擦除。

这一步就是实现阴影。重复上面的「选区」步骤,然后新建一个图层,选择黑色,点击图层,菜单栏中选择填充图层。

再结合选区工具和清除选区将多余和错误的区域清除,只留下大致包含树叶和文字重叠的部分。然后将这个黑色填充图层移至文字图层上方。

为了让阴影符合空间关系,这里还需要将阴影图层设置为文字图层的剪辑蒙版,点选图层的菜单栏中选择剪辑蒙版,这样阴影就只会投在文字上。

然后选择界面左上角第二个「调整」图标中的「高斯模糊」,左右滑动选择模糊程度,这张图我调整到20%左右。

用「移动」工具将阴影图层稍微下移。这段文字的遮罩+阴影就完成了。重复同样的方法制作下一个文字效果就可以了。

在这里补充一点,实现相同效果,图层逻辑可以有很多种,在这里我选择的是一种较为简便的作法。当然,为了更进一步,你也可以让部分文字在最上一层,形成前景中景后景的关系。

思路:其实实现这个都是很简单的技巧,无非是直接抠图,或者利用图层和混合模式之类的,关键不在于实现的技巧,而是在于构思上:文字内嵌的内容要与文字的结构协调,这就要考验你的创造力了。

譬如这个iPadPro的简单例子,首先我用手机拍摄了背景图,然后我在Procreate的画布上尝试各种角度,发现圆形摄像头放在P字的内圈正好可以联系起来,另外我还想形式上更好一点,于是我又重拍一张将笔直的ApplePencil放置在字母R的竖线笔划上的图,形成呼应,但是由于位置不好掌控,于是我干脆选择将ApplePencil抠出来移动到合适的位置。

首先导入背景图层,然后添加一个图层,填充稍微有点灰度的亮色。

再添加一个文本图层,输入文本,因为是方形构图,三个字母,所以这里我选择的字体是较为瘦长的FranklinGothic的变体,居中放置(可以开启「绘图指引」辅助对齐)。

然后就是呈现设计感的一步,点击文本图层选择菜单栏中的「选择」,就相当于字体部分作为选区。

再选择下面的纯色图层,在菜单栏中选择清除图层,将上面的文本图层隐藏,再次选择下面已经抠除PRO字样的纯色图层。

再用橡皮擦将字母P的内圈抹去,为的是下一步对齐摄像头的位置,然后通过调整iPad那张照片的大小角度,找到最合适的位置,最重要的是摄像头对应字母P的内圈,然后我尽可能地让iPad的左侧线条切在字母P的下方倒角上,这样的细节会给强化构图的和谐感。

再添加ApplePencil图层并抠图,基本上就完成了这张图的主体。最后可以选择性加点说明文字或者某些修饰性元素。

这时还可以更进一步,通过给字体内部添加阴影实现内嵌效果,怎么做呢?也很简单,选择那张抠除文字的纯色图层,点菜单栏的「选择」。

然后新建一个图层,调色盘选为黑色,点菜单栏中的填充图层,将图层移动到抠除文字的纯色图层下方,再使用前面说过的高斯模糊,然后将透明度调到合适。

最后使用「移动工具」将图层向右下方略微移动一些。

思路:霓虹灯看似是单色光,但设计出来同样要讲究层次,一般而言,霓虹灯在黑夜中才能体现出来,基于现实来设计就方便很多,所以背景当然需要很暗才能衬出光晕,中间灯柱实体部分是最亮的,甚至在相机曝光中常常呈现出白色,并不是我们想象中的彩色,外围一圈光晕则呈现光线本来的颜色,利用Phonto提供的功能,我决定做一层纯色描边,然后在描边外围再做一层羽化过渡。

在文字样式的编辑器中找到「间距」,将下面第一行的中文字间距拉大一些。按照前文关于Phonto的操作方法将文字横向居中,纵向按照两行字纵向整体居中的原则调整到合适位置。

开始制作霓虹效果,文字可以选择白色或者一些亮色,文本样式编辑器中「边缘」选择一个相比亮色较暗的颜色,这里我将「幅」调整为5。

然后「暗影」最下面一栏选择最后一个图标,将模糊调整到一个合理的范围,注意,这个边调边观察,这里我选择最大值,这个霓虹字体就完成了。

下面的中文也是重复上面的方法,中文我觉得可以选择一个撞色,我选择了冷蓝,这里需要注意的是,我个人感觉这个冷蓝的「边缘」蓝色的明度要比「暗影」略低一点,这样看起来舒服一些。

思路:这个也很简单,遵循光线的原理就能很好的塑造出效果,直接实现那种纯色的长阴影不成问题,但是我想更让画面更有冲击力,让阴影存在一定的渐变或许会不错,不过由于这款小众App的设计缺陷,实现渐变阴影存在一些问题,好在实际效果大致可以产生长阴影的观感,毕竟是高度自动化的App,不需要你一步一步在Procreate中繁琐的操作,所以我仍然会用到它。

打开OVLAApp,这里我选择了一个比较细的字体,可以凸显出阴影。将字体颜色设成与背景一致。

底栏选择「阴影」,左侧选择第三个长阴影图标,朝右下侧方向拉长,右侧第一个滑条拉到最高,降低到合适的透明度,然后将阴影颜色选一个合适的灰色,对,就这么简单。

从这个例子我们可以反思一下,高度定制化的强大工具要实现这个效果反而更繁琐,App的优势也凸显出来。

「新拟态」最近被三星S20的海报带火了,英文名Neumorphism,也有设计师称为SoftUI(软UI)。简单来说就是一种类似浮雕的效果,介于扁平与投影之间,是写实和极简的最佳重合点,看似很高端,但其实实现起来非常简单。

思路:拟态效果看起来高大上,无非还是遵循光线的原理,它有厚度却又没有离开平面,它的范围相对于投影的无边界,似乎还有一些模糊的界定。通俗来说,就是在形状的边缘与下层之间有一段坡度,理解了这个就很好下手了,光线从左上角投来,左侧和上侧呈现明亮的反光,右侧和下侧的阴影比漂浮投影要略淡一点,也可能略长一点。

首先添加一个背景图层,注意这里图层颜色不是纯白,为了给塑造层次留出空间,选择一个较亮的灰色或者其他纯色,一般而言,拟态矩形要添加一定圆角,所以这里我添加一个圆角矩形,并复制这个图层。

然后选择下层的这个圆角矩形,「上栏右侧第一个图标-格式-阴影」,将模糊调到最大,角度我这里选择-60°,偏置选择61像素,阴影颜色选一个合适的、比背景略深的颜色。

选择上层的圆角矩形,将「填充」颜色设置成与背景一致。然后依然找到步骤一提到的阴影调整界面,这里我将模糊调到59像素,角度选择-135°,偏置选择49像素,阴影颜色选一个合适的、比背景略浅的颜色。

完成,设计就是这么轻巧。

同样的图层思路,我们也可以制作出富有质感的拟态字体样式,当然,通过以上两张例图你会发现,这种样式比较适合背景简单,色彩统一的图片。

设计,没有最终的正确答案。所以不要担心自己设计出的东西不符合规则,即便有普世的规则,也需要你大胆地试错才能领悟。

THE END
1.小饭店菜谱大全家常菜图片熊猫办公精心为用户挑选80张高清精美饭店菜谱图片、支持专业级饭店菜谱设计素材下载,更多风格的饭店菜谱,免抠元素,卡通手绘素材图片、图标图案、免抠矢量图,尽在熊猫办公。https://www.tukuppt.com/speciall/fandiancaipu.html
2.菜单设计制作菜单设计模板菜单设计图片免费下载凡科快图,为您提供海量菜单设计模板、菜单设计图片,各类菜单设计素材免费下载,在线实现无障碍菜单设计制作,3秒快速生成精美可商用图片。https://kt.fkw.com/caidansj.html
3.科技是如何操纵人的想法——来自于一个魔术师和Google的设计伦理这恰恰就是魔术师所做的。当架构设计菜单的时候,他们给人们自由选择的错觉,所以不管你怎么选择他们都赢了,我没办法完全的强调这个洞察力有多么深奥。 When people are given a menu of choices, they rarely ask: “what’s not on the menu?” “why am I being given these options and not others?” https://www.jianshu.com/p/0b41264de5a3
4.菜单设计免费菜单设计模板在线菜单制作设计软件MAKA是最受欢迎的免费在线菜单设计软件、菜单制作工具,提供精美的菜单设计模板素材,5分钟完成在线设计制作中英文餐厅菜单、酒水菜单,包括烧烤、火锅、大排档、快餐、饭店、宴会、婚宴菜单。https://www.maka.im/zhinan/caidansheji
5.手把手教你从设计稿到切图设计一款APP3.菜单图标: 图标的大小和图标的可点击区域不一定一致 也就是说,图标可以做的很小,但是为了保证点击的准确性和流畅性,工程师可以把可点击区域设置的很大,这样标注和切图的时候就要注意,标注的是可点击区域的大小,切图切的也是可点击区域的大小,也就是用透明区域去补上,否则图片会模糊。 https://www.imooc.com/article/1510
6.沈阳职业技术学院教学管理服务平台1、菜单功能进入5 2、信息增加、删除、修改5 3、信息模糊查询6 4、信息下拉选定6 5、页脚6 三、系统功能7 1、系统首页7 1.1 系统地址7 1.2 身份认证8 1.3 忘记密码8 1.4 首页展示8 2、系统主界面10 2.1 控制台10 1)个人中心10 2)待审核工作11 https://www.vtcsy.edu.cn/xxzx/info/1234/1410.htm
7.大调研,我们在行动“破四唯”和“立新标”,如何才能并举中科院古脊椎动物与古人类研究所科研人员在新疆哈密戈壁科考。资料图片 二、怎么评 ■实践探索 给你“菜单式选择”,更加灵活的评价方式广受欢迎 一次通过!做了32年田间地头“晴雨表”,新疆喀什莎车县气象局胡桂萍去年终于享受到了副高岗位工资待遇。 “向往副高职称多年,始终没参评,主要是从事一线业务服务工作,能发表的http://www.sx-dj.gov.cn/ywsd/szxw/1661287142920609793.html
8.CorelDraw怎么设计三维立体的饼形图?CorelDraw怎么设计三维立体的饼形图?2023-07-15 精选回答 1、首先打开CorelDraw,单击文件,新建命令,新建一个文本。2、单击椭圆工具,画一个椭圆,单击菜单栏饼型,并设置角度,然后按住键盘+号键复制一个,并调整角度,再复制一个调整角度。角度调整好,分别填充颜色。3、颜色调整好,用选择工具把三个图形分别分开,大小https://wap.hxsd.com/wenda/59485/