Skip to Navigation | Skip to Content

Class Blog

Saturday, December 19, 2009

Adobe Developer Connection



As part of a web search for working with data centric applications in flash I came across the Adobe Developer Connection site and thought it might be a good resource for the members of our Actionscript class. The site is free but it does require you to register a user name and password. This site is a portal for all adobe products and a vast array of developer resources for them.

The Products/Flash Professional section contains a wealth of information including video tutorials, code snippets, documentation, product updates and much more.




I found the Actionscript Cookbook section most interesting. Here you will find a large number of recipes (code samples) for solutions such as behaviors and effects, data access, data grids, component development and UI design. The most interesting feature of this section is that it gives you the ability to request a solution (recipe) from the community at large. This could be a powerful tool if you find yourself stumped by a particular problem or feature.

To cover all the features available certainly goes beyond the scope of this blog, however, I would strongly recommend that you spend some time to navigate through this site. I think you will find it to be a valued asset as an Adobe/Actionscript designer and developer.

Resources Exploration

I decided to look for valuable Flash resources that I can bookmark and use later for upcoming projects. My next semester will be my last one at MiraCosta college, which is why I would like to prepare myself with resources that teach me more than I have already learned and also keep me up to date. I am already aware of the flash tutorials on http://www.lynda.com, but I am also interested in finding resources that are free of charge.

The first site I came across is Adobe’s Flash CS3 Resources page: It provides links to videos on diverse Adobe products, some of them focus on Actionscript3: http://www.adobe.com/designcenter/video_workshop/
Adobe also provides links to flash user guides and flash fora such as this one: http://forums.adobe.com/community/flash/flash_general

Flash Kit seems to be the most extensive resource page - referring to itself as “the world's largest Flash resource site”. It is free and offers online tutorials, help fora, sound effects, as well as fonts. It also links out to other external resources and downloadable codes: http://www.flashkit.com/links/Flash_Resources/

Entheos offers diverse flash-based templates for websites and animations as well as tutorials. Some of them are free of charge: http://www.entheosweb.com/Flash/default.asp

Finally, Simple Thoughts – a java and web blog - provides a list of the Top 90 Free Flash Tutorials: http://blog.taragana.com/index.php/archive/top-90-free-flash-tutorial/

Thursday, December 17, 2009

Resources

I often click out of a page with too many words and not enough white space to know where to begin reading. I really like sites that use type and text animation to dynamically engage the reader with its site. This can keep the viewer a few moments longer, before navigating to another site. Here are some resource sites to help you while you experiment. These sites have step by step tutorials and are very helpful...



tutorialsphere.com/tutorials/flash/actionscript
This site has a large archive that link out to tutorials on all things flash, from design to math & physics to text effects. The articles are also rated, for your browsing convenience.

actionscript.org/resources/categories/Tutorials/
This is a site to find tutorials for flash actionscript. It has archives for beginners, intermediate and advanced. It also has articles for Best Practices, Product reviews, and step by step how to instructions.

philiplikens.com/stuff/dottype.swf

itp.nyu.edu/~ses4/archives/home/ses4/public_html/archives/5b.swf
Here is a short guide to typography, created in flash.

I encourage you whether you are working on an artistic composition or a user friendly site, experiment with typography and text.

Tuesday, December 15, 2009

Website, Microsite and Game Development




For my second blog I decided to write about a game development company called iqfoundry.com http://iqfoundry.com/. Iqfoundry has created many award winning suites, games and websites. Some of the clients of iqfoundry are:
Steve Clayton – Custom guitar pick selection and order system design http://www.claytoncustom.com/
Firefly Mobile – Branding, e-commerce and marketing hybrid website for mobile phones for mobile kids. http://www.fireflymobile.com/
WowWee Robotics – Flash websites, micro sites and games. Corporate website http://www.iqfoundry.com/portfolio/wowwee/, Tribot Microsite, and Bladestar game. If you play the movie you can view all their cute robot designs, some are Tribot, RoboPanda, RoboRemote, ChatterBot, RoboQuad, and Bladestar.
Jim Beam – Spirits Salesman Training Site. In the training site to train their sales staff incorporated a series of games and puzzles that tested retention and re-enforced the learning material http://iqfoundry.com/#/Portfolio/Jim%20Beam%20Brands%20Co./
The Colony – Developed a content rich interactive website to advertise their condominiums and the community lifestyle to attract more buyers to come and visit the community. http://iqfoundry.com/#/Portfolio/The%20Colony%20Condominiums/
Trek – developed 2 Microsites for Trek Bikes, project One and Bikes of the Team. Al the Microsites were delivered in 12 different languages. http://iqfoundry.com/#/Portfolio/Trek%20Bikes/
Swarthsmore University – Virtual Tour of the campus, dorm rooms, with the students telling a story about their experience at the college. http://iqfoundry.com/#/Portfolio/Swarthmore%20College/
Time IQ – Developed a web based time tracking system that can be customized for most businesses.

Iqfoundry also develops custom games; some of the game samples they placed on their website are: Germz, Solo Words, The plunge and Study Hall.

I really enjoyed visiting this site, especially the WowWee robotics site.

Thursday, December 3, 2009

Active Den


ActiveDen is an online market place for flash files. At ActiveDen you can buy and sell royalty-free Adobe Flash and Flex files for just a few dollars. Items are priced on the complexity, quality and use of the file. The site is home to a bustling community of Flash designers and developers and is the largest Flash library on the web.

