Packt Publishing completes 1000 titles

Packt Publishing is celebrating the publication of its 1000th title. I’ve been reviewing their books so it’s great to see them grow to this milestone.

Packt also supports many Open Source projects covered by its books through Project Royalty Donation, which has contributed over £300,000 to Open Source projects up to now.

As part of the celebration, Packt is allocating $30,000 to share between projects and authors in a genuinely unique way, soon to be disclosed on their website.

Packt is also offering their existing registered members or those who register before the 30th of September, 2012, a surprise gift. This initiates their celebratory occasion as they support their authors and readers both in a productive way.

For more information about Packt, the kind of books they publish, and to sign-up for a free account, you can visit their website: www.PacktPub.com

Mariam

Nokia unveils Lumia 920 and Lumia 820

Nokia unveiled their new phones today in one of the awaited Nokia announcements of the year. These were the Nokia Lumia 920 and the Nokia Lumia 820 based on the Windows Phone 8 OS.

Nokia defines the Lumia 920 to be the “World’s Most Innovative Smartphone” with it’s 4.5 inch screen with an LCD display, Snapdragon S4 dual-core 1.5 Ghz processor, 2000 mAh battery, integrated NFC, Puremotion HD+, and the PureView camera with a Carl Zeiss lens. What also seemed attractive was a demonstration of their super sensitive touch technology that made a touch on the phone screen in any form be it with gloves or with bare hands very easy and intuitive.

A big thumbs up to the built-in Wireless Charging in the Lumia 920 which makes it easy to charge the phone using the Nokia Wireless Charging Plates, the Fatboy Pillow and even the JBL Power Up Speaker. They announced partnerships with Virgin Atlantic and Coffee Bean and Tea Leaf outlets to implement these wireless charging plates.

Another technology that powers the Nokia Lumia 920 is the PureView imaging technology that uses the optical image stabilization system which holds the camera still even if the hands are a little shaky giving more stable and less blurry videos and photos.

Speaking about the app market, the event had demos of apps including the City Lens demonstration of the Location Suite, Nokia Music, Angry Birds Roost and the Cinemagraph. It was said that the Windows Phone marketplace has grown from 7K apps to 100K and most of the demoed apps would be made available with the existing devices.

Nokia has a lot riding with this launch. It was an anticipated announcement because Nokia has been in the news for all the wrong reasons and they really needed something impactful in their announcement to get back into the game with their competitors. With the announcement today, the strongest has been their imaging technology with PureView and their wireless charging. The release dates for these devices are not out yet so we have to wait to try the devices and everything shown today.

Mariam

 

Apps Vs Apps – Nokia Connects yet again!

When Nokia must have decided to recreate the successful Nokia AppTasting magic in Mumbai, they must not have anticipated the tremendous response they got from bloggers all over the city. A roomfull of 250 bloggers managed to get #NokiaAppTasting trending in a country which has 15 million Twitter users.

It sure shows that an “Indi-Blogger” power is strong enough to stir buzz when they get together. Sponsored by Nokia India, organised by the awesome Indiblogger team (completing 5 years) and hosted by the charming Vikas Khanna and the witty Rajiv Makhni, the event was great.

Going to a Nokia event always brings back great memories of the Nokia Developer events I’ve attended in the past. Although this one was not for developers, the passion of all the bloggers, tech and non-tech, was amazing. The Nokia AppTasting event was different and unique in it’s own way.

A lot of people I interacted with were not sure what to expect from the event.

“Technology and Food, Mobile Apps and Food App-etizers, Rajiv Makhni and Vikas Khanna, Tech Guru and Celebrity Chef?”

It was not long before the questions were answered. First by cheering with clenched fists in the air and then celebrating the evening by hugging another blogger sitting besides us. India’s tech guru Rajiv Makhni ensured the love continued by asking us bloggers to stare into our phones and then kiss it. I think it was a good way to break the ice and get started with the event.

As the evening unfolded, we were introduced to many useful apps on the Nokia Lumia and Nokia PureView phones.

The Nokia City Lens app showed a great use of compass caliberation and augemented reality. Depending on the direction the phone is held, the app locates the point of interest and visually shows them on the mobile screen. And because it uses GPS data, network connection is not always needed.

Nokia City Lens

Another app was the Mobile Sommelier by VinoMatch. The app has a complete menu of wine pairing features that helps improve the taste of a meal. Every menu selection is accompanied by a photograph of a generic wine group. This also seemed like a useful app when eating out or when having guests at home.

VinoMatch


Foodspotting was demoed on a Windows Phone. Foodspotting for those who haven’t used it is a food photo sharing app that has a community built around the sharing of food dishes. Vikas Khanna shared thoughts on how many chefs don’t approve their guests taking pictures of their dishes and then sharing them on social networking sites. But for him such apps are a good way to get critiqued.

I personally use FoodSpotting and find it very useful when I eat at a new place. Especially the reviews and rating others give to the food minimizes the trouble I face in deciding what to choose from a menu.

