Posts tagged "Flash"

May 15, 2013

One educator at MAX and three blog posts: Part 3: Interactive is Active

(I finally got off that airplane. And graded final project and papers for two undergrad and one grad class…and five independent studies and five practicums students. And did graduation and a birthday party and mother’s day. And slept. Oh, sweet sleep! And then I got to this third and final post about MAX. You can read my two other blog posts about the social aspects of CC and Adobe’s move to the subscription model if you missed them. Or not. I split this into three parts in case you want to read a la mode.)

The third aspect of MAX that I want to comment on as an educator and front-end developer is Adobe’s very smart strategy to support some great open-source solutions, better web tools and a good direction for Flash.

In November, I did a talk at the Adobe Education Summit in Toronto that discussed the HTML5 v. Flash debate. I do both. I love both. It’s tough to straddle both worlds and stay up-to-date, but when and because I do, my students get jobs. Not because I’m a great teacher that knows everything (but I am and I do). They get jobs because they not only know multiple solutions but how to evaluate and use the best solution for the challenge at hand.

Flash is not dead. It has, in many ways, the biggest and best support in the interactive arena. You can read the stats Adobe has out there on this. What’s killing Flash is not the reality, but the fear. One instructional multimedia designer at a university with thousands of online students told me that even when he argues that the best content-delivery solution for a specific problem is Flash, administrators just turn off immediately and shut him down.

Nonetheless, Flash still has a place. There are many companies in the Cincinnati area, particularly large companies that do their in-house training using Flash. There are more jobs in Flash in Cincinnati right now than in HTML5. It’s not easy for a large company to retrain their designers and front-end developers and rethink what’s already and still working.

I did see there was a session at MAX on what’s new in Flash Pro. I missed it because I was, ironically, at a PhoneGap/HTML5 session. One attendee told me it was all about Stage 3D, Adobe’s answer to moving gaming performance to the GPU for a faster, better experience. This is a good thing that Adobe has been pushing for a year now, but this year, they made it better by coupling it with Feathers, Starling and Dragonbones. All are free-open source solutions. Feathers is a JS framework for button assets that anyone can read and use. Starling is a great JS framework for 2D gaming with so many gaming methods and classes readily available. Dragonbones is an open source sprite generator that works directly with your assets in Flash Pro. There’s also Away 3D which brings to 3D what Starling brings to 2D. All are accessible. Under Michele Yaiser’s session, we used Flash Builder to construct and compile a game for both web and iPad. With Tom Krcha, we built a platformer with Flash Pro, Flash Builder, Starling, Dragonbones and the Citrus Engine. With the performance boost and multiplatform capabilities, Flash should hold their own in gaming at least for a little bit.

What I found particularly interesting and exciting was Adobe’s support of several free, open-source projects, namely CreateJS and PhoneGap Build. Never has Javascript, HTML5 and CSS3 been more creative. CreateJS offers four libraries and tools for a rich interactive experience on the web. EaselJS capitalizes on HTML5 canvas. TweenJS allows for animation and interactivity. SoundJS and PreloadJS improve on audio and preloading experiences, respectively.

Being a Flash developer, I got really excited when Grant Skinner, founder of CreateJS and CEO of gksinner.com, demoed a game he and his team were developing with CreateJS. When he showed us some of the code, it felt so right. While being true to JavaScript standards, it played on Flash’s conventions. Additionally, unlike many open source projects, the documentation is excellent and there are tutorials and examples to spare.

I just finished teaching my Media Scripting for Interactivity course this week—Flash Actionscripting for gaming—and I’m looking ahead to next spring. While I haven’t ruled out Flash, particularly in regards to jobs in the Cincinnati area as I mentioned above, I am considering the next wave of employer demands and I see frameworks like CreateJS at the forefront.

