网页设计 » 视觉设计 » 2D可视化地图制作方法(附地图PS插件)

2D可视化地图制作方法(附地图PS插件)

发表于: 视觉设计. 评论
Sponsor

前言:之前在设计群里有个群友说,老板要求他自主设计一个地图效果,而且要看起来要高大上、要有科技感!我们知道自主设计地图主要使用C4D、3Dmax等3的软件,对于只会PS的群友的来说,老板这个要求可是让他一个头两个大。那么其实地图在很多项目中都可以用到,可是不会3D软件,还能自主设计地图吗?回答当然是可以的,今天给大家带了几个ps制作地图的插件。就算不会3d软件,也能轻松制作漂亮的可视化地图,并应用到网页或信息图的设计作品上。

2D可视化地图制作方法(附地图PS插件)

第三步:航拍图及黑白图的处理

把黑白图和航拍图同时导入PS中,把航拍图和黑白图对齐。可以把航拍图透明图调低些,方便和黑白图对齐。对齐后透明度复位。

2D可视化地图制作方法(附地图PS插件)

黑白图有点对比度不够,通过调整亮度对比度,增加黑白图的对比度。(黑白图是控制地图的高低,这里通过调整对比度优化地图的高低起伏,有助于视觉效果提升)

2D可视化地图制作方法(附地图PS插件)

第四步,异形地图制作

用钢笔工具勾出需要的位置,并把图层名称改成shape(切忌重点),不然无法把勾选区域生成。刚踩过的坑,版本更新后,需要更改图层名称,之初尝试了各种方法一直无法生成就是由于这里出现问题。

2D可视化地图制作方法(附地图PS插件)
第五步:选择地图插件生成地图
打开3D Map Generator-Terrain 插件。

2D可视化地图制作方法(附地图PS插件)

点击Create New Terrain。

2D可视化地图制作方法(附地图PS插件)

Set Terrain Elecation是控制地形高差的,5是最高,这里我们选择最大,高差大一些效果也会明显些。建议调大一点。选择完高程后,点击Create 3D Terrain下的Right。下面的Left、Frontal、Right分别是不同的透视方向。等待完成即可(生成时关闭航拍图图层)。

2D可视化地图制作方法(附地图PS插件)

生成后效果

2D可视化地图制作方法(附地图PS插件)

第六步:航拍图作为纹理应用及调整

这部主要是替换地图纹理,点击Texturing

2D可视化地图制作方法(附地图PS插件)

选择开始文件中的航拍图,把图层复制到新打开的文件中。并把新复制的图层纹理对齐。

2D可视化地图制作方法(附地图PS插件)

使效果更加细腻真实些,调整下地图的曲线和色相/饱和度,使得地图更有品质感,然后直接保存

2D可视化地图制作方法(附地图PS插件)

保存后生成完整地图

2D可视化地图制作方法(附地图PS插件)

第七步:地图侧面厚度颜色调整

改变地图竖向高度颜色的话可以点击。Edit Terrain Project,然后在点击下图的左上角的吸管选择颜色

2D可视化地图制作方法(附地图PS插件)

第八步:背景的调法

可以调整背景,点击Grounsd,里面有很多背景选项,也可以自己定义颜色。如果这些满足不了,可以自行新建背景层设计调整。

2D可视化地图制作方法(附地图PS插件)

调整后效果:

2D可视化地图制作方法(附地图PS插件)

第九步:地图信息内容的增加

同时可以添加一些2.5素材,用官方自带的素材做展示,点击Icons,可以选择一些符合需求的素材使用,素材库毕竟有限,可根据实际项目自行画一些素材使用。

2D可视化地图制作方法(附地图PS插件)

添加后的效果,到这里地图就基本完成了。

2D可视化地图制作方法(附地图PS插件)

第十步:增加图表信息完成整体效果

可根据项目需求把数据加入进来,进行设计。增加些图表信息。完成!

2D可视化地图制作方法(附地图PS插件)

插件中功能很强大,比如调整海、湖、自己手动画地形等等,还有很多功能。

更多地图效果生成,其他的功能自行尝试,自行研究一番。

其他地图生成效果扩展

2D可视化地图制作方法(附地图PS插件)

总结

1、推荐使用谷歌地图

2、谷歌地图和黑白地图一定要对齐,错位会有违和感

3、航拍图是好比三维软件中的贴图,黑白图是控制地图的高低起伏

4、做异性地图时,用钢笔勾选一定要是闭环,并且图层命名为“shape”

5、生成时选择高度时最好选择大一些,这样整体视觉会好一些

有了这么好用的插件,你还怕老板说要个高大上的地图效果吗!

地图PS插件下载地址:

https://pan.baidu.com/s/1xEySK9EwxEKN9HGivqk2zQ 提取码: writ

作者 | 聂永真
来源 | 优艺点设计(uiyidian09)

 

推荐:查看最受欢迎的 301 个设计网站 → http://hao.shejidaren.com
交流:为设计新人提供的设计交流群,请加入UI设计交流群,分享经验、接单、求职、聊设计。
赞助商链接
赞助商链接
设计达人微信交流社区:shejidaren888
喜欢这篇文章吗?欢迎分享到你的微博、QQ群,并关注我们的微博,谢谢支持。
版权:除非注明,本站文章均为原创文章,转载请联系我们授权,否则禁止转载。

{ 发表评论 }