The app showcase was interspersed with some fun interactive sessions, witty comments, funny anectodes and informative quotes from the hosts.

I came back home wiser! I now know that Onion Halwa (a dense sweet desert made from onions) is a heritage of the Chadela Dynasty in Khajurao and there is a city called “Halwa City” in Tamil Nadu.

Nokia definitely scores with the Nokia PureView photography technology which is a strong reason why I will buy the phone.

Some pics from the event –

Nokia Apps take Centerstage
Moviemaking is no longer a painstaking business - Nokia Movie Maker App
An Adobe Photoshop like app for merging the best of multiple pictures into one
The Indibloggers that got Twitter trending

Indiblogger is a platform that brings together bloggers from all over India to share and communicate their thoughts. There are no specific categories that require bloggers to join the group. All that is needed is a passion for writing.

Mariam

Adobe ships Flash Player 11.4 and AIR 3.4

Adobe has released the new version of the Flash Player 11.4 and Adobe AIR 3.4. The runtimes have a list of new features, enhancements and bug fixes. Adobe has also upgraded the technology behind the AS3 Reference for the Adobe Flash Platform (ASDoc).

The updates to the runtimes are very critical, especially for mobile development. I had filed a bug about using the Adobe Native Extension (ANE) with Adobe AIR 3.3 on iOS some weeks back. Hoping the new release would be easier to work with ANE.

Flash Player and Adobe AIR Feature List

ActionScript 3.0 Reference for the Adobe Flash Platform

Mariam

The Act Game review

Playing the Act Game is like a watching a beautiful movie. It took me back to the times when I used to watch the classic Disney cartoons on TV, with the only difference being The Act on iOS has some interactivity to keep the user engaged as any game ideally should. I thought of reviewing this game simply because it has a very different gaming experience seen after a long time.

The story begins with Edgar a window washer with the City Medical Hospital spotting Sylvia the nurse through the hospital window and instantly falling in love with her. He dreams of romancing her, but is interuppted by his boss. He is forced to continue cleaning the windows with his sleepy brother Wally when all of a sudden, his brother enters the hospital room through the window and gets into an empty bed. The story then takes Edgar inside the hospital and through various situations involving Sylvia and other characters to rescue his brother from being mistaken to be a patient requiring a brain transplant.

The game animations play very smoothly. The artists have used the classical hand drawn animation style, so the quality of animations are very high. The characters are superbly designed and one can understand their emotions through their expressions.

The controls are very simple involving sliding the finger on the left or right side of the screen. All game interactivity have Edgar responding to the player swipes.  The music too is beautifully rendered and suits the game perfectly. The only issue with the game is that is has a very small game length. One can easily finish it in 30-45 mins.

I remember reading somewhere that the team working on this concept had been test marketing it since 2007 but cancelled launching it then. It has finally released in 2012 on the iOS platform published by Chillingo and is worth a play just for its uniqueness.

Store Wars for the Game of Phones

Apple iTunes and Google Play together dominate consumer attention for application downloads. But when pitted against each other, they can get quite competitive!

App Store Stats

Stats say, Japan is amongst the top 3 countries for app download and revenue on both the stores. It is also amongst the Top 3 for the fastest growing markets for revenue. US and UK are also amongst the top 3 countries.

Google Play considers Brazil to be amongst the topmost countries to tap in terms of revenues expecting 88% growth.

India even with its large population would take some time to build a profitable market for smartphone apps because we still have a majority of our people using feature phones/low end phones.

Mariam

Book Review – Introducing HTML5 Game Development by Jesse Freeman

HTML5 Game Development

The Introduction to HTML5 Game Development has been one of the most easygoing readings I’ve had in the recent times. Written by Jesse Freeman (@jessefreeman), the book has language which is simple and crisp, without being over-the-top technical. It comes with well written examples and steps to take you through the process of game development.

When I first read the introduction, I was curious to know more about the contents. The book was small with just over a 100 pages, so I was sure that reading it would not take me more than a day or two to complete it.

The book takes you through all the steps that are typically followed in a game development cycle. The good part is that it covers the entire cycle with a single game giving more emphasis on learning techniques rather than writing game logic. Infact I was very glad to learn about the process of creating sprite sheets in Adobe Photoshop using scripts (something I had never attempted before).

The book speaks extensively about the Impact JavaScript Engine for HTML5. The Impact engine has many pluses including running on almost all HTML5 capable desktop and mobile browsers. The only minus is, the engine is not open source and there is no trial version available. The engine is priced at $99.

Personally, I have never been a fan of any engine or framework that is not community driven, but some of the games created by Impact are very impressive. Developers who want to invest in writing high quality games across browsers should consider it. There is information in the book on setting up the development environment to get you started.

Overall, the book is well written but more suitable for developers who have some knowledge of writing games. The book can be downloaded from the link below –

Introduction to HTML5 Game Development published by O’Reilly

Some other useful links –
appMobi Game XDX
Point of Impact – Resources relating to the Impact Game Engine

Mariam

HTML5 Game with EaselJS and TweenJS