And, of course, there is PhoneGap Build. Accessible through Dreamweaver CS6, PhoneGap Build is also available online as an open source solution for compiling HTML5, CSS3 and Javascript assets into native applications for iOS, Android, Windows Phone, Blackberry, webOS and Symbian. I’ve played with PhoneGap with my responsive web students last fall and we had fun doing simple apps. This year, we’ll expand on that by tackling the PhoneGap API and device features more deeply. While ultimately maybe not as powerful as native development, PhoneGap gives Media Informatics students who tend toward front-end development a great entrée into the development world, particularly when we share best practices in programming and development with them.

That said, Rainn Wilson may have given the developers a lot of crap during Sneak Peaks, but this is going to be the year of the front-end developer. Mark my words. Or don’t. We’ll talk more about this later.

My last MAX concession: I told Claire Erwin I would blog once a week this summer. I’d say this more than counts for my first week considering I’m only two days out of the semester. I’m taking requests: What is media informatics? What’s in the media informatics curriculum at NKU? What should I do for my communication studies PhD dissertation since my committee keeps rejecting my ideas as too technical? (Seriously, help me out here…) Anyway, happy summer. It’s all good when it begins with an exciting MAX.

9:10 PM Permalink
November 27, 2012

Charity Game Jam with Citrus + Starling + Box2D targeting Flash Player and Stage3D

Over the US holiday weekend, I participated in the Charity Game Jam organized by Christer Kaitila, author of Adobe Flash 11 Stage3D (Molehill) Game Programming Beginner’s Guide and The Game Jam Survival Guide (for which I was able to serve as technical reviewer). The idea was to make a game inspired by the technical limitations of the NES (Nintendo Entertainment System). This means 256×224 pixels and 64 colors… though the pixel resolution was doubled and any constraints were made optional. The charity bit comes in where anyone participating would donate to either Make-A-Wish – which performs tangible acts of kindness for children who are suffering with terminal illness, or Kiva – which I’m still unsure exactly how they operate… I went with Make-A-Wish!

As expressed in the recent Adobe education article, Better Learning Through Game Design [alternate version], gaming and the skills involved in the creation of games are important to education. With the current focus on gaming for engineering behind the Flash runtimes, gaming is very important for Adobe. Take these two factors together and gaming is very, very important for the Adobe education team. As an Adobe Education Leader and lover of all things Flash: it is my absolute duty to dive into this stuff head first :)

Play the game: BABBY MUST NEEDS SLEEP! PARENTAL NIGHTMARE

Download the source files: SOURCE

Video Playthrough:


The game I created was built using the Citrus game engine targeting Flash runtimes (Flash player/AIR). If you haven’t heard of Citrus before, it is a GPU-accelerated gaming engine (strongly directed at platforming) which sits atop your choice of view renderers, physics engines, and so forth. I chose to use Citrus + Starling + Box2D for my game. The engine is being actively contributed to, is free to use, and holds great promise for integration with tooling in the future.

I started off using Flash Professional and the Starling Sprite Sheet exporter for texture atlases – but considering the amount of time it would take to properly animate my characters, decided to use single-frame sprites instead. For this I fell back to Photoshop. Most of my assets included screens, overlays, characters and objects, plus one huge background image. Something super-cool about using a big background image like this is that it made it pretty simple to figure out platform and object placement through the Info panel.

In the figure above, you can see that I am using the Move Tool and hovering over various parts of my image (game stage) to determine coordinates using the Info panel. Cool, right? I chose to not even bother with some of the tooling integration with Flash Professional that exists and just go straight code using Flash Builder 4.7 beta – so this was a tremendous help!

What I got out of it
I got to pick up and learn another great gaming framework! For the previous game jam, I went with Flixel and the traditional display list. I’ve been wanting to try my hand at something that utilized Stage3D and after a few conversations with Tom Krcha about Citrus, thought that it would be the logical choice. Funnily enough, I wasn’t going to even participate in this game jam but since I planned to look at Citrus over the weekend, and it sounded like a really good cause, I decided to throw my hat in. After all, despite admonishments to the contrary – I’ve found game jams to be great opportunities for picking up new stuff and just diving right in. A warning though: that is the sort of learner I am… so it works for me. I can see how this approach could be disastrous for some people; so “know thyself”, kids.

