赞助商
立即赞助

关于像素艺术中的等距图形,这份总结超全面!

UI设计3年前 (2021)更新 流光
2.9K 0 0

什么是等距图形?等距图形的发展历史?如何快速做出等距图形?这篇总结全都有了!

一. 等距是什么?

等距视图是指,绘制物体时每一边的长度都按绘图比例缩放,而物体上所有平行线在绘制时仍保持平行的一种显示方法。

最早是出现在电脑应用程式的图像,以及早期的8位元电子游戏,近几年来的被广泛的使用在因特网、GUI(Graphic User Interface)以及行动游戏等等。

二. 等距视图游戏的历史

虽然计算机游戏的历史在20世纪70年代初期就看到了一些真正的3D游戏,但是第一个使用上述意义上的等距投影的不同视觉风格的视频游戏是20世纪80年代初的街机游戏。

1. 20世纪80年代

关于像素艺术中的等距图形,这份总结超全面!

△ 高速公路遇袭(1985年)

等距视图是一种把2D游戏伪装为3D游戏的显示方法。使用这种方法的游戏有时候会被称作伪3D或2.5D

关于像素艺术中的等距图形,这份总结超全面!

△ 蝙蝠侠(1986年)

执行等距视图的方法有很多,但为了简化,最有效最常用的一种——贴图法。从上面两张图可以看出,其上覆盖的菱形网格把地形划分贴图。

2. 20世纪90年代

关于像素艺术中的等距图形,这份总结超全面!

△ 最终幻想III(1997)

关于像素艺术中的等距图形,这份总结超全面!

△ 文明六世(2016)

在贴图法中,各个视觉元素都被切分为更小的部件,称为「贴图」,都是标准尺寸的。根据预先确定的平面数据——通常是2D数组,这些贴图被组织成游戏世界。

3. 目前2000

关于像素艺术中的等距图形,这份总结超全面!

△ SOCIOBALL(2015)

关于像素艺术中的等距图形,这份总结超全面!

△ 纪念碑谷 (2016)

三. 等距风格的图标、插画及应用范围

这种插画有一个专门的名字叫「isometric」。应用范围很广,比如:icon、界面、启动页、插画、游戏、动画视频等等。

关于像素艺术中的等距图形,这份总结超全面!

△ 图标

关于像素艺术中的等距图形,这份总结超全面!

△ 字体

关于像素艺术中的等距图形,这份总结超全面!

△ 插画

关于像素艺术中的等距图形,这份总结超全面!

△ 海报

关于像素艺术中的等距图形,这份总结超全面!

△ 启动页

四. 常用绘制软件

目前常用的软件有PS、AI、C4D。

现在网上有很多教程,比如:

  • 《用illustrator制作Isometric风格的宝塔》
  • 《isometric立体图形绘制分享 》

五. 干货

虽然PS/AI都能画出等距图标,但是现在有一个软件Affinity Designer 比它们画等距图更加轻松。

关于像素艺术中的等距图形,这份总结超全面!

画等距图形,首先我们需要画参考线。PS/AI都能画出来,但是方法还是稍稍显得复杂了一点,一些基本功不到位的同学会很头疼这个参考线的画法。Affinity Designer 的网格和轴管理器十分人性化的解决了这个问题。

不但对于新手来说是个不错的选择,而且它完美的融合了Adobe和sketch两个原本不相融的软件。

关于像素艺术中的等距图形,这份总结超全面!

关于像素艺术中的等距图形,这份总结超全面!

关于像素艺术中的等距图形,这份总结超全面!

类择轴测,距需。

并且它的网格还可以设置吸附功能,也就是画的每个元素都可以自动吸附在网格边缘。

关于像素艺术中的等距图形,这份总结超全面!

关于像素艺术中的等距图形,这份总结超全面!

另它捷功,它图形变形功。鼠标移矩形节叠箭(→),图:

关于像素艺术中的等距图形,这份总结超全面!

轻倾矩形任,并吸。

关于像素艺术中的等距图形,这份总结超全面!

拖拽矩形宽根据径,响矩形倾。

关于像素艺术中的等距图形,这份总结超全面!

轻轻画icon。

Affinity Designer这个软件目前只适用于苹果操作系统,在App Store商店里有售卖。

案例鉴赏:

关于像素艺术中的等距图形,这份总结超全面!

关于像素艺术中的等距图形,这份总结超全面!

△ 软件:C4D、3D-MAX、MAYA等大部分3D软件

关于像素艺术中的等距图形,这份总结超全面!

关于像素艺术中的等距图形,这份总结超全面!

△ 绘图法:插画

欢迎关注点融设计中心DDC微信公众号:「ID:DR_DDC」

关于像素艺术中的等距图形,这份总结超全面!

© 版权声明
您必须登录才能参与评论!
立即登录
暂无评论...

相关文章

在设计行业中,提到精彩二字,很难不联想到大海彼岸的日本索尼、松下、三菱,不少日企都曾凭借设计风靡过全世界,可问题是,...
包装设计
编者按:我们经常会推荐各式各样的工具,但是什么样的工具推荐最有意义呢?在我看来,除了工具本身各种显而易见的功能和属性...
UI设计工具
编者按:Google 旗下有很多不同的设计项目,他们会到每年年底的时候,评估出每年最值得关注的设计项目,这些设计项目中大多有...
Google
最近实习的时候,交互同事小哥哥问了我一个问题:如果你面试的时候,面试官让你设计一个游泳池,你会怎么做? 仔细想想,其...
交互设计
编者按:这篇文章不会给你分享任何杀手级的设计工具,也没有针对特定设计项目的独家秘诀,这篇文章只会分享7个如何更快做设计...
如何提高工作效率
编者按:懒得试配色方案?不妨收藏这些配色网站,和常见搭配,让你的配色更加协调! 一. Adobe Color CC 二. Color Lovers ...
经验分享
幽灵按钮和类似的空心元素,在诸多的设计趋势当中,还是显得颇为单薄的。它们的转化率看起来不够突出,和其他的固定形体相比...
幽灵按钮
编者按:用户访谈是了解用户最常见也最重要的一种方式,但是为什么有团队做的用户访谈并没有发挥它应有的作用呢?造成这个结...
UX设计