推荐阅读
UI设计师最需要了解的设计工作流程
每个设计师看文章都有自己的喜好，有些人喜欢看一些纯设计技法或者设计教程，有些人喜欢看一些偏理论的知识点，比如工作经验、设计流程、设计分析等等。其实作为一名UI设计师应该看文章不要挑剔，每一方面都要看一下，这样才能更好的提升自己的设计水平和管理能力。欢迎关注作者所在的丁香园设计团队微信公众号：「花厂设计招待所」今天主要来跟大家聊聊我自己的工作习惯和方法，相信作新人看了一定会收获很多~1. 一般怎么规划好工作上的需求?我使用teambition软件来管理我的日常需求，teambition是一款团队协作软件，由于公司使用的是tower，所以目前teambiton我是用来管理个人需求。我用过tower，可能觉得界面不够美观，有些地方体验不是特别好，不过用来团队协作应该也是不错的。由于朋友的推荐，我就尝试用teambiton来管理个人的日常需求，发现已经能够满足日常的工作需要了。下面我放上几张截图来说明我如何使用teambition。因为teambition功能点非常多，这里只是做个示例，希望有兴趣的自己体验一下。产品设计流程图（PM）App设计流程图适合全新App设计，整理出所有大致需要做的东西，然后按照从左到右的顺序分别完成。
使用Photoshop给外景人像添加唯美逆光效果
最终效果原图1、打开素材图片，创建可选颜色调整图层，对黄色，青色进行调整，参数及效果如下图。这一步主要把草地的颜色转为橙黄色。2、创建色相/饱和度调整图层，对黄色进行调整，参数及效果如下图。这一步把草地颜色转为红褐色。
Camera Raw各版本英文变中文的方法
很多朋友对Photoshop CS2 RAW格式插件的安装没问题,只需拷贝Camera Raw.8bi文件到相应的文件夹就可以了,但是显示的是英文,希望此方法能够解决大家将Camera Raw各版本在Photoshop CS2 中英文变中文的方法的问题。高手就不要看了！ Photoshop CS2 RAW格式插件的安装路径: PS CS2英文版，安装路径是：C:\Program Files\Adobe\Adobe Photoshop CS2\Plug-Ins\File Formats把Camera Raw.8bi拷贝到这个目录下就行 Adobe Photoshop CS2简体中文版的安装目录：把Camera Raw.8bi文件copy到C:\Program Files\Adobe\Adobe Photoshop CS2\Plug-Ins\文件格式 目录下面即可 安装好cs2后，将RAW格式的图片导入PSPScs2,若显示的Camera Raw英文界面,选择open,将图片导入PS中，选择文件，看看有没有关闭并转到Bridge选项，若没有，需要进行升级，即Adobe Bridge，Adobe Bridge 1.0.2 update的下载地址：http://download.adobe.com/pub/adobe/...idge102Win.zip。升级后,打开PScs2,文件--关闭并转到Bridge--提示保存图片，是否？进入在桌面Adobe Bridge中--Edit(编辑)--Preferences....(首选项)--Advnaced(高级)--Language(语言)--选择Chinaexe,Simplified(简体中文)－－OK(确定)--关闭Adobe Bridge,重启PS，打开文件就出现RAW的中文界面了,此方法适合于Camera Raw各个版本
Flash动态解析Web应用程序服务器路径
玩过Flash+ASP/PHP开发的朋友都知道，在Flash软件里测试Flash从后台脚本读取数据的时候，不能直接的用如“loaddata.asp”这样的路径，必须是http://www.domain.com/Application/loaddata.asp 或者 http: 开头的路径。有些人问了？为什么呢？当FlashPlayer里测试的时候收到load("loaddata.asp")这个命令的时候，他会直接读swf文件路径下的 loaddata.asp文件。但由于没有经过IIS的运行处理，直接读入Flash内部，当然，读出的结果就是%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%类似这样了，所以就无法根据我们的意愿来处理数据了，而当FlashPlayer执行load("http://www.domain.com/Application/loaddata.asp")这个命令的时候，他就不再是本地的TXT文件读取命令，而是一个HTTP请求，FlashPlayer把这个请求发送到HTTP服务器，服务器的IIS解析脚本返回结果后Flashplayer便可以正确的处理这些数据了。(废话一堆)当然如果你清楚了路径的关系，也可以把写load("loaddata.asp")写到Flash里，上传的时候，把.asp .swf 和包含 .swf的html文件，都放在一个目录里就行了。特别指出的是swf 在取得路径时，是取包含他的html和.asp的关系的。而不是 swf 与 asp的路径关系。说起来已经是有一点晕了，但如果理解了路径的关系，那就非常简单了。好了，进入正题，虽然输入HTTP路径就可以正确读取数据，但是在程序开发测试阶段可能经常需要开发者更换服务器，那样就对我们造成了一定的麻烦，你每更换到另外一个服务器上面的时候就要修改一次他的HTTP路径，如果读取了N(N≠0)个文件，难道还要手动修改N次？当然不是，那么通过下面这个小技巧便可以轻松解决这个问题：把SWF文件嵌入到一个ASP页面里面，输入如下代码：<%Dim PageUrl,URLarry,i,ApplicationURLPageUrl="http://" & Request.ServerVariables("http_host") & Request.ServerVariables("url")Response.Write "PageURL="&PageUrlURLarry=Split(PageUrl,"/")Arryubound=ubound(URLarry,1)-1For i=0 to ArryuboundApplicationURL=ApplicationURL&URLarry(i)&"/"NEXTResponse.Write "<br>ApplicationURL="&ApplicationURL '这一句仅仅是测试代码是否正确，可省%>好了，对ASP有一定了解的朋友应该都明白代码是什么意思了，PHP也可以用这种思路来写，下面在SWF路径中可以这样写 <%="flash.swf?myserver="&ApplicationURL%> 这样就可以通过URL把变量传递给SWF文件，在Flash影片中便可以直接访问这个变量了，就是_root.myserver。 好的，现在来让我们测试一下结果，先编写一个loaddata.asp，让他返回一个back变量。打开FLASH，新建一个文件。然后在场景中拖入两个动态文本框，分别命名为txt.url 然后在第一帧输入以下代码：mytxt=new LoadVars()mytxt.load(_root.myserver+"loaddata.asp")mytxt.onLoad=function(sUCcess){if(success){
最新发布
【Director教程】制作屏保
问题我想做一个遮住整个屏幕的屏保程序,大约有五十张小图不断重复直到鼠标或是键盘有所动作。我听说这些能用lingo实现，通过list和miaw。我有一定的lingo基础，但我对这些却毫无头绪。 回答你的需要包含两个步骤。首先，你需要一个能自动适合屏幕大小并且当鼠标或键盘有所动作时退出的执行文件。第二步，你需要将这个执行文件转换为自运行的屏保。 第二步很容易实现。到http://www.macsourcery.com/去购买cinemac。（好狠）这是一个非常好的将director执行文件转为屏保的程序。不要管它的名字，它在两个平台都运行的很好。 现在，让我们来创建这个执行文件。你所描述的屏保是在屏幕不同位置上随机出现精灵的屏保（象大多数屏保一样）。将你的舞台尺寸设置的和你期望的一样大。在这个演示中，我将舞台尺寸设置为1152*870。即便舞台设置的这么大，在大多数情况下只是它的一部分可视。这部分是我们放置精灵的地方。这便意味着我们希望知道播放的屏幕的大小。 你可以通过desktoPRectlist命令来找到播放屏幕的大小。举例来说，打开消息窗口作如下操作：put the desktoprectlist----[rect(0,0,1152,870)] 正如你所看到的，结果是rect…..注意它是包含（encapsulated）在列表里的，尽管只有一个条目。如果你有两个显示器，那么你会看到对应于第二个显示器的第二个条目。在这个例子里，我假设只有一个显示器。在我的这个startmovie的命令里，我首先将得出desktoprectlist并且从这个rect列表中获取第3和第4个值。这些值是屏幕右边和底部的值，我会将他们做为全局变量（grightlimit和gbottomlimit） on tartmovie me global grightlimit,gbottomlimit,gmouselocset screensize=getat(the desktoprectlist,1)set grightlimit=the right of screensizeset gbottomlimit=the bottom of screensizeset gmouseloc=point(the mouseh,the mousev)set the keydownscript to “halt” end先略命令的最后两行，我一会再解释。 现在我们知道了屏幕的大小，我们需要做的是在屏幕许可的范围里随机交替放置精灵。最简单的，我们将50个演员放置到演员表的头50个位置里。这样，我们只要涉及到演员1到50。
了解父脚本和面向对象----1
翻译自 http://www.macromedia.com/devnet/mx/director/articles/oop_dir_Flash.html感谢英语角和eiffelqiu的大力帮助 1&1.计划和实现对象 开发者经常凭借图表来分析游戏各部件的交互关系 , 检查他们的状态 ,并且绘制映射出他们行为间的交互关系。 大多数开发者最先开始编程都是采用过程化编程。为了做这些,他们创建了一个方法(句柄或函数)来完成一些基本的运转并且有时返回一个值。每个方法都是一个过程。 注意: 过程程序设计是一种程序设计方法。它意谓程序撰写在一种逻辑上的连续的方式。 程序工作通过一个简单的顺序的 原因/结果 事件，而且顺序是比较容易预料的。 过程经常非常特定的到一个单一程序;你在另外的一个程序中不大可能再容易的使用它们。 Director 和 Flash都可以让你选择使用对象,将一些过程赋予脚本实例,让你可以为你的游戏创建一个更模块化的设计和执行。 这种轻微但有重要意义的改变在程序设计上通常被叫做面向对象设计, 或 OOP 。 注意: 面向对象设计也是一种程序设计方法。 在面向对象设计中，你仍然使用过程，但是你使用一个最初的脚本 (被称为一个类)作为模板去创建没有数目限制的实例对象, 每个知道如何运行过程和包含封装的全局变量即是属性。这些变量是专用的，因为他们属于这个对象的这一个实例, 但是它们是持久化的（当程序运行后他们持续存在变量中)。 考虑两者都程序地设计一艘船像一个对象。 一艘船需要加速,转向,倒退, 和其他的一些事件。它有许多属性像油漆彩色，大小和浮力。 现在如果你想制造一艘以上的船只,你需要给一艘船的每个实例一个单独的脚本。 使用过程程序设计方法,你会为第二艘船的油漆彩色，大小和浮力设置新的变量名。 boat1.bouyancy=20boat2.bouyancy=23在一个面向对象的模式中，一个脚本的对象或实例包含类脚本所定义的元素。这意味着boat1有它自己的油漆属性,而且其它的船也是。 无论你呼叫它什么: 一个mc,一个父脚本,一个行为，一个精灵或一个实例, 在每个 Macromedia flash 和shockwave游戏中的基础单元是一个对象。 因为 ActionScript 和lingo都支持面向对象程序设计方法,而且因为游戏中经常要求相似对象的许多实例, 创造模仿这些结构时常是最直觉的和明智的方式。
ActionScript 和 Lingo 的面向对象设计
对象的概念和面向对象的编程方式在许多计算机语言中都有，然而在对象模型的实现上,不同的语言却有着或大或小的差别。 ActionScript 和 Lingo 都可以按照面向对象的方式编程，事实上，Macromedia Flash 和 Director 都在自己的实现中遵循着基本的面向对象模式 Macromedia Flash 和 Director 在面向对象实现上最大的差别在于 Macromedia Flash 使用完全的对象驱动方式，因此它使用原型而不是类作为对象实例生成的基础 在 Macromedia Flash 中，一切事物都是对象，因此，几乎都是采用模板脚本来自动实例化对象本身的。 这些自动实例化的类脚本被称作原型 Director 使用了更典型的方式。 原始的类脚本在 Director 中被称为父脚本，它们仅仅作为创建对象的模板而存在。 考虑到这点，面向对象的结构对我们来说一点也不陌生，因为它们是在模仿我们对事物基本组织结构的理解以及现实世界中的想法
对象的性质
一个对象是一个不连续的实体。称它为一件东西，一个结点或一个构件是合理的。在面向对象编程中，对象是产物或被类产生的实例。对象可以有属性 , 展示行为，执行方法，和赋值。 screen.width-333)this.width=screen.width-333\" src="/Upload/2004_Pack/3012434350293.gif">图 1. 这一个类模板是八个实例的源。 可重复使用性和封装是二个最明显的面向对象编程的好处。你可以使用一个类脚本产生无限量的专用实例对象，这里的每一个对象都是一个受保护,封装的实例。换句话说，实例不影响或改变类；他们不影响或改变彼此。 screen.width-333)this.width=screen.width-333\" src="/Upload/2004_Pack/3012435159490.gif">图 2.每个实例包含相同的属性和句柄如类，但是每个实例的属性数值被封装。你可以改变他们而不影响其他实例或类脚本。 如果这是你第一次接触面向对象观念,最后一点可能很难理解。不要惊慌。我们就要去讲述一些不同类型的对象。首先是有点像一个实际的物体 , 举例来说，一台电冰箱 。称呼这个第一个种类为复合对象。 screen.width-333)this.width=screen.width-333\" src="/Upload/2004_Pack/3012435647888.gif">图 3. 复合对象是基于实际的事物的一个对象 , 像这台电冰箱。 电冰箱对象不是空的。它有一系列内部的架子，而且每一个包含其他的物体。举例来说，顶端架，在它里面有一盒牛奶。那么简要重述,电冰箱有一盒牛奶。这盒牛奶，再进一步，它里面牛奶有一个量。 screen.width-333)this.width=screen.width-333\" src="/Upload/2004_Pack/301244243741.gif">图 4. 复合对象的在各种不同的对象之间的 \"has-a\" 关系与每天事物的空间关系类似。 复合对象有时被叫做 \"has-a\" 对象因为在多重对象之间的关系是一个暗示空间包含的关系。 你使用的电脑显示一个由带有色彩值的像素组成的屏幕。在这些对象之间的关系和复合对象之间的关系是类似的。
【Director教程】制作控制精灵的blend行为
我试着想写一个行为。当鼠标移到一个精灵上时，我希望另一个精灵能够改变它的混合值（blend），是特定的下一个通道的精灵。我在指定具体通道号的时候能够实现这个效果，但我不知道如何做一个行为，这样我只需从库中调用。 一个非常好的问题！我始终倾向于避免写的代码过于局限。让我们来合计一下你所需要的。我们先假设你的行为默认状态下对下一个通道产生作用（the sPRite+1）。这会使代码容易编写。 我们将创建一个属性来保留受影响的精灵的参数。我把它叫做pblendsprite，并且我将它写在beginsprite句柄中。 property pblendspriteon beginSprite me set mySprite = the spriteNum of me set pBlendSprite = mySprite + 1endon mouseEnter set the blend of sprite pBlendSprite to whateverend 很容易，不是吗？让我们在这个基础上再进一步。让我们来制定它在默认状态下是针对下一个精灵，但是，它可被编辑改变。这是一个小窍门。在上边的行为中我们并不知道具体的精灵编号，直到电影运行，beginsprite事件激发。但是，如果我们希望默认的数字显示在getpropertiesdescriptionlist对话框中，我们需要立即得到这个数值----在我们将这个行为赋予精灵的时候。 这个诀窍在于使用\"the currentspritenum\"。查一下lingo字典的详细资料。这个属性返回的任何在最近的事件中的精灵通道号。很明显，将行为赋予精灵也是事件（？？不知这里对不对）。这对我们是一件好事，因为我们要得到精灵的通道号（然后再加1） property pBlendSpriteon getPropertyDescriptionListset blendSpriteNum = the currentSpriteNum + 1set p_list = [#pBlendSprite: [ #comment: \"Which Sprite blends?:\",_ #format:#integer,#default: blendSpriteNum]]return p_listendon mouseEnter meset the blend of sprite pBlendSprite to whateverend
【Director教程】用距离控制声音
我需要将一张图片放到舞台的*，以便鼠标靠近的时候声音会马上淡入，同时图片做淡入淡出的发光效果。 还记得高中学过的几何学如何计算直角斜边的长度吗？我们来回顾一下。假设你知道了两条直角边x,y。计算第三条边的长度的公式是 X2 + Y2 = Z2 很容易得出z的长度始终大于x或y的长度。 现在我们把它应用到你问题中去。设想一下直角边的斜边z由你的精灵的坐标和鼠标的坐标来决定。x是你的精灵和鼠标的水平距离，y是你的精灵和鼠标的垂直距离。现在，以上的公式可改为 set x = the mouseH - the locH of sPRite whateverset y = the mouseV - the locV of sprite whatever x2 + y2 = the distance2 这就是我们要用的概念。因为距离永远不可能为负数，当我们编写lingo的时候，我们使用绝对值属性来设定x和y。同时，我亲向于使用描述性的变量来定义x,y。在这个例子中我将使用hinc和vinc来表示“水平增量和垂直增量”。 接下来的步骤就是是这个距离和以下的事件关联：1）声音通道的音量。2）精灵的混合值（发光的精灵）。音量的范围是从0到255，既然我们希望声音在鼠标接近的时候增加，我们可以简单的制定音量等于255减去距离。为了增强可操作性，我创建了“fade\"变量。我们使用“fade\"变量来乘以距离，这样我们可以使音量在较短的距离里增减。（fade的值越大，变化的越快）。 最后，你需要改变墨水的混合值，来实现发光的效果。在这个行为里，我们让这个混合值与音量关联。混合值由1到100，为了使它适应音量的0到255的变化范围，我们设定混合值为 数值/256。 以下便是这个行为。你需要制定一下发光的精灵。
【Director教程】locz的使用
我刚使用d8并且我正在做我的第一个项目。基本上是一个拖动的七巧板游戏。无论如何，当这些部分被打乱，你要拖动的时候，有些部分就被遮挡了。我希望当鼠标点击的时候，这部分能自动的移到前面来。 这儿有几种方法来解决你所说的问题。第一种方式是动态的改变演员所在的通道级数，也就是改变演员的z坐标。我写了一片关于它的文章，叫dynamic sPRite re-ordering----这确实有一点用词不当，因为精灵并没有从新排列，而是演员。（省略一部分） director渲染舞台的时候，从1通道开始直到最高的通道，你可以给它一些特殊的指令。这有一个特殊的通道属性叫做locz，它允许你设置渲染通道的层数。数值越大，它就越在上面。 那么，这儿便是可指定给你的七巧板元素的行为，它可使鼠标点击的元素到舞台的最上面。。。还有在鼠标抬起的时候返回到原有通道。 property pSpriteon beginSprite me pSprite = sprite(me.spriteNum) end beginSpriteon mouseDown me pSprite.locZ = 500 end mouseDownon mouseUp me pSprite.locZ = me.spriteNum end mouseUpon mouseUpOutside me mouseUp me end mouseUpOutside 所有的行为是在鼠标点击的时候改变精灵的locz。在这个例子里我使用了一个虚拟的通道500，其实你可以使用任何高于你现有通道数的数值。只是为了好玩，我想核实一下如果我是用0或是负数会发生什么。结果，精灵跑到了舞台后面。
【Director教程】图片缩放
提问： 我希望能将一张位图从640到800做一个平滑的变化。我试着让它在1到50帧变化，别的都还行，只是不够平滑。请告诉我秘诀。 回答： 如果你确实希望让图片平滑的移动，大部分情况下最好的解决方法是用lingo代替在通道中的关键帧动画。最大的理由便是lingo允许你调整动画而不用增加和删除关键帧。 创建你的让图片变大的行为，第一步是初始化几个会决定图片显示的变量。 on beginsPRite mepzoomsteps=200plargerect=(0,0,400,300)psmallrect=(0,0,200,150)end 当你的精灵开始的时候，它将初始化三个变量。第一个，pzoomsteps,将决定间隔的量。间隔越长，动画越平滑，同时动画时间也越长。你需要试验几次以找到适合你电影的值。另外的两个值是你图片的两个不同尺寸。 一旦你已经初始化了你的变量，接着你需要另一个程序来开始这个动画。这个程序可是被另一个按钮激发，或是帧语言，甚至是点击这个图片。 on startgrow mepzoomcounter=0tiemout(\"growimage\").new(40,#growimage,me)
【Director教程】匹配精灵游戏
问题 我正在做一个锻炼记忆力的游戏，用户在点击了一个精灵后，必须在两秒以内点击另一个与它匹配的精灵。我用全局变量来记录匹配的变量，但我不确定如何来做时间记录这部分工作。我已经尝试过使用”the shorttime”，但我找不到一个好的方法将所得的时间相减。 回答 用时钟来功能作为运算时间的基础，在dirctor里是非常复杂的部分-----尽管我不是很清楚为什么必须这样。（the time始终是作为字符串输出的，而字符串对我并没有太大的意义。）无论如何，我们并不需要担心，因为我们不使用the short time。我们确实不需要知道具体的时间是多少。我们更愿意了解一个事件和另一个事件的间隔的时间。这就是说，我们更需要一个秒表，而不是一个钟。幸运的是用timer的命令很容易做到这一点。 Timer是一种自由的计时工具。它以”ticks”------也就是60分之1秒计时。你唯一需要掌握的命令就是”starttimer”，这会使timer复位到0。只要开始计时，你可以在任何时候检查数值以便得知过去的时间。 让我们来写一个行为，以接受这个小小的挑战。首先，我们来对这个行为来定一下位。当你将这个行为附加到精灵上的时候，你会希望能够输入一个名称，这样对应的精灵也用同一个名称。你也会希望能够定义两次点击的延迟时间（用ticks----60ticks等于一秒）。这将是你可以将这行为重复使用到任意一组精灵上。第二步，在运行的时候，当精灵被点击，以下是需要做的事情。 1． 判断第一次和第二次点击的是不是一组。 2． 如果是第一次点击，那么便需要在全局变量中储存这一组的名字并且开始计时。 3． 如果是第二次点击，那么便需要核实是否与上次点击储存在全局变量中的名称一致。 4． 如果名称相符，那么便需要检测是否超时。 5． 在第二次点击后并且检测后，需要将全局变量复位到0。 以下是这个行为。 ----timermatch behavior----copyright © 1998,zzp online,llc(它已经5岁了)PRoperty pgrouppropert ptimelapseglobal gclickgropon getpropertydescriptionlistset d=[:]addprop d,#pgrop,[#default:#first,#format:#symbol,#comment:”匹配的组”]addprop d,#ptimelapse,[#default:120t,#format:#integerl,#comment:”间隔时间”]return dendon mousedown meif gclickgrop=#null thenset gclickgroup=pgroupstarttimerelseif gclickgroup=pgrop thenif the timer<120 thenalert “这是一组”elsealert “太慢”end ifelsealert “不是一组”end ifset gclickgroup=#nullend ifend
【Director教程】解析文本和列表
问题： 我有一个名为“fonts”的域和如下的文本。 [\"MezzMM_375 RG\", \"MezzMM\", \"Cottonwood\", \"Lithos Regular\", \"Minion_Condensed\", \"Minion Ornaments\", \"Poetica ChanceryI\", \"Utopia\", \"Viva_BoldExtraExtended\", \"Viva Regular\", ...\"SurethingSymbols\", \"Zephyr\"] （这是简化了的。原件有一百多名字） 我需要将其转换为按字母顺序排列的有序列表（不是程序列表），看上去应该是这样： ArialArialBlackArialNarrowBookAntiquaBookmanOldStyleBookshelfSymbol1...WingdingsWoodcutXcastZapfElliptBTZephyr 这样看来，我需要删除引号，逗号和括弧，将逗号替换为换行。 回答： 我之所以选择你的问题主要有两个原因。第一，再没有比理解如何处理文本这个概念更为有用的了。我几乎记不记来有多少次我使用这种技巧来处理类似这样的处理外部文本文件，核实用户输入等。 第二点，你的问题指出一个事实，好的开发者用lingo来帮助自己编辑。我们将要做的其实是一个编辑工具-------也许永远不会在程序运行中使用。这种类型的编辑器能节省你大量的时间。更重要的是它可以帮助你避免手动的输入数据题条目。 现在，我们来解释一下。我们需要做两件事。按字母顺序排列列表和处理不想要的字符。让我们从区别lingo 列表和字符串开始。在lingo中，字符串是包括在引号任何顺序的字节。同样的字符串能够出现在域中，然而域只能保留字符串，所以你并不需要用引号把字符串引起来。 你应该习惯看到扩在括弧里的列表。就象这样：