What went well
Citrus was great to use. It has all sorts of base classes all ready to go for players, enemys, pickups, physics objects, sensors, platforms, et cetera. They are all easily skinnable and can be extended to override functionality and behavior. Similar to Flixel and other engines, Citrus has the concept of states which I employed to wire up the various game screens. The API documentation is great and there is a very active user support forum as well. The ability to use a variety of 2D and 3D render views along with swappable physics engines is such a great model. This could very well be my go-to engine for any future game work!

The game concept came together pretty easily this time as well. Friday evening I was able to get the basics of an unskinned platformer together. Overnight, I got the idea for what it became – basically a fetch quest for an infant who just won’t go to sleep. Parents of young children – we all share this nightmare together… now we can relive these early memories over and over and over and over… lovely, right? ;)

In case you are wondering, the title and intentional misspellings originate with this meme.

What went wrong
Almost nothing! The entire thing went really quite smooth until the very end. As I mentioned before, I was using Flash Builder 4.7 beta for all of my development. Everything worked awesome when testing inside of the dev environment… but when I completed the game and began to prepare everything for publication… I encountered my one major issue.
Performing a release build rendered a .swf which CRASHED HARD. Absolutely unplayable… no amount of debugging or profiling seemed to create any suspicions either. Google searches… commenting out entire portions of code… no solution whatsoever. Until I thought to myself: “Joseph, you are using a beta version of the new ActionScript Comipiler 2.0 to perform a release build.” Establishing the project within Flash Builder 4.6 and performing a release build created a perfectly functioning .swf file. Thank goodness!

Only other issue is that when people approach the game for the first time, they don’t know how to play. I should have placed some quick instructions in-game. For reference; SPACEBAR = jump, L/R ARROW to move.

Conclusion
Happy I was able to participate. Christer is badass. Goal was set at $250 and we hit over $1500!!! Love the game I made. Love Citrus. Please play the game, learn from the source code, and share it with your friends :)

Adobe tooling and runtimes make this all possible!

BTW: If you want to learn more about using Starling, Feathers, and Flash Professional for multi-screen layout… I have a new article up on the Adobe Developer Connection I encourage you to check out:
Designing for a multi-device, multi-resolution world

2:51 PM Permalink
November 21, 2012

Adobe Education Exchange Live – Toronto 2012

I was fortunate enough to be able to attend, and speak at, the Adobe Education Exchange Live event in Toronto, Ontario back on November 9th. The event piggy-backed onto the larger DesignThinkers conference being held at the same time and both events led up the Adobe Design Achievement Awards (ADAA) ceremony.

The session I gave at the event was around the University of Denver and our work with enabling our community members to take charge of and deliver encoded video streams through tooling and services built in both HTML and Flash Platform technologies. We’ve always been about using whatever tools are appropriate for accomplishing specific needs and oftentimes this involves using a number of different technologies together. As someone who works in both web standards and Flash – it irritates me beyond belief when the two are placed in an adversarial context. That just isn’t reality – and is harmful to the creative process.

The talk was recorded – but don’t think it is available publicly. Slides are below.

Another hi-light for me was getting the chance to chat with gaming evangelist Tom Krcha about Flash, gaming, education, and a number of related topics. Tom gave a great overview of “The Future of Flash” to close out the event and I think it really opened a lot of people’s eyes. Flash is a complex platform consisting of many tools, services, frameworks, targets, runtimes, and people doing extraordinary things all the time. It is a shame that so many see it as just a web animation tool as it really is so much more. Having sessions like this should definitely help!

The ADAA ceremony was interesting… this is the second ADAA awards I was able to attend in person and it really is quite an event. To see the truly great works produced by these students is truly something incredible. Please do have a look at the winners and finalists over at http://www.adaagallery.com/.