Along with being able to buy stuff you are allowed to sell stuff.
It is very easy, just follow these steps
  1. Become a Member – Become a member of any of the Envato Marketplaces.
  2. Read the Authoring Tutorial – This is an overview of some important information you’ll need to know about uploading, copyright and selling.
  3. Take the Author Quiz – The author quiz tests that you’ve understood the authoring tutorial. It’s a simple process to take and once passed you will be eligible to sell on the marketplace that you took the test on.
  4. Select Exclusivity – Authors selling unique items on the Envato Marketplaces are eligible to receive between 40% and 70% of every sale depending on the sales volume. If you wish to sell the same items elsewhere then you receive a reduced 25% of each sale. Note that you can sell other items elsewhere as an exclusive author.
  5. Begin Uploading – At this point you are now an author and can upload your content.
When your items sell you will be accumulating earnings which can be paid out in one of three ways:
  • For earnings of less than $50, you can spend your cash on any of the Envato Marketplaces. If your balance is still below $50 after 12 months, you can withdraw the balance to a PayPal account.
  • For earnings of more than $50, you can request a payout to a PayPal or Moneybookers account. Payments are processed at the end of each calendar month and paid out on the 15th of the following month.
  • For earnings of more than $500, you can request a payout by bank cheque or wire transfer. Note that bank international cheque fees can be large.
Since ActiveDen is part of the Envato Marketplace, you are able to access the other online marketplaces with your one account.
There is http://audiojungle.net/, http://themeforest.net/, http://graphicriver.net/, and http://videohive.net/.

They also have sister sites for tutorials at http://tutsplus.com/. Most importantly they have a specific tut site for flash at http://active.tutsplus.com/.

Flash Game Development with Flex and Actionscript

Shirley Stevenson
MAT 190 – Flash 2 (ActionScript Class Blog)


Flash Game Development with Flex and Actionscript
Article by Matthew Casperson (4,886 pts ) , published Sep 23, 2009

While I was looking through flash websites for game development topics in ran into a website called Flash Game Development with Flex and Actionscript (http://www.brighthub.com/internet/web-development/articles/11010.aspx). This website caught my eye because of the cross platform compatibility. My previous work related experience has been in multiple platform and operating system development and conversions. The idea of being able to develop games on different platforms interested me, since I have never been much of a Windows fan.

The article points out several advantages with using Flex SDK and ActionScript:

Cross platform compatibility – there is a flash player for every major platform.
Easy development – publishing a game is as easy as uploading the swf file.
Almost zero installation requirements – the end user only needs a web browser with the flash plug in installed
Free tools – all you need is the free Flex SDK and a text editor.

The tutorial covered many different topics, such as:

Downloading Flex 3 SDK
Creating a simple application
Sample source code
Compiling and running the program
Demo swf and source code

There is also a series of links that walk you through the development process. Some of the links are as follows:
1. Flash Game Development with Flex and Actionscript - Getting Started
2. Flash Game Development with Flex and Actionscript - Double Buffer Rendering
3. Flash Game Development with Flex and Actionscript - Embedding Resources and Adding Game Objects
4. Flash Game Development with Flex and Actionscript - User Input and an Animated Background
5. Flash Game Development with Flex and Actionscript - Adding Weapons
6. Flash Game Development with Flex and Actionscript - Collision Detection
7. Flash Game Development with Flex and Actionscript - Bitmap Animations
8. Flash Game Development with Flex and Actionscript - Music and Sound FX
9. Flash Game Development with Flex and Actionscript - Defining a Level
10. Flash Game Development with Flex and Actionscript - Tiled Background Rendering
The tutorial also included several getting started links, such as:
Flex download - http://www.brighthub.com/link/link.aspx?u=http%3a%2f%2fwww.adobe.com%2fproducts%2fflex%2fflexdownloads%2f&p=11010
textpad download - http://www.textpad.com/.
Debugger - http://www.brighthub.com/link/link.aspx?u=http%3a%2f%2fwww.adobe.com%2fsupport%2fflashplayer%2fdownloads.html&p=11010
Sample graphics - http://www.flyingyogi.com/fun/spritelib.html.

Creating the Application
(Information from the website)
Conceptually Flex splits up an average program into two sections: the GUI and the Actionscript code. The GUI is created in an MXML file, which is an XML file that contains user interface elements nested in tags very similar to HTML. Note that the MXML file can contain Actionscript code inside an mx:Script tag, but the main focus of the MXML file is to define the user interface.
The top level tag of an MXML file is the mx:Application tag. This Application object is the entry point of the Flex application, and is the most logical place to start.
main.mxml Actionscript Source Code




We start by defining some of the properties of the Application object. These properties can be set through attributes in the mx:Application tag. This should look familiar to anyone who has written HTML.
width and height
Specify the screen size of the program in pixels.
framerate
Specifies a limit on the frames per second. The default is 24, but since we want the game to run as fast as possible it’s best to override this with a much higher number. Note that just setting the framerate to 100 doesn’t guarantee that the frame rate will always be 100 (or even get anywhere near it). This property just sets a ceiling on what the frame rate could be.
creationComplete
Attaches a function to be called when the Application has been created. We use this as the entry point in the program.
enterFrame
Attaches a function to be called every time the screen is redrawn. We will use this to repaint the screen with the next frame of the game.
The mx:Script tag gives us a place to write some Actionscript code. The [CDATA[ ]] tag just means that any special characters inside the mx:Script tag will be interpreted as text rather than XML characters. Inside the mx:Script tag we need to add the two functions which match the values for the creationComplete and enterFrame properties.
Compiling and Running
To compile the program you need to run the command mxmlc main.mxml from the command prompt. You can then open up the resulting main.swf file in the Flash debug player through File->Open.
And the end result? A blank screen that does nothing. Not terribly exciting I’ll admit, but it is a start. We will build off this code in part 2 of the series to start drawing to the screen.
Go back to Flash Game Development with Flex and ActionScript
Related Files
Demo SWF File
Demo Source Code