视觉设计手绘UI设计

Illustrator中创建一个厨房(下)

2018-05-19  本文已影响15人  UI设计鲲鹏

第14步

使用第一个(Control-C > Control-F)的副本创建第二条毛巾,我们将把它放在顶部,确保将填充形状的颜色更改为#A1C689。一旦你完成后,选择与集团两者一起使用控制-G的键盘快捷键。

11.如何创建货架和装饰元素

我们已经完成了开放式的内阁,并且我们已经完成了封闭的内阁,所以现在是时候让一个好的旧悬架。

步骤1

使用具有4 px粗轮廓()的104 x 6 px矩形(#82868E)创建货架的主体(),我们将GroupControl-G)放置在台面上方,距离水龙头14 px,距离16从冰箱px。#363C4C

第2步

使用两个4 x 8 px长方形(#363C4C)彼此水平间隔76 px添加小括号,我们将GroupControl-G)放置在架子下方,它们对齐到较大的身体。完成后,选择所有书架的组成形状,并选择Control-G)。

第3步

使用四个6 x 12 px矩形(#5592A0)和4 px粗轮廓(#363C4C)创建空眼镜(),我们将分别对GroupControl-G)进行组合Control-G),然后将8 px彼此分开(将4 px从一个轮廓移到另一个轮廓) 。完成后,将形状放置在架子上,距离其右边缘4 px

步骤4

向左移动几个像素,然后使用一个带有4 px粗轮廓()的32 x 16 px矩形(#929BDD)创建其主体,然后开始使用小型蓝牙音箱(我们将GroupControl-G)),然后放置在架子上,  从左边缘开始8px。#363C4C

第5步

使用两个8 x 8像素圆圈(#363C4C)来添加扬声器单元,我们将相互放置8 px分组Control-G),然后它们对准到设备的主体。

第6步

使用两个8 x 4 px矩形(#363C4C)创建顶部和底部插入,我们将在彼此之间以8 px的距离垂直堆叠,分组Control-G),然后两者对齐到较大的主体。

第7步

使用三个4 px高的矩形(#363C4C),将水平间距为2 px的矩形添加到扬声器的按钮中,我们将组合Control-G),然后将其放置在扬声器顶部,距离其左边缘6 px。一旦你完成后,选择和集团所有设备的组成形状一起使用的控制-G的键盘快捷键。

12.如何创建窗口

假设我们没有设计厨房用于掩体内部,让我们创建一个小窗口给它一些空气。

步骤1

通过创建使用该帧开始52 X 68 PX矩形(#E2AA7D带)4 PX粗轮廓线(#363C4C),我们将控制-G ),然后在距离位置12像素 从台面和16像素从悬浮架。

第2步

使用带有4 px粗轮廓()的40 x 56 px矩形(#A5795B)添加框架的内部部分(),我们将Control-G),然后居中对齐到之前创建的部分。#363C4C

第3步

使用带有4 px厚轮廓()的30 x 46 px矩形(#ABDBEF)创建玻璃窗口,我们将Control-G),然后将中心对齐到窗口的内部部分。#363C4C

步骤4

使用两个10 x 8 px矩形(#363C4C),将两个垂直堆叠的32 x的矩形添加到铰链中 ,我们将分组Control-G),然后居中对齐到框架内部部分的左侧。

第5步

使用三个4 px高的矩形(#EDF6F9)创建云,我们将通过将 其内部边角的半径设置为2 px来调整云。把你的时间,而一旦大功告成,选择和集团使用的所有三个形状一起控制-G的键盘快捷键。

第6步

通过使用16 x 4 px矩形(#363C4C)创建其手柄来完成该窗口,该矩形我们将居中对齐框架内部部分的右边缘。完成后,使用Control-G键盘快捷键选择并分组其所有组成形状。

13.如何创建天花板照明

我们现在回到我们厨房的最后一节,所以不要浪费任何时间,让我们来完成这个。

步骤1

使用创建的天花板线184像素4 PX行程(#363C4C),我们将中心对齐画板,在距离其定位18 PX从窗口的上边缘。

第2步

开始使用中心照明灯具,通过使用12 x 16 px矩形(#E8B169)以及4 px厚轮廓(#363C4C)创建其主体(我们将GroupControl-G)),然后中心对齐到之前的形状一步,将它定位在它   下面18 px

第3步

使用12 px4 pxStroke(#363C4C)添加水平装饰线,我们将中心对齐到灯具的主体,从其底部边缘定位2 px

步骤4

使用18 px4 px厚的笔画线(#363C4C),在将灯具连接到天花板的电缆部分绘制,然后选择并分组Control-G)所有其构图形状。

第5步

使用我们刚完成工作的两个副本(Control-C> Control-F两次)创建剩余的灯具,我们将把它放置在距离原始像素40像素的两侧。

第6步

通过使用一个128 x 6 px矩形(#363C4C)添加灯光的底部来完成天花板和图示本身,我们将居中对齐其线条的底部。一旦你完成后,选择和集团控制-G )所有当前节的组成形状一起,做着同样的整个说明之后。

老铁们,做得好!

你有它 - 一步一步的方法,如何建立你自己的现代厨房,只使用最简单的解决方案。我希望你能在这个教程中玩得开心,并且最重要的是学到了一些新的有用的东西,欢迎加入UI设计群587751709

上一篇下一篇

猜你喜欢

热点阅读