Weber Design Labs » Flash http://www.weberdesignlabs.com/blog Open Source Thought Thu, 01 Jul 2010 19:49:36 +0000 http://wordpress.org/?v=2.9.2 en hourly 1 Flash on Android vs. HTML5 http://www.weberdesignlabs.com/blog/2010/05/flash-on-android-vs-html5/ http://www.weberdesignlabs.com/blog/2010/05/flash-on-android-vs-html5/#comments Sat, 29 May 2010 07:15:01 +0000 Stephen http://www.weberdesignlabs.com/blog/?p=271 Mobile is becoming more and more important and with that how interactive our mobile experiences are becoming is also more and more important. There are many interactive technologies on the web, but none have come close yet to the wide-spread use of the powerful Flash. HTML5 is being constantly referred to as the Flash killer and while it might be a good replacement for video on the web in some circumstances, it comes up short in other areas and is generally at least several years behind Flash. HTML5 is new, but the technology that makes HTML5 interactive (JavaScript) is not new at all. Javascript is extremely powerful, but it is not meant for graphical animation, 3D and a lot of what Flash does naturally. HTML5 will have its use, but it is not yet a replacement for most of the uses for Flash. I have developed in Javascript and Flash and I for most uses I would develop rich interactive applications/interfaces in Flash over Javascript.

Here is Flash 10.1 running on Android:

As a note, this video is made by an Adobe Flash Platform Evangelist and Flash 10.1 is still in beta.

Here is another video that shows the speed of HTML5 and the speed of Flash. Flash generally is quicker in performance than HTML5.

An important part of the evolution of the mobile platform is a standard development language/environment that can reach across to many mobile devices. As Apple moves farther away from a standard mobile development language (Objective C) and Android uses Java for its applications, the one that can be deployed on all Android devices, Nokia, Blackberry, etc. is Flash. This allows a developer to take the same code written for the Android and use it on Nokia and Blackberry devices without too much modification, which means businesses can reach more people with less development cost/time. This is critical for mobile to move forward.

]]> http://www.weberdesignlabs.com/blog/2010/05/flash-on-android-vs-html5/feed/ 0 Online Video Player Standards http://www.weberdesignlabs.com/blog/2010/01/online-video-player-standards/ http://www.weberdesignlabs.com/blog/2010/01/online-video-player-standards/#comments Tue, 19 Jan 2010 21:11:54 +0000 Stephen http://www.weberdesignlabs.com/blog/?p=258 Media is now common place to have on a site. There is usually an element of video to every professional site. It is important to make video players that allow the user to focus on the content and not on the controls. Keeping a clear standard of video controls helps the user to quickly grasp how to use your video player.

Here is some research that will allows us to find the most common controls and make sure that those controls are in the appropriate video players and that the user interaction with those controls is clear and understood.

Download Online Video Player Standards (1869) ]]> http://www.weberdesignlabs.com/blog/2010/01/online-video-player-standards/feed/ 0 Flash 10 Coverflow http://www.weberdesignlabs.com/blog/2009/12/flash-10-coverflow/ http://www.weberdesignlabs.com/blog/2009/12/flash-10-coverflow/#comments Thu, 17 Dec 2009 02:22:41 +0000 Stephen http://www.weberdesignlabs.com/blog/?p=242 The last version of the coverflow was made several years ago and its still quite popular (over 700,000 downloads on just version 2). So I decided to make a new version, this new version takes advantage of the new Flash 10 3D capabilities, which is perfect for this particular use. It allows for the Flash to load faster (because its not using Papervision3D) and most important preform much faster. Now users can add a lot more items to the coverflow and still have very snappy performance.

Here are the benefits over the previous coverflow version:

  • Improved Preformance
  • Faster Load Time
  • Easy Modification through XML
  • AS3 Standardized Code
  • Easy Class Structure

And of course you still get many of the benefits of the last version, such as the XML Based (Images, Links and Titles).

I have recently updated the code to help people that are not so familiar with Flash, but still want to use the code. I have included a few flash vars, if they are not provided there are defaults in the code. Here are the flash vars:

flashvars.xmlPath = “xml/data.xml”;
flashvars.backgroundColor = “0×000000″;
flashvars.labelColor = “0xFFFFFF”

