松原网主页 > 科技 > 正文 >

手绘教程·UI设计|给自己的手机设计一组大海的手机主题吧~

2020-06-03 08:35:12 来源:互联网 阅读:-
【摘要】扁平化设计这个词似乎听说得越来越多,这种强调去除冗余、厚重和繁杂的装饰效果的设计风格似乎越来越多地成为“现代感”的代名词。

扁平化设计这个词似乎听说得越来越多,这种强调去除冗余、厚重和繁杂的装饰效果的设计风格似乎越来越多地成为“现代感”的代名词。Windows、Mac OS、iOS、Android等操作系统的设计也已经往“扁平化设计”发展。

同时,扁平化的图标在移动系统上不仅界面美观,并且能降低功耗,延长待机时间和提高运算速度等,可以说是大势所趋了。

就如书上所说,“做好设计应该从手绘开始”,那么今天小编就带大家来绘制以“大海”为主题的手机界面设计手稿吧!


手绘教程·UI设计|给自己的手机设计一组大海的手机主题吧~



设计要点

在本设计中,主要采用蓝色背景、浪花等元素来体现主题“大海”,并在具体的图标设计时融入小鱼、船上零部件等与主题相呼应。

绘制步骤

1

用直线画出手机主题界面的大体形状,确定画面的构图,注意把握好长、宽比例关系。


手绘教程·UI设计|给自己的手机设计一组大海的手机主题吧~


2

用曲线画出波浪、浪花来划分主题界面的功能区域,用圆弧线和直线画出左边部分主要造型的轮廓。


手绘教程·UI设计|给自己的手机设计一组大海的手机主题吧~


3

添加并完善局部细节的刻画,在相应位置画出手机主题界面主要配置按钮的轮廓。


手绘教程·UI设计|给自己的手机设计一组大海的手机主题吧~


4

根据比例关系,用铅笔画出主题界面功能图标的轮廓,并添加显示时间,丰富画面的内容。


手绘教程·UI设计|给自己的手机设计一组大海的手机主题吧~


5

用445号彩铅面出手机主题界面主要背景的颜色,注意尽量不要让颜色超出轮廓。


手绘教程·UI设计|给自己的手机设计一组大海的手机主题吧~


6

用407号彩铅、444号彩铅画出剩余部分背景的颜色。


手绘教程·UI设计|给自己的手机设计一组大海的手机主题吧~


7

用487号彩铅为下角圆形造型上色,注意颜色的明暗对比关系。


手绘教程·UI设计|给自己的手机设计一组大海的手机主题吧~


8

用430号彩铅、466号彩铅、434号彩铅、416号彩铅、407号彩铅画出右边部分功能图标的颜色。注意颜色的冷暖搭配要合理,面面不要铺得太满,适当留白表现透气感。


手绘教程·UI设计|给自己的手机设计一组大海的手机主题吧~


9

为画面添加文字说明,调整并完善画面,完成绘制。


手绘教程·UI设计|给自己的手机设计一组大海的手机主题吧~


手绘教程·UI设计|给自己的手机设计一组大海的手机主题吧~



扩展阅读

《UI设计手绘表现从入门到精通》以UI设计为核心,系统全面地讲解了UI设计手绘各个方面的知识。本书内容全面,知识涵盖面广,对线条画法、透视关系、色彩知识、材质表现等都有讲解。打破常规同类书籍中的内容形式,本书更加注重实例的练习,采用手把手教学的方式来讲解UI设计手绘。本书UI设计手绘表现技法全面,既有铅笔、针管笔黑白表现UI设计手绘实例,也有马克笔、彩色铅笔UI设计手绘实例。既有图书学习教程,又有教学视频,是学习移动UI设计手绘优质的选择。

戳下方“扩展链接”即可购买哦!


手绘教程·UI设计|给自己的手机设计一组大海的手机主题吧~


关注公众号“麓山文化”,获取更多教程资讯!

推荐阅读:叶紫网