Posts Tagged ‘Javascript’

Hello World,

Well I’ve come to the end of my week long evaluation of Sencha Animator. Overall, I was pleased with what the tool was able to provide. It certainly delivers on what it promises … but no more. During my evaluation period I was able to create an decent prototype of a strategy game I am very fond of – Turn About. It’s based on the old 90’s game called Lights Out. I have created many versions of this game using many different languages including: PowerBuilder, Flash, Flex and Actionscript, Coldfusion, and Javascript. I use it to help me learn a new language or platform and discover its limitations. So first let’s look at the Pros:

PROS

It’s a great tool for creating visually compelling animated pages. I will never consider myself a designer but I can do wonders with clip art and photos. Having the ability to simply choose my images, position them on the canvas, and animate them by dragging, dropping, and updating parameters in the IDE was of great benefit. An animated page that took me two hours to construct (struggling with the CSS) took only 15 minutes in Sencha Animator.

It’s very easy for someone with a Flash animation background to pick it up and run with it. I spent years creating applications in Flash using Actionscript. I am very familiar with the timeline in Flash and was pleased to see it implemented in this tool as well.

If you are a designer with CSS experience then it’s easy to enhance your creation with custom CSS. Sencha Animator allows you to add your own CSS to your project. You can also export your project and it will create the HTML, CSS3, and Javasript source files. The resulting CSS is so clean that understanding and modifying the CSS is very easy.

If you are a developer with Javascript experience then it’s easy to extend the page interactions and behaviors with your own Javascript. I found that I needed to extend the functionality of my page beyond what Sencha Animator could provide. Fortunately the tool provides a way add your own Javascript code.

The product support is great with a decent supply of documentation and tutorials. The documentation for Sencha Animator looked complete. There are several tutorials (with source) on the site that will get you started.

CONS

It has limited functionality if you are an experienced Flash Developer/Designer. The “animation model” (for lack of a better term) used in Sencha Animator is scene-based. What that means is that your animation is grouped into one or more scenes.

All animation is a given scene is played when the scene is entered. The only way to prevent the scene from playing is by using custom Javascript code.

Although you can specify certain objects in the scene to play more than once there is no way to control the animation thru code. Once you are in a scene I found to easy way to start animating an object at a specified point. I had to write custom Javascript code and CSS to make that happen. But I had to be careful because any subsequent exports will overwrite any custom code I may have included.

Nor are you able to receive notifications during animation (such as a callback when the animation reaches 50%). I found a couple of libraries that helped report the frame state during animation but since the timeline is time-based I found it not to be 100% reliable.

OVERALL

Despite its limitations I am still pleased with Sencha Animator. Although I will never use Animator as a primary development tool (and I don’t think Sencha had that in mind as well) it will serve me well as a secondary development tool. I will certainly take advantage of Animator for any projects that require the placement and/or animation of images and objects. I can then include the resulting code into the larger project.

It also serves as an excellent tool to learn CSS transformations and animations by example which, is how I learn best.

WHAT’S NEXT

Next up is Tiggzi! Tiggzi is a “Cloud-based HTML5, jQuery Mobile and Hybrid Mobile App Builder”. I took a look at this tool about a year ago when I was first evaluating tools to use for web-based mobile development. At the time I wasn’t impressed with its features and their subscription prices seem quite high for what they were offering (they do have a limited free plan). When I found appMobi (completely free at the time) my decision was made. Now I will come back to do a full TWO WEEK evaluation of Tiggzi. They seemed to have improved their features (including adding Window 8 support).

I will post the game app I created using Sencha Animator (including source) on a later date. I have two Hackathons and a contest that I am preparing for. If you would like for me to send you the game app just comment on this page.

Until Next Time World,

CIAO

Hello World,

Less than two days from now (it’s Jan. 3rd, 2013) I will be taking a trip to the city that *really* never sleeps … Las Vegas, NV!! Recently, I won an All Expenses Paid trip to attend the Consumer Electronics Show (CES) and the AT&T Developer Summit in Las Vegas. While there I will be enjoying ALL that Vegas has to offer including participating in my 5th Hackathon, the CEA/MoDev Hackathon, held at CES and sponsored by the Travel Channel. You can get more information here – http://www.meetup.com/modevdc/events/94385142/comments/142895202/?itemTypeToken=COMMENT&a=ed1_17&reply=1&_af_eid=94385142&_af=event

