zoukankan      html  css  js  c++  java
  • PS网页设计小贴士——快速设计3D点阵字

    近日,在网上闲逛的时候。发现一篇不错的3D点阵字的教程。在自己亲历实为后,将教程赋予下方。本教程不是原创,在原创的基础上,做了适当的改良。

    完成的作品如下:

    image

    步骤1:建立参考模版

    新建20px*20px的文档,放大为800%,用文字工具书写文字“朱”,边缘选项选择无

    image

    image

    这个作为后面步骤的模版

    步骤2:创建基本方块

    不要关闭之前的文档,新建文档500px*500px。

    矩形工具创建一个矩形,尺寸:19px*19px,颜色: #0a6b8e

    image

    按Ctrl + J复制图层,并移动到原图层上方19px处,颜色改为: #2bb3e5

    再次复制图层,并移动到原图层左侧19px处,颜色改为: #208ab1

    image

    对上方的矩形,向左倾斜45度,按Ctrl + T自由变换,点击右下角的控制点,调整H的参数为45

    对左侧的矩形,向上倾斜45度,按Ctrl + T自由变换,点击右下角的控制点,调整V的参数为45

    image

    将这三个矩形归并为一组,组名为box

    在组上右键选择转换为智能对象,命名图层为box

    步骤3:按照模版摆放方块

    至此,模版和方块都已经完成,接下来就是按照模版摆放方块

    摆放的顺序按照模版的右下角开始,到模版的左上角

    移动box图层到画布的右下角

    按Ctrl + J复制图层,选择移动工具,按住Shift键,并按左方向键2次,新图层向左移动20px

    image

    这也是为什么之前方块的大小为19px的原因,方块向左侧移动20px,和之前的方块就会有1px的间距,这样显得更加有立体感

    复制box多次,并移动到合适的位置(按住Shift+方向键,一次移动10px)。如果出现不合适的效果,调整图层顺序即可。如下图所示:

    image

    步骤4:调整合适的角度,使其看起来更加真实

    将这些图层归并为一组,组名为ZHU

    点中组,按Ctrl + T自由变换,V的参数设置为-20

    image

    步骤5:快速调整颜色

    双击ZHU组中的任意一个图层,打开编辑窗口

    image

    分别调整每个图层的颜色,然后关闭保存即可。这就是智能对象的优势,更改一个元件,所有的元件都会同时改变

    image

    补充说明:颜色的设置

    每个方块的都需要有3个颜色,对于美工出身的问题不大,对于我们这些编码者,颜色的设置有点捉襟见肘。

    可以利用颜色的HSV属性,可以方便的设置颜色

    正面的颜色:H:任意;S:90左右;V:55左右;

    左面的颜色:H:和正面一样;S:80左右;V:70左右;

    上面的颜色:H:和正面一样;S:80左右;V:90左右;

  • 相关阅读:
    设计教训。
    爆牙齿的世界杯日记(小组末轮AB组)
    [维多利亚2 MOD] RecoverMingV(Vic2版复明) V1.1.3(201254更新),兼容AHD 2.31beta
    [文明5建筑MOD] Gunpowder Magazine and Firecracker Workshop (火药库与爆竹坊)。祝大家春节快乐!
    IVY Bridge : There's more than 22nm(IVB的新指令)
    ID3D11DeviceContext::Dispatch与numthread笔记
    如何在各个版本的VC及64位下使用CPUID指令
    [x86]SIMD指令集发展历程表(MMX、SSE、AVX等)
    C++AMP的tiled_index线程编号属性笔记
    x264编码参数大测试:09 trellis(crf26)
  • 原文地址:https://www.cnblogs.com/grenet/p/2870761.html
Copyright © 2011-2022 走看看