时光博客 - WEB开发中的可用性和用户体验
全部文章

FLASH网站开发中的团队协作

结合自己的一点理解,如果有不对的地方,请博友们指正和赐教。

apart.gif

大小: 11.27 K
尺寸: 500 x 400
浏览: 251 次
点击打开新窗口浏览全图

首先和客户谈需求的时候,一定要2个角色一起。包括视觉设计师和程序员。缺少任何一方,对客户需求的把握可能就会出现偏差,导致后续开发的难度。

网页设计师:分离客户提出的视觉需求,如类似网站,效果,配色,布局,按钮,表单。

后台开发程序员:负责提取可用的数据信息,以及程序的构架,数据库的部署。

此时,视觉设计师和后台开发程序员同时开工。

网页设计师设计完设计稿河效果图后,并制定“统一风格规范”(这点很重要),虽然能完成大部分效果图,但是网页设计师的设计图很大程度上限制了FLASH设计师的设计思路,而且有些炫酷的效果做平面效果图的时候,根本无法实现分镜效果,需要和FLASH设计师进行深度沟通。所以一定要制定”统一风格规范“,让FLASH设计师自己按照自己的创意和灵感,综合规范来完成flash引导或者loading的制作。

FLASH设计师:完成网页设计师提交过来的效果资源,并加上自己的美术创意。这个FLASH设计师仅仅完成效果,核心AS代码留给AS工程师来完成。

AS工程师:和上面的后台开发程序员沟通完毕之后,确定好数据的通信方式,例如采用xml通讯等等。

后台开发程序员:和AS程序员协作完成数据通信的调试,页面信息的呈现。

最后,我们的前端工程师出马了。完成后台开发程序员AS工程师,提交过来的动态代码,和flash,结合自己制作的HTML页面,完成最终的页面,并提交给客户。客户反馈回来的意见,直接反馈给PM或者前端工程师,然后来负责产品的细节修改(分配到人)。

可以看出来,整个流程中,设计和创意由:网页设计师和FLSAH设计师完成,数据支持由:后台开发程序员和AS工程师完成,而布局和呈现由前端开发工程师来完成。

当然这个是理想的协作模式,中途肯定会出现交叉的工作,这个就取决团队人员本身的综合素质和技术水平。

js中的window.open返回object的错误

在FLASH制作中碰到的,点击进入网站后,需要弹出一个满屏窗口(不带tpolbar)来显示整个FLASH网站。因为flash里面和网页中执行js代码是一样的,所以以网页为例。

系统中用javascript中的window.open后,页面返回了一个[object]。因为系统的原因,必需使用href="javascript:window.open()"这样的格式。所以只能通过以下办法解决。

解决window.open后返回object的错误

  1. <a href="javascript:void(window.open('','','width=200,height=200'))">window.open()</a> 

只在js的外层加上一个void不带返回参数的声明,依稀记得C语言时用过这个声明。

顺便在这里将window.open函数的参数使用也列出来:

  1. window.open函数参数列表 
  2. window = object.open([URL ][, name ][, features ][, replace]]]]) 
  3. URL:新窗口的URL地址 
  4. name:新窗口的名称,可以为空 
  5. featurse:属性控制字符串,在此控制窗口的各种属性,属性之间以逗号隔开。 
  6. fullscreen= { yes/no/1/0 } 是否全屏,默认no 
  7. channelmode= { yes/no/1/0 } 是否显示频道栏,默认no 
  8. toolbar= { yes/no/1/0 } 是否显示工具条,默认no 
  9. location= { yes/no/1/0 } 是否显示地址栏,默认no 
  10. directories = { yes/no/1/0 } 是否显示转向按钮,默认no 
  11. status= { yes/no/1/0 } 是否显示窗口状态条,默认no 
  12. menubar= { yes/no/1/0 } 是否显示菜单,默认no 
  13. scrollbars= { yes/no/1/0 } 是否显示滚动条,默认yes 
  14. resizable= { yes/no/1/0 } 是否窗口可调整大小,默认no 
  15. width=number 窗口宽度(像素单位) 
  16. height=number 窗口高度(像素单位) 
  17. top=number 窗口离屏幕顶部距离(像素单位) 
  18. left=number 窗口离屏幕左边距离(像素单位) 

FLASH执行本地文件

制作FLASH引导页后,类似于电脑随机光盘,光盘内置软件引导安装flash等...往往需要点击后安装相应的软件,也就是执行相应的程序,如WIN下面执行exe安装文件。

但是自从FLASH5以后开始提高了FLASH在本地的安全性。不允许直接执行EXE文件。那么要如何达到我们的目的呢?只要注意好以下几点就可以。

一、调用EXE文件最重要的一点,必须把你的SWF文件先转换成EXE,也就是FLASH的播放器

关于这个怎么转换,看如下图示

sp06.jpg

大小: 47.04 K
尺寸: 423 x 191
浏览: 243 次
点击打开新窗口浏览全图

FLASH里面发布swf文件之后,打开该文件 点击 文件 -> 创建播放器 就可以导出EXE版本

二、要在test.exe同一目录中新建一个文件夹,名字叫“fscommand”,你要调用的外部可执行文件要在fscommand目录下,且不能在子目录下,比如是notepad.exe,请copy notepad.exe到fscommand目录下

三、AS的代码为如下