“xmlPath” is the path to the XML file.
“backgroundColor” is the color of the background.
“labelColor” is the color of the text label in the middle of the coverflow.

So please download it, play with it, make it better and post your code in the comments to help everyone out. Lets make this piece of code the best it can be!

View Demo

Download Flash 10 Coverflow (9030)

NOTE: I would not recommend trying to learn flash with this file. There are a lot of people asking how to change text color, if you are having these requests I would suggest going through some Lynda.com Flash tutorials to get you familiar with Flash or hiring a Flash developer to help you out.

Hope you enjoy and post additions you would like on the next version (I’m thinking of video handling).

]]> http://www.weberdesignlabs.com/blog/2009/12/flash-10-coverflow/feed/ 210 Flash Google Maps Store Locator http://www.weberdesignlabs.com/blog/2009/12/flash-google-maps-store-locator/ http://www.weberdesignlabs.com/blog/2009/12/flash-google-maps-store-locator/#comments Tue, 15 Dec 2009 07:27:18 +0000 Stephen http://www.weberdesignlabs.com/blog/?p=244 Modern Habits feels it is important to give back to the community and encourage learning of new technologies. So we have provided an example which you are welcome to take and use wherever you want. This example is for Danny DeVito’s Limoncello (http://www.dannyslimoncello.com), which we have the pleasure of working for. This is to help people to find his excellent product. Its a store locator in Flash Actionscript 3 using the Google Maps API.

This example shows a map of the nation which allows the user to specify a general area and then sends them to the chosen state where it loads from an XML the locations and displays them in a nice little Lemon icon. If the user double clicks the Lemon icon it will ask for the user’s address and will calculate directions and display them on the right side of the screen. For demo purposes only California and Colorado are working.

You will need to get a Google Maps API key, which can be found at the URL below:
http://code.google.com/apis/maps/signup.html

View Demo

Download Flash Google Maps Store Locator (342)

]]> http://www.weberdesignlabs.com/blog/2009/12/flash-google-maps-store-locator/feed/ 1 Flash iPhone Apps http://www.weberdesignlabs.com/blog/2009/12/flash-iphone-apps/ http://www.weberdesignlabs.com/blog/2009/12/flash-iphone-apps/#comments Fri, 11 Dec 2009 02:50:51 +0000 Stephen http://www.weberdesignlabs.com/blog/?p=215 Flash Professional CS5 will enable you to build applications for iPhone and iPod touch using ActionScript 3. These applications can be delivered to iPhone and iPod touch users through the Apple App Store.*

A public beta of Flash Professional CS5 with prerelease support for building applications for iPhone is planned for later this year.

Here are some videos that get us really excited about developing iphone applications in Flash:

Some obstacles are going to be:

  • Resource Management Is Now A Much Bigger Concern
  • iPhone Approval Process Is Going To Be Longer Because Of The Flood Of Flash Applications
  • UI Considerations are much more important as people are used to a specific UI and Flash will be changing that
]]> http://www.weberdesignlabs.com/blog/2009/12/flash-iphone-apps/feed/ 0 Sound Visualization in Flash http://www.weberdesignlabs.com/blog/2009/08/free-visualization-with-papervision3d-source/ http://www.weberdesignlabs.com/blog/2009/08/free-visualization-with-papervision3d-source/#comments Fri, 21 Aug 2009 23:26:59 +0000 Stephen http://www.weberdesignlabs.com/blog/?p=168 So I wanted to make a website for a electronic music group I love called JUSTICE. I offered them a free website with all the bells and whistles because their music has inspired me and helped me through many late nights. Sadly, their record label turned me down for their MySpace page.

So I thought I would release the source code for my project to everyone, so hopefully some good will come out of my hour or so worth of work. This is one of the more sloppy pieces of code I have done, so please excuse that.

Watch the demo of the site:

