店标制作★手把手教你做超眩【动态店标】图解及常见问题解答
[size=5]经常有淘友跟我说，我的店标和签名档、宝贝图片很漂亮，问我是怎么做的？说自己也想拥有像这样与众不同的店标，可却苦于自己不会PS做图。针对这种情况，今天我就整理了一下，手把手教大家从入门级做起，把我的店标的制作步骤示范给大家，希望大家看后能有一点收获，并且祝大家都能做一个独一无二的个性店标！！！（偶是第一次发贴，有什么不对地方还请各位前辈多多指教）[/size]N6n R#EPzBdM[size=5]1、首先，打开Photoshop，在最上面菜单栏中，单击“文件”菜单，打开下拉菜单，选择“新建”命令，如下图中红笔所圈部分。[/size]
[size=5][img]http://cn.photos.yahoo.com/users/45dcf6b0ze636bf20/6d36/__sr_/e335cnb.jpg?GEpUsXKo3cbjndszsjcJTQ--&F18[/img][/size]B)E mA0wT
v(i@ u2z∓D5t
[size=5]2、接下来就会出现如下图所示的对话框。如下图中所示，设置各项参数。
[img]http://cn.photos.yahoo.com/users/45dcf6b0ze636bf20/6d36/__sr_/bc98cnb.jpg?n5gucdAi4XZoHNLkruES_Q--&F18[/img][/size]
[size=5][/size]
[size=5]3、然后就出现一个新建的文件了[/size]
[size=5]4、单击“文件”菜单，打开下拉菜单，选择“打开”命令。如下图[/size]f6?BD4~'pyF
[size=5][img]http://cn.photos.yahoo.com/users/45dcf6b0ze636bf20/6d36/__sr_/ae0ecnb.jpg?faPN0CsoS8ed8aAlU09e8A--&F18[/img][/size]
[size=5][/size]
[size=5]5、如下图选择自己想要修改的图片，可以是自己的宝贝图片，也可以是任意自己喜欢的图片。这里为了解说方便，我就任意找了2张宝贝图片给大家做示范。[/size]
[size=5][img]http://cn.photos.yahoo.com/users/45dcf6b0ze636bf20/6d36/__sr_/7a93cnb.jpg?gMo4hldg1mecQJSW3TVOHA--&F18[/img][/size];p b/u r B!w/\
[size=5][/size]
[size=5][/size]
[size=5]6、选择“移动工具”（如图）[img]http://cn.photos.yahoo.com/users/45dcf6b0ze636bf20/6d36/__sr_/a084cnb.jpg?w_2NVK4XLGhLZXVNaOw1rA--&F18[/img]，按住鼠标不放，把刚才打开的宝贝图片拖动至新建的空白文件中，如下图。[/size]
[size=5][img]http://cn.photos.yahoo.com/users/45dcf6b0ze636bf20/6d36/__sr_/ed49cnb.jpg?F3Syz9XAK_n__ufYR2PNyA--&F18[/img][/size]^.}V-^2Kp$o*n Y7RL
[size=5][/size]
[size=5]7、如右图，[img]http://cn.photos.yahoo.com/users/45dcf6b0ze636bf20/6d36/__sr_/e1c6cnb.jpg?9bLfhLtz.b0Ys3FbvxZFNQ--&F18[/img] 选择左边工具栏中的“横排文字工具”，输入自己想要的文字内容（例如自己的店名或是广告文字等等）。[/size]
[size=5]8、单击如下图中红笔所示按钮， [/size]G N;N nn+oS
[size=5][img]http://cn.photos.yahoo.com/users/45dcf6b0ze636bf20/6d36/__sr_/9864cnb.jpg?zIWVPq6aOnYBhTqh34JCEg--&F18[/img] [/size]8Ho M:y Vp$Ow [
[size=5][/size]
[size=5] 在对话框中(如下图)设置文字的大小、字体、颜色等参数。[/size]
[size=5][img]http://cn.photos.yahoo.com/users/45dcf6b0ze636bf20/6d36/__sr_/539fcnb.jpg?IQywCF3PycQvWOz7TsjWzA--&F18[/img][/size]!^J ];gT#aa:p0k
[size=5][/size] z7aozK
[size=5]9、使用“移动工具”，将文字移动到合适位置。[/size]
[size=5]10、在最上面菜单栏中，单击“窗口”菜单，打开下拉菜单，勾选“图层”选项。[/size]
[size=5]11、现在出现了如下图所示的“图层”窗口[/size]5wI#o @6r;D8e0TZ
[size=5][img]http://cn.photos.yahoo.com/users/45dcf6b0ze636bf20/6d36/__sr_/1cafcnb.jpg?k72ebHi.KDshZNZUukB.zA--&F18[/img][/size]
[size=5][/size] d)oC/wyrd(S
[size=5]12、如右图所示，[img]http://cn.photos.yahoo.com/users/45dcf6b0ze636bf20/6d36/__sr_/42e2cnb.jpg?ZlAh8rm0we3sbFn_loDNNA--&F18[/img] 链接文字和图片之后，按住键盘上的ctrl+E键（这是快捷键）合并链接图层，如下图。[/size]
[size=5][img]http://cn.photos.yahoo.com/users/45dcf6b0ze636bf20/6d36/__sr_/dca8cnb.jpg?Yb8XUcW6QdDO_NS7QHwePw--&F18[/img][/size]
[size=5][/size]
[size=5]13、到这里，大家要注意了，因为我们是要做由2个宝贝跳动转换而组成的动态店标，所以我们要重复步骤4-12，分别把2个宝贝都处理好（大家想做几个宝贝跳动的动画，就要重复以上步骤几次）如下图所示。[/size]
[size=5][img]http://cn.photos.yahoo.com/users/45dcf6b0ze636bf20/6d36/__sr_/77a6cnb.jpg?J1c9Un2goKXIzDPf3OYyVQ--&F18[/img][/size].I7? _J%aw1q2?0t'L
[size=5][/size] )p1o:tG'o&E,l0Q
[size=5]14、如下图所示， 单击左边工具栏中的“跳至ImageReady”按钮，在ImageReady程序中打开刚才处理好的文件。[/size]
[size=5][img]http://cn.photos.yahoo.com/users/45dcf6b0ze636bf20/6d36/__sr_/8a2fcnb.jpg?vi83sFxq31lqKo7Sji.uaw--&F18[/img][/size]!nV W6RDD9HR
[size=5][/size]
[size=5]15、在ImageReady程序中，在最上面菜单栏中，单击“窗口”菜单，打开下拉菜单，分别勾选“动画”选项和“图层”选项，打开“动画”面板和“图层”面板，如下图所示。[/size]M [#gBA1w
[size=5][img]http://cn.photos.yahoo.com/users/45dcf6b0ze636bf20/6d36/__sr_/6cf1cnb.jpg?TZdbsLo_KALIDPzmtM6czw--&F18[/img][/size]
[size=5][/size] z*Q0|&D8f h"Xvd
[size=5]16、选择“动画”面板，单击动画面板右下角的“复制当前帧”按钮 如右图[img]http://cn.photos.yahoo.com/users/45dcf6b0ze636bf20/6d36/__sr_/cd36cnb.jpg?0oEGev.gZTytq9WTNwpBBQ--&F18[/img][/size] y6Q Y)UE(Pn6b
[size=5]17、选中第二个层，如图 [img]http://cn.photos.yahoo.com/users/45dcf6b0ze636bf20/6d36/__sr_/72b6cnb.jpg?n4Q5s5b_y68Derb9hmnkAg--&F18[/img][/size]
[size=5][/size]
[size=5][/size] Z+z#}$y Gh E
[size=5]18、回到“图层”面板，单击左边的小眼睛，把“标”那个层隐藏，只显示“店”那个层，如下图[/size]Qc!C*j3v.Tg#n Rn
[size=5][img]http://cn.photos.yahoo.com/users/45dcf6b0ze636bf20/6d36/__sr_/b3ffcnb.jpg?CgqA9CqIIhvtH.Ms7gUgOQ--&F18[/img][/size] E mw!?)~:?e
[size=5][/size]
[size=5]19、再回到“动画”面板，如图所示，[img]http://cn.photos.yahoo.com/users/45dcf6b0ze636bf20/6d36/__sr_/4f10cnb.jpg?54OzbvSMNFdenI0vY7I_9A--&F18[/img] 单击右下角“0秒”右边的那个小三角，在打开的下拉选项中，勾选“0.5”[/size] \ V/o u hBoTOt%^ G
[size=5]20、选中第一帧，重复步骤19。[/size]
[size=5]21、如下图所示，单击左下角“一直有效”右边的那个小三角，在打开的下拉选项中，勾选“一直有效”[/size]M*L%Fd0B'^#A
[size=5] [img]http://cn.photos.yahoo.com/users/45dcf6b0ze636bf20/6d36/__sr_/6abecnb.jpg?kQ.Ofcn9rXUkXP8VnqoMBQ--&F18[/img][/size]
[size=5]22、在最上面菜单栏中，单击“图像”菜单，打开下拉菜单，选择“图像大小”命令。在打开的对话框中，如下图所示，设置高和宽分别为100像素。[/size]
[size=5] [img]http://cn.photos.yahoo.com/users/45dcf6b0ze636bf20/6d36/__sr_/86a3cnb.jpg?YWX5rnnPODIArUQMMd_vzw--&F18[/img][/size]?2G h]&W}j`
[size=5]23、最后，如下图，点最上面的“文件”菜单里的“将优化结果存储为”这一项，在打开的对话框中，分别选择存放路径（即你的文件存在哪里）、文件名（即你的文件叫什么文字）其他的选项都让它保持不变。单击“确定”保存文件。[/size]1B CO Q ~8L6S g
[size=5] [img]http://cn.photos.yahoo.com/users/45dcf6b0ze636bf20/6d36/__sr_/5cefcnb.jpg?MtsEHgYhMNrbzTValGV3.w--&F18[/img][/size]4E9y0~(^/W
[size=5]24、OK，现在大功告成了，赶紧去上传吧，把自己动手DIY的店标眩起来！~~~~~[/size]
[size=5][/size]
[size=5]最近，不少朋友看贴后按照步骤操作，但在实际操作中出现一些状况，因此咨询我。[/size]
[size=5]在此，我首先要感谢各位朋友对我的支持和信任。[/size]E X`-X~Qf#Hn }#Z
[size=5]其次，我把各位朋友常出现的一些问题，整理之后上传上来，希望对大家有所帮助。[/size]
[size=5][b]问题1：在操作到步骤14时，工具栏中的“跳至ImageReady”按钮显示为灰色，不能单击使用？[/b][/size]l3A-S RI x
[size=5][b]答：[/b]出现这种情况，是因为你的电脑中没有安装“ImageReady”这个软件程序。大家可以在打开Photoshop ，在最上面的菜单栏中选择“文件”菜单→“跳转到”→“Adobe ImageReady”。如点击此命令无效，则证明，你的电脑中没有安装“ImageReady”这个软件程序，请先安装此程序再继续下面的步骤。[/size] y"g.T(s9I:N/R`9Z
[size=5][b]注[/b][color=#000000]：“ImageReady”是Photoshop 自带的一款网页图形制作的小软件，操作也和PhotoShop非常的相似,比较容易上手。通常安装Photoshop 程序时系统会默认安装“ImageReady”。如果大家的电脑没有安装“ImageReady”可以有以下2种解决方法：1、如果有Photoshop 的安装程序，可以先把Photoshop 卸载，然后重新安装，在安装时默认让系统安装“ImageReady”即可。2、若没有Photoshop 的安装程序，可以网上下载“ImageReady”然后安装。（搜索中输入“ImageReady”或到天空软件站、太平洋软件、华军电脑园中搜索即可）[/color][/size]"f }l;f8O:Ahk'M
[size=5][color=#000000][b]问题2：[size=5]如果有几张现成已做好的图片，要用image ready 做成动画怎么弄呢？[/size][size=5]（打开第一张只能在图层显示为背景， 其他的怎么加入到祯里面？）[/size][/b][/color][/size]
[size=5][b]答：[/b][/size][size=5]用image ready 做成动画是一定要先在PS里处理好图片的。[/size]
[size=5]如果有几张现成已做好的图片，只要在PS里，把这几张图片分别（CTRL+A）全选，再CTRL+C 复制，然后CTRL+V 粘贴，放到同一个文件里，然后再导入image ready 中做成动画。（注意：此时文件一定要是PSD格式的，也就是说必须是每一张图片是一个单独的图层，否则就会出现如你说的“打开第一张只能在图层显示为背景”这种情况）[/size]|6dG\ K [^/T
[size=5][b]问题3：什么是图层？什么是背景？为什么在ImageReady做动画可以预览了，却存不了gif的格式？[/b][/size]
[size=5][b]答：[/b]首先解释一下背景和图层：[/size] eG.mCR;}\6F5m
[size=5]所谓“背景”在Photoshop 中有2种含意：[/size]
[size=5]1、是图像中的背景。就是一张图片中，除主体物以外的部分，我们都称之为背景。比如说，我有一张水晶项链的照片，那么在这张照片中，主体物就是水晶项链，而除了这根水晶项链以外的部分，我们就称之为背景。[/size]
[size=5]2、是Photoshop 中的背景。是指在Photoshop 文件中的背景层。背景层是Photoshop图层中的最下方的一层图像，它所到的作用也与图像中的背景是一样的，一般情况下是不能移动的，通常我们所新建的任何层都是在这个背景层的上方。[/size]
[size=5]所谓“图层”：[/size]
[size=5]图层是Photoshop 最基本也是最重要的一个功能之一。[/size]d YF9d6rp u
[size=5]简单地说，一个图层就像是一张透明的纸，我们则在这张透明的纸上绘制图像，我们透过上面的图层即可以看到上面的图层上的东西，又可以看到下面的图层上的东西。一个Photoshop就是由任意个图层叠加而组成的。我们可以在任何一个图层上面绘制任意图像，然后把这些图层叠加起来就可以达到我们想要达到的效果。比如说，我的背景层是一张水晶项链的图片，然后我新建一个图层，在这个新图层上画了一个包装盒，那么我把新图层和背景层叠加在一起就是包装盒压住水晶项链的图像。[/size]'`:z-p Q#k'dA#FI {!`
[size=5]当我们想要修改图像时，可以在同一个图层上做任意修改，而不会影响到其他图层上的图像。[/size],xdC^3l;q'Y @ t
[size=5]图层的主要作用就是方便我们修改图像。所以，如果我们要修改图像，就一定要一个图层一个图层分开来做。当我们确定不用再做任何修改，可以完稿时才能合并图层。[/size]EThQ^
[size=5]另外：在ImageReady中，直接存为优化格式是不能存为GIF格式动画的，直接保存实际上保存的文件还是我们导入的那个Photoshop格式的文件。要想保存为GIF格式的文件，我们需要在ImageReady中选择“文件”菜单下的“将优化结果存储为”这一项。[/size]
y"A;y:`*Xd&H+^,~
[size=5][b]问题4：为什么转到Imageready之后，只能显示做好的东西中的一个，有这就没那，不能同时在图层中看到两个已经在PS中做好的东西？[/b][/size]6E E#oq A3[(^O,W8O
[size=5][b]答：[/b]出现这种问题，通常有2种情况：[/size]
[size=5]第一种情况：你的图片在导入到Imageready之前已经合并图层，也就是说，你把所有的图层全部都粘在一起，所有的图层都拼成一个图层了，这样的图导入到Imageready后自然也就只有一个东西了。只要你在PS里不要合并图层就可以了。[/size]
[size=5]第二种情况：你的图并没有合并图层，这时在转入到Imageready之后，可以在Imageready的“窗口”菜单栏中勾选“图层”一项，然后在图层面板中即可看到有多个图层（你做好了几个东西，就会有几个图层）。最上面一个层就是我们看到的层，而下面的层会被最上面的层遮挡住，所以容易造成只能看到一个东西的假像。这时只要把不需要显示的图层前面的“眼睛”形状的图标点一下，就会隐藏此层，依此类推，当我们需要显示哪个层时，就让哪个层前面的“眼睛”图标高亮显示，不需要则单击“眼睛”，让“眼睛”呈现灰色。[/size]
[size=5][b]问题5：店标做成了，但是店标有点小?[/b][/size]
[size=5][b]答：[/b]店标有点小，是不是因为尺寸大小和像素、分辨率没有设置好呢？[/size] w0DB'u4}g5R9h:y`
[size=5]在PS中一开始新建文件时就应该正确设置好分辨率和像素大小。具体操作步骤如下：[/size]
[size=5]在PS中单击“文件”菜单栏→选择“新建”选项。在跳出的对话框中：选输入新建文字的“文件名”，然后在下面的“宽度”和“高度”一栏分别输入“100像素”（淘宝限定店标的大小只能为100像素*100像素），“分辨率”一栏输入“300像素/英寸”，“模式”一栏输入“RGB模式”即可，然后就可以继续下面的操作了。[/size]
[size=5][b]问题6：新建一个空白文件后，把处理好的第一张图片拖放进去后，再打开第二幅图片制作，还需要重新新建一个文件吗？如果不是重新建，要把第二幅图处打开后拖到哪里呢？[/b][/size]u L]A/M/?z
[size=5][b]答：[/b]不需要重新新建文件了。 只需要直接把第二幅图拖到开始的那个新建文件里即可。大家只需要新建[b]一个[/b]空白文件，然后把处理好的图片分别拖放到这个新建好的空白文件里，调整好后，再把这个新建文件直接导入到Imageready里做成动画，然后存储为GIF格式，再把这个GIF格式的文件上传即可。[/size]
[size=5][b]问题7：已经照着你教的办法做出了店标，就是时间设置不好，有两张图闪的太快，能具体说说时间怎么设置？[/b][/size]!o(lA1q/o&c(i!Ss
[size=5][b]答：[/b]有2张图闪的太快，说明是这2帧的时间你没设置好，你可以把时间设置长一点。在“动画”面板的下方有标明时间，例如“无延迟、0.1秒、0.2秒、0.5秒。。。。”在时间的旁边，有一个小三角形箭头，你点击这个箭头，即可选择时间，一般可选择0.2秒、0.5秒等等，这个你可以根据你的具体情况设置，无延迟即表示2个动画帧之间没有时间间隔，0.1秒表示2个动画帧之时间间隔为0.1秒，依此类推，时间设置越短，动画闪动的就越快。[/size]
页:
[1]