HTML5 has been a subject of interest and discussion for many developers. I was intrigued by the platform myself and decided to explore it with a simple game of Concentration to understand how easy or difficult it is to plan a project that requires these new web standards. I used the Canvas element with the EaselJS Library and the TweenJS Library for development.

http://mariamdholkawala.com/games/concentration/gameconc.html

Working with the Canvas
When developing games with HTML5, one of the most crucial elements is the Canvas. The Canvas is like a blank slate on which graphics can be drawn using Javascript. The Canvas element is always added to the HTML page with an id reference for use in Javascript. However a canvas can also be created dynamically using JQuery.

Once the canvas is ready for use, we can combine it with libraries such as EaselJS to draw graphics or text. EaselJS has object properties very similar to Actionscript thus offering a more familiar ground to Flash developers.

HTML (set the Canvas):
<canvas id="myCanvas" width="550" height="400"></canvas>

Javascript (loading an image on the Canvas):
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
var img=new Image();
img.src="graphics/title.png";
img.onload = function(){
ctx.drawImage(img,0,0);
}

Javascript (using EaselJS to load image on Canvas):
var canvas = document.getElementById("myCanvas");
var stage = new Stage(canvas);
var img=new Image();
img.src="graphics/title.png";
img.onload = function(e){
var title = new Bitmap(e.target);
stage.addChild(title);
stage.update();
}

<div> tag verses <img> tag verses Canvas
There was a constant decision to be made on what is the best approach for loading graphics. The choice was mostly between the <div> tag, the <img> tag and the HTML5 Image element. I personally observed that all seem efficient to use, but preferred using the HTML5 Image element for in-game graphics because they could be manipulated dynamically much easily. The <div> and <img> tags seemed suitable for the static background and other UI elements which needed design effects with CSS.

HTML (adding a div tag and loading image in the div using CSS):

<div id = "btn"></div>
<canvas id="myCanvas" width="550" height="400"></canvas>

<style>
#btn{
background:url('graphics/playbtn.jpg') no-repeat center;
}
</style>

Mouse Events
Mouse Events and Touch Events are necessary to make any game interactive. With HTML5 too, they can be applied to individual graphical elements or to the complete canvas. Some of the useful events for games are onLoad, onMouseOver, onMouseOut, onClick.

In the Concentration game, I used click events for independent HTML5 elements like button images. I also applied a click event to the complete in-game canvas. This is because, during the game-play, the card placement changes with every level. Each card has a property which is best identified by comparing the mouseclick X and Y properties with the card’s X & Y properties.

Javascript (adding a Click Event to the whole canvas):
canvas.addEventListener("mouseup", mouseUp, false);
or
canvas.onclick = mouseUp;

Javascript (adding a Click event to a graphic using EaselJS):
image.onClick = mouseUp;

Javascript (mouseUp event)
function mouseUp(e){
var mx;
var my;
if(e.layerX >= 0 || e.layerY >= 0){
mx = e.layerX;
my = e.layerY;
}else if(e.offsetX >= 0 || e.offsetY >= 0){
mx = e.offsetX;
my = e.offsetY;
}

for(i = 0; i<deck.length; i++){
var card = deck[i];
if((mx > card.xpos && mx < card.xpos + cardWidth) && (my > card.ypos && my < card.ypos + cardHeight)){
//card clicked
}}}

Working with Different Screen Sizes
Supporting different browsers and devices is touted as one of the biggest plus points of HTML5. This means we should be able to customize our content to detect different screens and render the code accordingly. However this is not as easy as it seems, especially for games. There are several challenges in supporting the game on different browsers and device screens.

I remember reading an article on Adobe Developer Connection on working with HTML5 and CSS3 with Dreamweaver but it seemed more apt for app development not suiting my purpose of fluid dynamic screens for games. I did some testing with my game code and managed to achieve a common graphic database for some in-game elements. The current game that I developed, detects the browser and resizes in-game graphics after identifying the device (although there is scope for improvement).

Using TweenJS for transitions and animations
Very good transitions and animations are easily achievable using CSS3, but the TweenJS library makes it much easier to work with animations, especially if you have used the EaselJS Library for the rest of the game. I have used the fade-in fade-out transition for the cards in the Concentration game.

The code below simply fades an image to 0 alpha within 400 milliseconds without a loop. The detailed use of the TweenJS library can be found online.

Tween.get(imageToTween,{loop:false}) .to({alpha:0},400,Ease.get(1))

There are many resources available to understand game development with HTML5. I found the development interesting and hope to discover better development techniques as I work with this code. For seasoned Flash game developers, it may feel like a little let down, but giving in to the HTML5 hype can keep the motivation up.

http://mariamdholkawala.com/games/concentration/gameconc.html

This game should load in all browsers supporting HTML5 (IE gives weird results, not tested on Safari). The game should also run on device browsers but may not give a great experience because it is not ready for devices.

I’ll share the code when it is ready.

UPDATE: The game source files can be downloaded from ConcentrationGame.zip (1.24MB)

Mariam