Download Download Visualization Source (530) ]]> http://www.weberdesignlabs.com/blog/2009/08/free-visualization-with-papervision3d-source/feed/ 0 Flash Cheat Sheet http://www.weberdesignlabs.com/blog/2009/07/flash-cheat-sheet/ http://www.weberdesignlabs.com/blog/2009/07/flash-cheat-sheet/#comments Wed, 15 Jul 2009 17:58:23 +0000 Stephen http://www.weberdesignlabs.com/blog/?p=156 So if you know Flash pretty well ignore this post. This is for the people just starting out who are trying to get started in Actionscript 2 or Actionscript 3. Its a simple tool, but hopefully it helps some people out and they use it every once in awhile when they need some quick code. Basically its a cheat sheet that gives quick code on how to do some common things that we all do in Flash everyday. Leave a comment if you use it. :-)

View Cheat Sheet

Also if you want to know how I did it, right click and select “View Source”.

]]> http://www.weberdesignlabs.com/blog/2009/07/flash-cheat-sheet/feed/ 3 AS3 Video Coverflow http://www.weberdesignlabs.com/blog/2009/06/as3-video-coverflow/ http://www.weberdesignlabs.com/blog/2009/06/as3-video-coverflow/#comments Sat, 06 Jun 2009 20:31:37 +0000 Stephen http://www.weberdesignlabs.com/blog/?p=131 So everyone likes the coverflow effect and everyone is using video these days.
I wanted to do this effect in AS3 and thought it would be nice to release it to everyone.
Its not polished or paticularly stunning (in fact its pretty plain), but its just an example of how to do it and some good code to get you started in the right direction. I don’t recommend this for people who are not familiar with flash or are beginners, just a caution – but its a great opportunity to learn!

View Demo

Download Video Coverflow AS3 (1882) ]]> http://www.weberdesignlabs.com/blog/2009/06/as3-video-coverflow/feed/ 12 Flash Friday – 3D Trails, Flash Blackholes, Pixel Bender Watercolor and Much More http://www.weberdesignlabs.com/blog/2009/02/flash-friday-3d-trails-flash-blackholes-pixel-bender-watercolor-and-much-more/ http://www.weberdesignlabs.com/blog/2009/02/flash-friday-3d-trails-flash-blackholes-pixel-bender-watercolor-and-much-more/#comments Fri, 27 Feb 2009 18:40:57 +0000 Stephen http://www.weberdesignlabs.com/blog/?p=123 10 Less-Known Yet Powerful ActionScript Libraries / Classes
http://www.webresourcesdepot.com/10-less-known-yet-powerful-actionscript-libraries-classes/#comment-38197

Cool Pixel Bender Experiments
http://blogs.adobe.com/jnack/2009/02/cool_pixel_bend.html

Water Color with Pixel Bender
http://www.derschmale.com/2009/02/16/flash-watercolour-simulation-using-pixelbender/

Developing Flex RIAs with Cairngorm microarchitecture – Part 1: Introducing Cairngorm
http://www.adobe.com/devnet/flex/articles/cairngorm_pt1.html

3D Trails with Papervison
http://blog.zupko.info/?p=264

Seb’s Blackhole in Flash
http://www.sebleedelisle.com/?p=383

Away3D Smooth Transitions
http://www.closier.nl/blog/?p=83

]]> http://www.weberdesignlabs.com/blog/2009/02/flash-friday-3d-trails-flash-blackholes-pixel-bender-watercolor-and-much-more/feed/ 0 Flash Friday – 3D, Flex and Video Tutorials http://www.weberdesignlabs.com/blog/2009/02/flash-friday-3d-flex-and-video-tutorials/ http://www.weberdesignlabs.com/blog/2009/02/flash-friday-3d-flex-and-video-tutorials/#comments Fri, 20 Feb 2009 18:02:57 +0000 Stephen http://www.weberdesignlabs.com/blog/?p=118 Papervision 3D Roundup
http://flashenabledblog.com/2009/02/19/tutorials-papervision-3d-roundup/

Creating PicLens with Flex and Away3D
http://flashenabledblog.com/2009/02/17/tutorials-creating-a-piclens-web-application-with-flex-and-away-3d/

Car simulation with Maya & Papervision3d
http://www.everydayflash.com/blog/index.php/2009/02/13/car-simulation-with-maya-papervision3d/

Google Calendar Lib
http://sujitreddyg.wordpress.com/2009/02/19/documentation-for-as3googlecalendarlib/