What’s a Hackathon you say? It’s a competition where developers, designers, and other I.T. students and professionals gather together to network and create software applications within a specific amount of time. I find these events to be a lot of fun and very challenging (I love a challenge). You get to meet a lot of really smart people and learn about various technologies. It also tests your knowledge and skills and reveals how well you perform under such trying conditions. In the end you can end up with a potentially commercial application. At worst you will learn what to do and what not to do when challenged with such a difficult deadline. All in all … you will either love it or hate it.

Yes, I competed in 4 previous Hackathons – one in New York City and three in Virginia. My team and I won prizes in 3 out of 4 of these events including taking the global grand prize in the 2012 AppOlympics in held in New York City! So what plans do I have for the upcoming Hackathon in Vegas? While I can’t tell you what we will be creating at the Hackathon (’cause then I would have to wipe your memory – wink) I will give you a summary of the technologies we will be using:

Intended OS/Platform:   iPhone and iPad using HTML5, CSSS3, and Javascript for Mobile

Development Tools/Platform:

appMobi XDK – testing and deployment,

WebStorm – source code editing,

Adobe Fireworks – graphics design

Javascript Language/Libraries:

jQuery libraries OR jqMobi libraries (I still can’t decide which I will use),

Sprite3D.js – 3D visualizations and animation

CSS Libraries:

Twitter Bootstrap – easy element styling,

jQuery OR jqMobi (I still can’t decide which I will use)

Cloud Services:

appMobi XDK – app deployment and push notification

 Kii Cloud – cloud data storage, access to Facebook, and access to Twitter

I can tell you that it will be a travel related app and that we have dozens of pages of hand-drawn sketches describing our app (Rule #1: No coding before the Hackathon begins). After 4 successful Hackathons I have found that this combination of tools and technologies enable us to quickly create a working application prototype. However I am always open to suggestions and I am always willing to learn more (such as Angular.js and Sencha).

So stay tuned to this site as I submit updates about my experiences at the AT&T Developer Summit, CES, and the CES Hackathon. What about my free time? Well somethings have to stay in Vegas.

Ciao

I’M BAAAACK!

Posted: December 9, 2012 in Uncategorized
Tags: , , , , ,

Hello World,

I am back from my self-imposed sabbatical from the blogosphere. During that sabbatical I have spent (and continue to spend) a lot of time designing with, developing on, and exploring brave new technologies. During this time there have been major changes in my development career:

Windows to Mac

I have crossed over to the LIGHT. I am now a committed Apple user and developer. This happened as a result of my current project with my current client. I entered the project group as a Windows user and developer surrounded by Mac users and developers. One day my client surprised me by buying me my own MacBook Pro. Since then I never looked back.

phpnodejs

My current client had no use for ColdFusion. The other developers on our team started using Erlang (and now Node.js) and so ColdFusion was dropped from my development toolkit. I now embrace PHP and Node.js.

jquery_logo

I was called to join the team because of my Flash/Flex skills and game development experience. We explored and developed several prototypes using the Flex platform using external libraries such as Away3D but found them unable to scale to the type and size of our project efforts. Because our requirements include the need for cross-platform, mobile apps we are now working with Javascript-based platforms and libraries. I am now able to leverage my longtime web design and development skills to produce web and mobile applications across many platforms using technologies such as: Javascript (jQuery, jQuery Mobile, jqMobi, PhoneGap, Sprite3D, Knockout, and more), CSS3, and HTML 5.

So although I’ve been absent from my blog for over 3 years it’s been a very busy 3 years full of learning, growing, designing, developing, Hacking (I won prizes in 3 Hackathons – World Grand Prize in one), and teaching. And it’s only just begun!!

Stay tuned to this blog as I continue to bring you The World Wide Web According To …

Cheers