A week or so after getting back, I was asked by the Adobe Media Server User Group whether I’d want to speak at their November meeting. For that talk, I modified my Adobe Education talk to focus on AIR and AMS – and the processes used to have it all work. The slides of this talk are below.

[full recording here]

6:41 PM Permalink
September 30, 2012

Changing Digital Tool Sets and Education

CHANGING DIGITAL TOOL SETS AND EDUCATION


Tools. Craftsmen love their tools. Without a proper set of tools, their jobs would take much longer, and probably would not be done as well. If you were to speak to someone who works with tools, they would tell you that they have favorite tools among their collection. You will hear a story about how they will use these favorite tools constantly, and utilize the rest only when necessary. The craftsman will covet and care for these tools, as old favorites just cannot be replaced with new ones and have the same feel in their hands.

When better tools do come about, the craftsman may give them a try. It may take a while, but the new tool probably will work just as well, and probably better than the old favorite. Suddenly, the craftsman has a new favorite tool, and has found that it saves time and produces solid work.

I spent many years working with hand tools as a jeweler. I have a set of favorite tools that are on the front of my bench. I have new ones that I bought along the way to replace the favorites, but they remain in the cupboard waiting for me to pick them up. One pair of pliers had been in my hands for over 30 years, the “needle nose” is long gone, ground down so many times to keep them sharp. One day I just could not get the tip into the spot I needed to get the work done. Out came the new ones and the job got done, quickly and cleanly. Out went the old ones.

My full time days as a jeweler have been replaced with digital media production and teaching the techniques. I have been having fun producing and teaching the skills to build websites, videos, digital graphics, etc. for over 12 years now. I have favorite tools and technologies for doing my work here as well (Ok, mostly Adobe’s toolset!). I have seen tools and technologies come and go during this time. Some of them I was very happy to watch disappear (Director), some I miss.

This industry is always changing. Learning never stops. There is always a new technology or “digital trinket” coming out that needs special treatment from us to work. Right now, our industry has been turned on its ear with so many new and evolving technologies that are coming out much faster than ever before. Technologies are here and in the hands of consumers that our current tool sets do not provide what we need to get our work done in a timely fashion. All of a sudden, I don’t have a tool (let alone a favorite tool) for some of the jobs I need to get done.

I am always studying to keep abreast of what set of tools are available so I can work efficiently and keep my students on the cutting edge. Adobe is providing its users with toolsets that are moving forward at almost as fast a pace as the technologies. The new set of Edge tools and services are indicative of the company’s hard work to provide the cutting edge tools necessary for today’s HTML 5, CSS3, and JavaScript environments.

I teach in a community college’s Computer Information Systems department. Besides Microsoft Office, our classes include web design/development and the study of computer applications. The Adobe applications our department focuses on are Photoshop, Dreamweaver, Illustrator, InDesign, Premiere, and Flash (gone are Flex and Flash Catalyst). Right now, we are in a broil over how to proceed with our department and college web developer/designer certificates. It may take a student 3 (now with budget cuts maybe 4) years to get through the certificate program. Technologies are changing too fast to keep the certificates stable for that amount of time. If we do not change them, we risk becoming stale and out of date, providing an education that will not be what employers are looking for when the students graduate.

Our certificates dictate certain Adobe application classes are required be taken, with others as electives. When the landscape of application/technology choices change so fast, the certificates become out dated in months, not years. With the “death” of Flash as a web technology, Flex and Flash Catalyst were “killed” too. Flash I is still a requirement for our certificates, Flash II is an elective. Flex and Flash Catalyst are also electives. Our certificates are becoming “littered” with technologies that are not pertinent, and missing the ones that have become so.