Flex OpenID Login Component
http://anirudhs.chaosnet.org/blog/2009.02.17.html

Making Things Walk in Flash 3D
http://www.everydayflash.com/blog/index.php/2009/02/09/making-things-walk-in-flash-3d/

Adobe Flaw Heightens Risk of Malicious PDFs
http://it.slashdot.org/article.pl?sid=09/02/20/1525233&from=rss

What is the F4V Format For?
http://theflashblog.com/?p=748

Some Fantastic Video Tutorials
http://tv.adobe.com/#ch+MAX

Google Maps API for Flex
http://codeofdoom.com/wordpress/2009/02/18/intro-to-google-maps-api-for-flex/

]]> http://www.weberdesignlabs.com/blog/2009/02/flash-friday-3d-flex-and-video-tutorials/feed/ 0 Top Flash Links For This Week http://www.weberdesignlabs.com/blog/2009/02/top-flash-links-for-this-week/ http://www.weberdesignlabs.com/blog/2009/02/top-flash-links-for-this-week/#comments Mon, 16 Feb 2009 18:45:31 +0000 Stephen http://www.weberdesignlabs.com/blog/?p=114 3D vs 3D
http://labs.bigspaceship.com/2009/02/12/3s-vs-3d/

Away3D 2.3 Is Out – Check out these demos
http://away3d.com/away3d-23-feature-overload

TubeLoc (a mashup of YouTube and LocalConnection) is an ActionScript 3 library that serves as an adapter to the YouTube ActionScript 2 Player API.
http://code.google.com/apis/youtube/articles/tubeloc.html

Lita – SQLite Administration Tool (AIR)
http://www.dehats.com/drupal/?q=node/58

wonderfl online compiler, code snippets, ActionScript – Crazy cool
http://wonderfl.kayac.com/

NY Times Article Search API
http://open.blogs.nytimes.com/2008/10/21/announcing-the-timestags-api/

GTweenTimeline
http://www.gskinner.com/blog/archives/2009/02/gtweentimeline.html

Papervision Primitives
http://professionalpapervision.wordpress.com/2009/02/11/23-papervision3d-primitives-17-new-ones/

Intro to Flex – Part 2
http://www.gotoandlearn.com/play?id=100

New WiiFlash Demos
http://wiiflash.bytearray.org/?p=178

PixelBender Camera Experiment

http://incubator.quasimondo.com/flash/feedback.php

AS Language Reference in an AIR app
http://www.airdoc.be/

GTween Beta 5 released
http://www.gskinner.com/libraries/gtween/#download

Standalone Flash/Flex/AIR debugger
http://www.monsterdebugger.com/

New 3DSMax XML Exporter & PV3D XML Primitive
http://professionalpapervision.wordpress.com/2009/02/04/new-3dsmax-xml-exporter-pv3d-xml-primivtive/

Flash CS4 Spherical Panorama (animating uvtData)
http://professionalpapervision.wordpress.com/2009/01/24/flash-cs4-spherical-panorama-animating-uvtdata/

Working with the FLARToolkit – Augmented Reality
http://www.peterelst.com/blog/2009/02/03/seb-and-his-magic-particles/

Another FLARToolkit Demo
http://blog.digitalbackcountry.com/2009/02/awesome-flash-demo-from-japan/

Gtweeny – Lightweight Gtween
http://www.gskinner.com/blog/archives/2009/02/gtweeny_lightwe.html

Latest Rumors About Flash and iPhone
http://www.bit-101.com/blog/?p=1948

]]> http://www.weberdesignlabs.com/blog/2009/02/top-flash-links-for-this-week/feed/ 0 Free 3D XML Website http://www.weberdesignlabs.com/blog/2008/12/free-3d-xml-website/ http://www.weberdesignlabs.com/blog/2008/12/free-3d-xml-website/#comments Wed, 03 Dec 2008 00:53:13 +0000 Stephen http://www.weberdesignlabs.com/blog/?p=63

So this is a very basic 3D XML Website with absolutely no design skills put into it, just an example to get started on 3D in Flash. I know there is 3D in Flash CS4, but many people don’t even have CS4 yet. So this version is for them, the beginners with CS3. This reads from an xml where it loads an image for each item you put in the XML, when the menu item is clicked it loads the SWF content specified for that node in the XML.