1、调用exe,

  1. on (release) {  
  2. fscommand("exec""notepad.exe");  

(如果只执行exe,而且愿意将exe文件放在fscommand根目录下,2,3可以不看)

2.要打开其他类型的文件(chm),可以曲线救国

可以通过bat文件做中间跳转来解决其他类型文件和要执行程序目录的问题(如果对产品追求完美)

建一个批处理文件,help.bat.编辑这个文件加入start *.chm(注意中间有空格)
方法同上。将"*.exe",换成"help.bat".

3、打开本地一个目录的话(这个要求比较特殊)

我的电脑:::{20D04FE0-3AEA-1069-A2D8-08002B30309D}
我的文档:::{450D8FBA-AD25-11D0-98A8-0800361B1103}
控制面板:::{20D04FE0-3AEA-1069-A2D8-08002B30309D}\::{21EC2020-3AEA-1069-A2DD-08002B30309D}

如打开我的电脑:
加在FLASH的按钮上:
on(release){
getURL("::{20D04FE0-3AEA-1069-A2D8-08002B30309D}");
}

现在这个问题已经解决,FLASH制作,当中遇到过不少问题,以后会慢慢的和大家分享。

收到Google的PIN码了

苦等了一个多月才收到,从美国来个信件,看来是相当的麻烦...中间申请过2次,每次都让同学去帮我学校邮局看,辛苦了...在此告诉博友们,一定要等哦,千万不要着急,相信google,正如相信他们的数据一样。如果没有收到一定要去邮局看,可能问题出在邮局身上,现在国企的办事效率还待提高...

090512a001.jpg

大小: 23.73 K
尺寸: 500 x 375
浏览: 248 次
点击打开新窗口浏览全图
090512a002.jpg

大小: 68.39 K
尺寸: 500 x 375
浏览: 239 次
点击打开新窗口浏览全图

时光博客改版更新

工作太忙了,看了下时间,将近有1个月多的时间没有更新了,博客的alexa排名也下降了3W名,哭泣中...最近忙里偷闲,更新下博客,改善了一下皮肤。这个iGoogle皮肤早在一个多月前就做完了...花了几天的时间整合到Sablog博客系统里面。

新的博客皮肤加入了一点点ajax技术,因为框架太臃肿,而我需要的功能又比较少,所以就用原生的JS来实现。新皮开始考虑yslow 2B等级,从F级已经提高到C级,对JS和CSS做了压缩优化,JS的压缩可以参考YUI Compressor 或者 Douglas Crockford 大牛的 JSMIN 我使用的是PHP版。其中YUI Compressor兼具有压缩CSS的功能。因为一些服务器的原因和CDN,博客切换主题的特殊性,主题图片加载有点大,所以,整体影响了YSLOW grade

发现这些酷似Google导航按钮没有?

sp0111.jpg

大小: 4.94 K
尺寸: 187 x 38
浏览: 259 次
点击打开新窗口浏览全图

点击体验一下?

Sablog-X 2.0 mtime皮肤发布

screenshot.jpg

大小: 111.35 K
尺寸: 500 x 274
浏览: 337 次
点击打开新窗口浏览全图

皮肤名称:  mtime

适用版本:Build 20081204 (最新的版本尚未测试,请慎用)

皮肤大小:407K

下载地址:mtime.rar

img文件夹里面提供LOGO的源文件,可以自行修改,改完了存为PNG32位替换LOGO即可。

另外sidebar提供了一个照片轮换,其中的图片地址参数在这个文件里面

mtime\madrid.xml

  1. <track> 
  2. <title>我的机器人女友</title> 
  3. <creator>liupengs</creator> 
  4. <location>http://liupeng.us/templates/mtime/slide/mygirlfriend-mv.jpg</location> 
  5. <info>http://liupeng.us/archives/46/</info> 
  6. </track> 

三个节点,分别位图片上面显示的文字,第2个可以随便填,第三个图片的绝对地址,第四个点击图片的连接地址。
模板里面用了我博客的几个示例图片,如果不喜欢可以自行替换。把图片放在相应的,mtime/slide目录中即可,图片地址位225*303

皮肤使用方法:下载后,解压,将mtime文件夹上传到空间根目录templates中即可,再登录后台,在模板处设置使用mtime即可!

Sablog-X 2.0 iYahoo皮肤发布

皮肤名称:iyahoo

适用版本:Build 20081204 (最新的版本尚未测试,请慎用)

皮肤大小:119K

screenshot.jpg

大小: 56.68 K
尺寸: 309 x 180
浏览: 313 次
点击打开新窗口浏览全图

下载地址:iyahoo.rar

喜欢的自己拿,很早之前做的,一直使用着,采用了YUI设计思想。皮肤经过长时间测试,对SEO比较友好,支持主流浏览器。

代码简洁,布局简单,看惯了花哨的网页的可以尝试下,里面提供了LOGO文件。

做LOGO的时候,可以用FIREWORSK做个LOGO,背景色透明,导出1个32位的平面PNG替换原来的LOGO即可。

有问题可以在我博客留言,支持一切关于博客皮肤问题的回答,技术之外的闲聊也来者不拒!

皮肤里面可能有我自己的GG代码,里面有注释,自己删除即可。

皮肤使用方法:下载后,解压,将iYahoo文件夹上传到空间根目录templates中即可,再登录后台,在模板处设置使用iYahoo即可!