The Flash platform technologies will not provide the job skills necessary for our students studying web technologies when they graduate. It is very difficult to ever know, in our field, what will be the job skills in 4 or 5 years, but we have to try to provide what we know right now to the best of our abilities. As of today, this is HTML 5, CSS3, and JavaScript. The release of Adobe Edge Animate this past week, with the offer of using Animate free for one year, should help to make the transition from Flash animation to HTML 5 animation a bit easier. The willingness of the instructors and curriculum committees to let go of their favorite old technologies and learn the new ones fast enough to keep moving forward is a key factor.

Schools and technology departments must make an effort to plan the new methodology for teaching the new workflows at a speed equaling the various technologies release, a plan to embrace the tools that will provide the modern skillsets for our students. The college’s ability to provide pertinent certificates will require some study and discussion to come up with an answer that will allow the fast pace of change.

Loving our tools means we love to work. Sometimes, even when it is so difficult, we must leave the tools we love and embrace the new ones. A modern web requires modern tools.

12:48 AM Permalink
May 14, 2011

University Flash Video: Across Desktop, Tablets, and Phones

The University of Denver held a TEDx event today. We fed an RTMP signal through a VBrick unit to an internal Flash Media Server for authentication to be distributed over CDN and exposed to viewers through the Open Source Media Framework Strobe Media Playback.

I was curious how the feed would look over a variety of devices. Here are the results :)

Microsoft Windows 7

BlackBerry Tablet OS

Google Android

Excellent!

2:58 AM Permalink
April 1, 2011

Flash Development for Android Cookbook: RAW

Flash Development for Android Cookbook

Flash Development for Android Cookbook

My first book is now available for preorder over at the Packt Publishing website. Not only can you preorder “Flash Development for Android Cookbook“, but it is also being included in the RAW program. This means that even though the book is not yet finished (the draft is finished- working through rewrites, currently) you can preorder the eBook or the print book and access the draft chapters online before the book is truly published!

For those wondering about the content, whether it leans more toward Flex or pure ActionScript; while there is a bit of Flex sprinkled throughout a few of the chapters, the code examples are almost always written in nothing but pure AS3 to allow anyone using any framework and toolset to implement the recipes easily. Full AS3 class downloads will be available through the Packt website.

So please spread the word, and place a preorder if so inclined! Note that even though the publish date is marked as September on the website, this was an original projection from last year and the true print date is more likely May or June.

Description from Publisher:

Flash has now arrived to Android — the fastest growing smartphone platform. This offers massive opportunities for Flash developers who want to get into mobile development. At the same time, working on smartphones will introduce new challenges and issues that Flash developers may not be familiar with.

The Flash Development for Android Cookbook enables Flash developers to branch out into Android mobile applications through a set of essential, easily demonstrable recipes. It takes you through the entire development workflow: from setting up a local development environment, to developing and testing your application, to compiling for distribution to the ever-growing Android Market.

The Flash Development for Android Cookbook starts off with recipes that cover development environment configuration as well as mobile project creation and conversion. It then moves on to exciting topics such as the use of touch and gestures, responding to device movement in 3D space, working with multimedia, and handling application layout. Essential tasks such as tapping into native processes and manipulating the file system are also covered. We then move on to some cool advanced stuff such as Android-specific device permissions, application debugging and optimization techniques, and the packaging and distribution options available on the mobile Android platform.

In a nutshell, this cookbook enables you to get quickly up to speed with mobile Android development using the Flash Platform in ways that are meaningful and immediately applicable to the rapidly growing area of mobile application development.

Take your Flash applications beyond the desktop and into the emerging world of mobile application development!

 

3:03 PM Permalink
February 3, 2011

University of Denver Students Participate in Global Game Jam 2011

X-Defender

X-Defender: Gameplay

The 2011 Global Game Jam took place January 28th through the 30th; a single 48 hour period in which teams would have to come up with and develop a game using the platform of their choosing.

48 hours, 44 countries, 170 locations, 6500 participants, almost 1500 games, one weekend, one theme (“Extinction”).