Please post in the comments what features or interactivity you would like to see in the next version.

View Demo

Download 3D XML Website (2709)

Enjoy!

]]> http://www.weberdesignlabs.com/blog/2008/12/free-3d-xml-website/feed/ 20 Free Flash XML Banner Rotator http://www.weberdesignlabs.com/blog/2008/06/open-source-xml-free-flash-banner/ http://www.weberdesignlabs.com/blog/2008/06/open-source-xml-free-flash-banner/#comments Thu, 26 Jun 2008 06:53:46 +0000 Stephen http://www.weberdesignlabs.com/blog/?p=33 So everyone needs an XML Banner in Actionscript 2 and honestly I am kind of tired of making them over and over again. I would rather work on something big and beautiful. You can use this for whatever you want. It reads off of an XML where you can set it to show them in random order, set the time the banners have to show and other such features.

View Demo

Here is a sample of the xml and an explaination of each node.

<rotator isRandom=”false”> – Set to true for random order of banners
<bannerTime>2</bannerTime> – Number of seconds to show each banner
<numberOfBanners>5</numberOfBanners> – Number of banners
<banners showHeader=”true”> – Shows the title
<banner>
<name>Banner 1</name> – Caption that shows on the bottom
<body>Lorem Ipsum</body> – For extra functionality if necessary
<imagePath>01.jpg</imagePath> – Path of the image
<link>http://www.weberdesignlabs.com</link> – Link the banner goes to
</banner>
</banners>
</rotator>

Download Flash XML Banner Rotator Version V1

Enjoy!

[ad#co-1]

]]> http://www.weberdesignlabs.com/blog/2008/06/open-source-xml-free-flash-banner/feed/ 198 Flash Player 10 Video Tutorials http://www.weberdesignlabs.com/blog/2008/05/flash-player-10-video-tutorials/ http://www.weberdesignlabs.com/blog/2008/05/flash-player-10-video-tutorials/#comments Sat, 31 May 2008 00:31:22 +0000 Stephen http://www.weberdesignlabs.com/blog/?p=32 Getting Started:

3D:

Source Code

Dynamic Sound:

Source Code

FileReference:

Source Code

[ad#co-1]

]]> http://www.weberdesignlabs.com/blog/2008/05/flash-player-10-video-tutorials/feed/ 1 Free FLV Player – Drag n’ Drop http://www.weberdesignlabs.com/blog/2008/05/free-flv-player-drag-n-drop/ http://www.weberdesignlabs.com/blog/2008/05/free-flv-player-drag-n-drop/#comments Fri, 16 May 2008 02:50:15 +0000 Stephen http://www.weberdesignlabs.com/blog/?p=30 So anyone who knows me knows I LOVE Flex. I also found I love AIR. If you don’t know about these two technologies then you must check them out and give them a fair chance. I know new things are scary, but some you just see are going to change how quickly we can make an application. For example I made this simple application in about 45 minutes (and I know I am slow compared to the good programmers).

AIR Web Installer and FLV Player Installer

If the AIR Installer Badge doesn’t work, then you can directly download the air file here

Download the Code[ad#co-1]

]]> http://www.weberdesignlabs.com/blog/2008/05/free-flv-player-drag-n-drop/feed/ 4 Flash Player 10 Demo Videos http://www.weberdesignlabs.com/blog/2008/05/flash-player-10-demo-videos/ http://www.weberdesignlabs.com/blog/2008/05/flash-player-10-demo-videos/#comments Thu, 15 May 2008 17:53:27 +0000 Stephen http://www.weberdesignlabs.com/blog/?p=29 It’s coming. In fact the beta is already here. Although who knows how to actually program it yet, so its just for show now.
Here are some videos that show off what it can do. Check it out and your welcome to drool a bit.

Flash Player 10 Demo Video – 3D Effects

Flash Player 10 Demo Video – Filters Gone Wild

