Category Archives: Websites

Technology, Content, Products

For the past 2 days I’d been taking time off from my everyday work schedule and spending it at non tech events organised by Indiblogger -  a community of Indian Bloggers. The first was the launch of a new show on an Indian television channel called MasterChef India 2, and the second a new product introduction event by Dove India.

While both of these were non-tech events, I realized what an important role technology and social media plays in reaching out to an audience to help promote a product or television content.

Almost every blogger at the event was well connected with their latest device tweeting every moment of their experience through Twitter. There was even a moment where the hash tag #MasterChefIndia2 was trending in India due to the reach of the community present at the event.

Digital and phone cameras were working with draining batteries capturing every frame of the events so that bloggers could share them through Flickr or Facebook Albums. Everybody at the event was passionate about writing, blogging and owned personal blogs. Everyone connected, exchanged cards, twitter handles and blog addresses!

So while it was easy for me to believe that I was away from technology over the weekend, I was actually amongst real techies!

So cheers to the tech world we live in!

Mariam

Adobe Edge and Flash – the coexistence!

“Flash is at the risk of being dethroned by the all new emerging HTML5 revolution!”

Well, something similar to the statement above is what I have been reading a lot lately. And this probably has to do with Adobe’s latest offering for web animations – Adobe Edge. I finally got it installed after a few hiccups and this is my initial impression after trying out a couple of amateur animations.

  • The Adobe Edge UI gives you a nice wide canvas to create animations. The interface has a stage, a timeline, a tool panel and a properties panel. Edge is great because it eases the production of animated web content which can be deployed and supported easily on multiple devices and platforms (iOS too!)
  • Adobe Edge is still in Preview, which means the team is expecting people to test it and provide feedback.
  • Adobe Edge is probably similar to what Macromedia Flash 3 was –  an animation tool still in its early phase.
  • Edge does not provide any means to edit the HTML file from within the GUI, however you can generate an HTML file and edit it in another software such as Adobe Dreamweaver.
  • There are very limited tools to use (only 4!) with an option to import image resources. An option to support the new HTML5 media elements such as video can be a great added feature!
  • The timeline can get a little different to work with initially, especially if you are comfortable working with Flash Professional.

Adobe Edge will definitely get interesting to work with as it matures.  As for Flash, I don’t see it going anywhere soon!

Mariam

Check out the Expressive Web Beta, an initiative by Adobe to showcase the modern web features!

PhoneGap Framework for Mobiles

I recently spent some time studying the PhoneGap framework with the purpose of creating content for Android devices. PhoneGap is an Open Source Mobile Framework that allows developers to author native applications with web technologies such as HTML, JavaScript and CSS. PhoneGap currently supports 6 platforms including Android, iOS, Blackberry, Palm WebOS and Symbian WRT (including QT).

Working with the framework made me realize how easy it is for any web developer to target multiple mobile platforms without having to write the native code, and yet achieve cross platform compatibility with the same content.

In other words, the content layouting is flexible and can run across different screen sizes and platforms without having to change the any part of the core code.

The framework usage is very simple and well explained on the website. Once you are setup with the framework within your preferred development environment, the only effort goes in writing your HTML files and compiling the builds with the HTML assets to test on the actual device. PhoneGap also has its own API functions which makes use of features such as Network, Accelerometer, use of Camera, Events, Data Storage etc.

Performance wise, it is good, but animating too many objects around the screen drops the framerate. I tried running a game and got a FPS of around 7-8 on older Android devices and around 12 on the newer ones such as the Nexus One.

Perhaps the biggest challenge was integrating jquery for database interaction, where network calls constantly failed. It was later understood that PhoneGap takes a little time to load, so if the device is not ready and the API calls to the network are made, then the network calls fail.

 

From the code above it is noticed that in order to use PhoneGap we have to load the phonegap.js script into the HTML file. This is one of the 2 code bases required for calling any PhoneGap functions (the other code base is native and is compiled when building the device build).

When the HTML loads, the first function called is the onLoad() function which checks whether PhoneGap is fully loaded. This check is done using the onDeviceReady event.

When the device is ready, an onDeviceReady event is fired. The next step is to check for network. This too is done using the PhoneGap functions – NetworkStatus. If the network exists, then the network related calls using jquery are used, otherwise an alert is sent to the user informing of no network.

I’ll soon be uploading a PhoneGap Android app, and will share the link for downloading when ready.

Mariam

 

Need to design your mobile website – Refer to these tips

I recently read this very interesting article on designing websites for mobile phones. The article focuses on usability aspects of mobile websites with some snippets of HTML and CSS code. The good point about the article is that it does not focus on any particular mobile OS or technology making the tips are completely neutral in description.

Some more supporting links that I came across about designing mobile web experiences and thought I could share -

Mariam