At the University of Denver, students David Fogle, Daniel Kjellerson, and Stephen Rice formed one such team in an attempt to develop a game using the Adobe Flash Platform. The three students are all dual majors studying in the Animation and Game Development and Digital Media Studies programs at DU. The idea for their game is an interesting concept as it immediately appears to be a regular 2D shooter, but is actually a little more complex than that… if you start shooting at the approaching aliens out the gate, they will retaliate- but if you choose not to start a fight, a peaceful outcome will occur.

Why Flash?

Taking into consideration the rich visual history behind Flash, the ubiquity of the platform, and some prior ActionScript experience, the team decided that the Flash Platform would be a good choice for their project, X-Defender.

X-Defender: ActionScript Class

X-Defender: ActionScript Class

“We participated in the Global Game Jam in order to further develop and practice our game development skills in an amazing environment. We found ourselves using ActionScript and Flash due to our prior experience as well its accessibility and ability to meet our needs.”

The two classes that were most influential in their decision had been Topics: Introduction to Game Design which is focused on game development theory and creation, and Programming for Play which deals with game and toy development which is taught using ActionScript as the development language.

Software used by the team included Flash Professional, FlashDevelop, Photoshop, SumoPaint, and Acid for sound composition.

Results

All of the games created during Global Game Jam are in various states of completion due to the rushed nature of the competition. X Defender though, is actually playable with animated cut scenes, full player control, enemy attack patterns, a boss battle, and background score.

It is certainly a testament to rapid game development enabled by the Flash Platform, and is a stand-out project from a conceptual standpoint as well.

X Defender : Cut Scene

X-Defender: Cut Scene


Meet the Students

David Fogle:
Designer, In-Game Artist, Programmer, Music Development

Daniel Kjellerson:
Concept Artist, Cutscene Artist, Code Consultant

Stephen Rice:
Designer, Programmer

The University of Denver team was coordinated by Rafael Fajardo.


Resources

3:00 PM Permalink
January 7, 2010

Flash Player on Mobile Devices

Walk down any high school or junior high hall and you will notice how popular mobile devices are. It seems that just about every kid has access to a “smart phone.” However, students have been unable to access engaging and rich web content delivered in the Flash format. This is starting to change.
Recent releases of certain mobile devices are realizing how much content is delivered via the Flash format (over 80% of web video is distributed as Flash video) and will, in the near future, support Flash Player 10.1. Students that carry smart phones that include Flash Player 10.1 will be able to visit sites like National Geographic and Brain Pop (just to name a few) and teachers will gain an exciting instructional delivery tool!
Read more…

6:21 AM Permalink
October 16, 2009

YouTube and Flash Platform (AS3) Integration

Something we’ve struggled with for some time at the University of Denver Center for Teaching and Learning (CTL) is the full integration of YouTube videos within our rich media tools such as those found within the CourseMedia™ ecosystem. Traditionally, this has been not altogether possible as previous versions of the YouTube Chromeless Player were ActionScript 2 based and so were isolated in a separate Flash Player virtual machine (VM) in any of our ActionScript 3 based tools. There are ways of setting up a proxy and transferring messages between the two VMs through that proxy- but it is messy, includes too much overhead, and is nowhere near ideal. We ended up just opening YouTube content within a browser window- not at all integrated into our systems.
A few days ago, however, Google released an AS3 based Chromeless Player. Using the new player API, we were able to not only effectively integrate seamless YouTube videos within our normal display mechanisms, but were provided the flexibility of hooking full YouTube control functionality into our existing controls for native system content. The result being that the user experiences a YouTube video in the exact same way that they would expect to experience a native system video. This greatly improves the user experience and effectively adds the entire public YouTube video library as potential course material.
A quick overview video of how we’ve used this to enhance a few CourseMedia™ tools is presented below:

References:
The ActionScript 3 YouTube Chromeless Player is Now Live
YouTube ActionScript 3.0 Player API Reference
Google FINALLY Releases AS3 Player for YouTube
MediaViewer 1.2.6 / VPS Projection System 1.3.2

8:43 AM Permalink