For more videos check them out here

]]> http://www.weberdesignlabs.com/blog/2008/05/flash-player-10-demo-videos/feed/ 0 Coverflow HD Video Player http://www.weberdesignlabs.com/blog/2008/05/coverflow-hd-video-player/ http://www.weberdesignlabs.com/blog/2008/05/coverflow-hd-video-player/#comments Thu, 08 May 2008 21:45:01 +0000 Stephen http://www.weberdesignlabs.com/blog/?p=28 So everyone loves the coverflow and people love HD and I love video. Put them all together and you got a HD Video Player with a Coverflow that reads from an XML. I know its soo pretty.

View Demo

You just want to find a use for it somewhere. You will need MC Tween for this piece of code to work.
You can make it autoplay the videos from the playlist by simply setting the variable “autoPlayVideo” to true.

If you have any questions just leave a comment in this post and someone will probably help you.
Download Free Coverflow HD Video Player Version V1
(ZIP Contains FLA,JPG, XML – Does not include Videos)

]]> http://www.weberdesignlabs.com/blog/2008/05/coverflow-hd-video-player/feed/ 44 Papervision 3D Room Demo http://www.weberdesignlabs.com/blog/2008/05/papervision-3d-room-demo/ http://www.weberdesignlabs.com/blog/2008/05/papervision-3d-room-demo/#comments Wed, 07 May 2008 00:57:12 +0000 Stephen http://www.weberdesignlabs.com/blog/?p=21 So I have fallen in love again. This time its with Papervision, the naughty child of Flash. Papervision allows for people to create fairly realistic 3D scenes through an impressive code library. You can get the code library here.

I have made a very basic room that you can navigate in that I would just like to share for people to take and run with and make it even better. There are sooo many things you can do with Papervision. However I believe that since a computer has only a mouse and a keyboard (VERY 2D) interfaces then it forces the user to learn how to use the website, this begs the question then does 3D belong on the web? Well I don’t think it belongs on the web for a normal informational experience (like going and getting an email address from a company website), but maybe for a different way to display data in a VERY easy to use and non-intrusive interactive way then I think its okay. Anyways please post your opinion and post links to your Papervision work. I love to see what people are doing!

View Demo

Download 3D Room Demo Version V1



[ad#co-1] ]]> http://www.weberdesignlabs.com/blog/2008/05/papervision-3d-room-demo/feed/ 7 Free Drop In Flash Preloader http://www.weberdesignlabs.com/blog/2008/03/flash-free-drag-and-drop-preloader/ http://www.weberdesignlabs.com/blog/2008/03/flash-free-drag-and-drop-preloader/#comments Wed, 19 Mar 2008 21:58:46 +0000 Stephen http://www.weberdesignlabs.com/blog/?p=26 Hey Everyone,

Just wanted to pass on another useful little thing that I use all the time.
It’s a preloader that makes it about as easy to use as possible. I use it all the time because who wants to spend time on a preloader. Its got the normal bar that adjusts its width based on the amount loaded and then when its done loading everything it goes to the _root and plays the second frame (which of course you can change). Its great for just about everything and anything.

Download Now
(zip – contains Flash CS3 and Flash 8 versions)

]]> http://www.weberdesignlabs.com/blog/2008/03/flash-free-drag-and-drop-preloader/feed/ 39 Free Flash H.264 High Definition Video Player Example http://www.weberdesignlabs.com/blog/2008/01/free-flash-h264-high-definition-video-player-example/ http://www.weberdesignlabs.com/blog/2008/01/free-flash-h264-high-definition-video-player-example/#comments Mon, 28 Jan 2008 02:51:49 +0000 Stephen http://www.weberdesignlabs.com/blog/?p=24 Hey Guys,

Sorry its been so long since my last post. It’s been very busy for a while and so I haven’t been able to respond to all your comments and there are so many people contacting me to do work for them. Anyways I thought I would share this example I made for my work with you guys (don’t worry I have their permission). This is a HD Flash Video Player Example using Flash’s newest video support H.264. This is a big step in the Flash world and will change the quality and push the requirements we have on our bandwidth providers. So have fun with this example and do whatever you want with it. It is open source with no attribution (I know I need to get a MIT license for these projects).

Here is the source (CS3 Only): Download Here

Here is a rough demo of the player

]]> http://www.weberdesignlabs.com/blog/2008/01/free-flash-h264-high-definition-video-player-example/feed/ 28