blog

QR Coder for Mobile Devices

Being a mobile app developer, I have to keep few devices around me all day for debugging and testing my apps. Nowadays, all smartphones come with Bluetooth, WiFi and now NFC technologies, but they all fail to talk to each other for even simple text data exchange.

I find myself in situations where I need to quickly get piece of text from one device to another. It could be a link, some text copied from browser, or SMS message I received on one device, and need to get on other device without messing around with apps or wires.

QRCoder-demo

Yesterday this idea came to my mind when I was reading a lengthy article on my HTC Titan and received system notification that I need to recharge or else phone will power off. I wanted to quickly open the same article on my Nokia E7 which I was also carrying with me.

As I described earlier, that we currently don’t have any standard way to get these devices talk to each other directly without going through the “cloud”, so I was stuck there.

I quickly jumped back to my seat, and started some experiments. After an hour I did my first test and and it was a success!

I wrote a tiny JavaScript which can be added into mobile browser’s favorites, and when you need to share current page’s link with another device, you can just go to that saved Favorite, which will execute my JavaScript, which will finally render a QR Code right on top of the page.

Now you just need to point your other smartphone or tablet camera to it with a QR Code reader app of course (built-in in WP and other OS’s), and voila! The link will now open up.

It works in PC browsers as well, so if you need to quickly open a link on your tablet or smartphone from PC, you can save this in bookmarks toolbar in IE/Chrome/FF/Safari, and click it to instantly make a QR code for current link.

I tested it on all major PC browsers, and on my Nokia E7 and HTC Titan. Works great! It should run on all mobile browsers which support editing of bookmark URL, so you can insert the code there.

BTW, I used old Google Charts APIs to make the QR codes.

And finally here’s the code which you can copy and save as favorite in your mobile browser.

javascript:(function(){function QRCoder(){var u=window,t=document,n=t.createElement("div"),r=t.createElement("img"),i;r.src="https://chart.googleapis.com/chart?chs=200x200&cht=qr&chl="+window.location,n.id="QRCoder",n.style.padding="60px",n.style.border="1px solid #f00",n.style.textAlign="center",n.style.backgroundColor="#ccc",n.onclick=function(){t.body.removeChild(t.getElementById("QRCoder"))},i=t.createElement("div"),i.style.fontFamily="tahoma",i.innerHTML="tap to hide",n.appendChild(r),n.appendChild(i),n.style.zIndex=6999,n.style.position="fixed",n.style.top="10px",n.style.left=u.innerWidth/2-130+"px",t.body.appendChild(n)}QRCoder();})()

Remember, there are no line breaks in this code. It’s just one long line of JavaScript code :)

Step by step guide:

  • Select and copy the above JavaScript code. On PC, do triple-click on code to select all code
  • Open web browser on mobile or PC
  • Add / save this page as bookmark or favorite
  • Now select and edit the saved bookmark
  • In name field, type “! QRCoder”. The character in start makes sure the bookmark is always on top of the list in your bookmarks list. Easy to tap :)
  • In Location / Address field, just paste the JavaScript code you copied in first step.
  • Ok / Done to save. Now go to any website and from bookmarks / favorites, tap on “! QRCoder”

To quickly land on this page, scan this QR code from your smartphone or tablet:

qrcoder-chall3ng3r

Tested on following devices / OS:

  • PC / Mac / Linux – Check
  • iPhone, iPad – Check
  • Windows Phone 7.5 – Check
  • Symbian Anna / Belle – Check
  • Z10 / BB10 – Check
  • ToDo: Android

I know when this gets published, many non-techy users are going ask how to save this code in mobile browser as favorite. So, here’s a little video demonstration on a Windows Phone:

[YouTube link for mobile viewing]

Kindly ignore audio/video quality and any narration mistakes, this is my first ever video, done really quick :D

It’s a quick and dirty hack to solve a problem. You can also hack it further as per your liking.

I would love to hear any feedback or a tweet :)

// chall3ng3r //

Slides & Code from Nokia Developers Workshop in Islamabad-PK

I am really happy to be part of Nokia Developers Workshop which was jointly organized by Nokia Pakistan and Telenor, in Telenor’s premises in Islamabad.

It was a two day workshop (28-29 Feb 2012) where I talked about Qt Quick runtime and QML for designing and developing great looking apps and games, with focus on game development for Symbian and Meego based Nokia devices, such as Nokia N8, E7, X7 and the recently announced Nokia PureView 808.

The 2nd day of the workshop was even more fun as we explored the Box2D engine APIs using QML. One interesting thing I’d like to share was that I did not practiced making Ping Pong using Box2D before the workshop. But I was confident enough as I’ve been playing with Box2D and QML for some time, to do it live ;)

pingpong-qml-desktop

pingpong-qml-develop

Below is the slide deck of my talk. You are free to download and modify it and use it for your own presentations. I will appreciate if you include my name in credits as original author.

[slideshare id=11822582&doc=gamedevelopmentwithqml-chall3ng3r-120301152703-phpapp02]

Download PowerPoint file

And here’s the project for Ping Pong game we developed at workshop. PingPong-QML.zip

As we figured out on the first day of the workshop that Box2D was not getting compiled with default MSVC2008/2010 compiler Qt SDK uses. Box2D compiles correctly with MinGW 4.4 compiler for Desktop and Simulator targets, which is an optional component in Qt SDK.

For Box2D development using QML, install Qt SDK in custom mode and check all components to be installed. When you open the Ping Pong project, remember to check if you have selected MinGW 4.4 as the compiler as shown in screenshot below.

pingpong-qml-compiler

There were few things that I needed to skip due to time constraints. One of them was making icons for your applications. If you are targeting Meego OS then you can safely use a PNG file as an icon. But if you are targeting Symbian OS you need to make your icon in SVG-Tiny format. It’s a vector format, and you need to draw again in Inkscape or Illustrator if you have done it in Photoshop.

The easy workaround for you is that we have developed an online icon making tool specific to cover this issue for beginners. Use our popular SVG Icon Maker tool to make SVG-Tiny icons from any image.

The second thing I skipped to discuss was, the Ping Pong game is hardware accelerated. Yes, it uses OpenGL to draw the graphics. So you can use heavy graphics in your game and it will never lag. To find out how I have enabled this take a look in main.cpp file of the project ;)

And finally here are some photographs taken on the last day of the workshop.

DSC_0020

DSC_0018

 

DSC_0063

It was a great experience for me and I hope all the participants enjoyed developing with QML and publish a game or an app soon on Nokia Store.

Another great news for all the participants of the workshop is Nokia have announced a global competition for developers who will develop an app or game using Qt Quick components can win a free Nokia PureView 808 device which features a 41 megapixels camera!!! More details here.

It’s a great opportunity and perfect timing for you to develop and publish a new Qt Quick app in Nokia Store and win a great new Nokia PureView 808.

Nokia Pakistan is planning to do more workshops in coming months, so join Nokia Pakistan Developers group on LinkedIn for updates and share your feedback.

// chall3ng3r //

Nokia Developers Workshop in Islamabad – Day 1

Is was great energetic first day at the Nokia Developers Workshop in Islamabad, PK. I covered the basic concepts of QML GUI development with focus on dealing with games.

We also took a brief dive into the State Machine, Transition & Animations for GUI elements. We did a small prototype game-kindda thing which is not complete, but attendees asked me that I put the code for download.

BTW, we ended up with a funny name for this game, Ghobara Ghobara (in english Balloon Balloon) :D

So, here’s the Qt Creator project down for Ghobara Ghobara.

See you guys tomorrow at Telenor’s Office for getting our hands dirty with some Box2D ;)

// chall3ng3r //

Reinstalling Client for Microsoft Networks in Windows 7

I recently got into a problem where I by mistake uninstalled “Client for Microsoft Networks” option for my Dell notebook’s WLAN adapter.

The main issue which I was having was that the network icon in system tray was always showing as disconnected, even if I connect to WiFi or plug a LAN cable. It always shows disconnected, which was annoying.

So, if you happen to get similar issue in Windows 7, just open Device Manager from Control Panel, and select the WiFi network adapter and Uninstall it. Do not check “Delete the driver software for this device” Option.

ms-network-2

After this, from Actions menu in Device Manager, click “Scan for hardware changes”, which will reinstall the driver back from the drivers’ cache, and will also fix the network icon issue.

Now back to the original issue at hand. To reinstall the Client for Microsoft Networks, you first need to open the Properties window for the network adapter.

Click Install, and select Service, then there will be only option for “Flash and Printer Sharing Service for Microsoft Networks”,  select it to install.

Now go back to same window and this time click Install and select Client from the list. You will get option for “Client for Microsoft Networks”,  select it and install. That’s it!

ms-network-1

Now if you are connected to network, disconnect, and connect again so you can start accessing the file sharing service on your LAN.

I hope this will help someone in need :)

// chall3ng3r //

Highway Racer is #1 on Ovi Store

I would like to share our success so far on Nokia’s Ovi Store with our Flash Lite based game Highway Racer. You can read my previous post for our initial experience of publishing.

We are really happy with our experience so far. Highway Racer reached #1 spot in Sports category, and #3 spot in overall Games category on Ovi Store in just four days after published on Ovi Store for Pakistan region.

Now it’s 29th day on Ovi Store, it’s been jumping up ‘n down in top 30 games. Highway Racer have been downloaded 175000+ times and counting, on it’s way to million downloads. It’s current rating is 4 stars with 149 reviews.

Highway Racer is also reviewed by two popular mobile technology blogs, SenseApplied and TechProlonged.

This is quite a big achievement for our team at Orison Technologies.

Highway Racer - Promo 3

As of yesterday, Highway Racer is one of the featured applications on Ovi Store, and also it’s on #1 spot for Games and Sports sections. Thanks to Nokia team for the help on this :)

We have decided to keep Highway Racer free for more time as we work on an updated version. So, if you haven’t downloaded Highway Racer yet, just visit Ovi Store now!

// chall3ng3r //

Updated SVG2Go and PlayBook Icon Maker now live!

Finally I got some time to do the most requested updates to our online icon makers, SVG2Go for Symbian devices and PlayBook Icon Maker.

They are really helping a lot of developers and we have been receiving many suggestions and appreciation from around the world. And we thank you all.

We have so far 1800+ SVG-Tiny icons created for Symbian apps, and they include icon for games like Angry Birds Free version as well. And 2700+ icon for the PlayBook apps.

There are two major new things in this update.

  1. Option to enable a background fill color. This is also useful when you are dealing with a transparent icon which is hard to see on that checker-box in the preview area.
  2. Icon selection box and loaded image is opened centered by default. We have noticed many users confused that the selection box doesn’t move from the top-right corner. Well, it does and user can use Arrow Keys to fine tune the selection.

Click the screenshots below to start SVG2Go for Symbian or Icon Maker for PlayBook.

iconmaker-svg2go

iconmaker-playbook

Do let us know what you think about these new updates and any more suggestion you may have for future updates. Also, we’d be glad to hear for which of your apps you used our icon makers.

// chall3ng3r //

Installing Symbian Anna on N8, E7, C7 and C6

You might have already read about the recent announcement by Nokia that Symbian Anna is now being pushed to all the Symbian ^3 capable devices, like Nokia N8, E7, C7 and C6-01. To read more visit the official announcement on Nokia Conversations blog here.

In this post, I will give you some pointers, if you are unable to install Symbian Anna on your device.

The first thing you need to do is find out if the update is pushed for your region or not. Start SW Update app on your device, and wait for it to refresh the list of available updates. Once the list is refreshed, it will show you if the device update is available.

On my brother’s Nokia C7, the update was offered as OTA (Over The Air) 28mb update. Once updated, the SW Update now shows two more updates named as Symbian Anna 1/2 and Symbian Anna 2/2. Both updates are about 30mb each. I did not continue with the updates yet because the battery was not fully charged. So, will update it later.

Update for Nokia C7: Okay, I continued the updates on my brother’s C7, and both of the updates installed fine. Remember, that after update 1/2 is installed, it will ask you to restart device, DO NOT restart, as update 2/2 is already being in installing process. Just wait till the updates are installed (about 20 mins).

Then I checked for the update on my Nokia E7 development device, SW Update app showed me the update on device, but it asked me to install the update via Ovi Suite or Nokia Software Updater.

When checked via Ovi Suite, it always showed update for Here and Now app, but not the device update. So, after many tries in 2 hours, I downloaded Nokia Software Updater.

SymbianAnna-install

The Nokia Software Updater reminded me that I’m using the device without a SIM, so I have to put a SIM to make the updater work. So, remember developers, you need to put any SIM in device before trying update, otherwise the update will fail. Maybe Ovi Suite was also failing because of no SIM.

For my E7, the update size is 325mb, and it’s still downloading. I will update this post with my success, and might write another post to review the new things in Symbian Anna update.

Update 1

Okay, after the download and installation of Device Update for my Nokia E7 via Nokia Software Updater, I got quite a bit of Symbian Anna feeling. The icons and browser have new look.

Just after few hours, I checked for updates via SW Update app, and to my surprise, there were two more updates, like I seen on my brother’s Nokia C7. I checked and started the updates. The interesting thing to note is, the first 325mb update was only available via PC, and these two updates are OTA.

WP_000035

They took about 30 minutes to install. During the installation, I was asked two time for EULA for MS Communicator and JoikuSpot. I think these later updates are new version of built-in apps like Mail for Exchange and couple of new apps.

For me, both of these updates went fine on the first go. It restarted my E7, and everything seems to be working alright.

Important note, that after update 1/2 is installed, DO NOT restart your device manually. Just wait for the 2nd update to be installed as well.

Thanks to Nokia for this much needed update.

// challn3g3r //

Highway Racer – Now On Nokia Ovi Store

I am excited to announce our first entry into Nokia Ovi Store with our first Adobe Flash Lite based game, Highway Racer. It’s a simple arcade style racing game, to take a fun break in your busy life.

Click the banner below to head over to Ovi Store and get it FREE now. It’s a limited time offer ;)

Here are some screenshots before I get to details and our experience so far in publishing to Ovi Store.

1-Splashscreen 2-MainMenu

5-InGame 3-About 

Game Development Experience

Highway Racer is a Flash Lite 3 based game developed using Adobe Flash CS5.5. The development experience is best you can get. We used traditional timeline for animations and scripts on frames for interactivity. Most of the resources are small components and reused to keep the runtime memory footprint small.

flash-cs55-highway-racer

Highway Racer runs on all Symbian 5th Edition (Nokia 5800XM, N97, etc.) devices as well, but the performance is not as good because these devices have slower processor.

For best experience, we recommend playing Highway Racer on any latest Symbian ^3 device like Nokia N8, E7, C7, X7 etc.

Packaging and Distribution

For Highway Racer, we used SWF2Go Pro 2.6 to compile a SIS file to post on Ovi Store for QA. SWF2Go is our most popular development toolkit used by tons of developers in more than 50 countries around the world.

Since SWF2Go allowed us to get past the SIS making process in less than 10 minutes, we were then quickly on the phase to make graphics for Ovi Store submission.

Ovi Publisher portal is now really easy to use, I must say. The submission wizard is easy follow, and it was like just 4 steps. And you are done.

The QA process took 2 days only, which was quite a surprise for us, we were not even quite ready :D

There’s one small complaint/ issue, which I like to point out. On the Distribution “€œ> Language tab, there should clear note, if content is in English, select Works With All Languages / Publish To All Languages. We selected English (US) on first QA round, and later discovered that our game was only visible in US / Latin America. Ovi Store team, please add this note.

The After Shocks

It’s a complete surprise to us that Highway Racer is on #1 position in Sports category and #3 position in overall Games category for Pakistan region, just in 4 days!

We are very proud, and excited, as we have just stepped into Ovi Store, and finding such success in few days. It’s a big milestone for us.

We have already plans for follow up versions of Highway Racer as well as couple of cool new game ideas we are working on to publish on Ovi Store in coming months.

Download Highway Racer now from Ovi Store, and let us know your feedback and suggestions. And keep visiting Ovi Store for more of our exclusive games and apps to come ;)

BTW, Highway Racer is also our entry for Nokia and [email protected] MakeMyApp 2011 Challenge. Wish us luck!

// chall3ng3r //

Android Player for BlackBerry PlayBook – Virtual Keys

You might already know Android Player for BlackBerry PlayBook was leaked recently. It looks like pretty much intentional leak just to keep in the news while they work as slow as they can to complete it.

Anyway, I found the required files on CrackBerry forums and gave it a try. At first couple of attempts, after waiting for minutes I got some JAVA socket exception errors, but on third try, it went all fine.

The first thing I did was setup my email account so I can finally use PlayBook for some professional use, rather than just watching movies in spare time.

I was able to sync my Google Apps email, calendar and contacts easily using Android Player for PlayBook. However, there are not buttons to navigate. There’s a left to right swipe gesture on bottom bezel which works as Back command and swipe down for Options command on Android.

later, I explored the sys.android.bar and found there are actually "Virtual Keys" as PNG files for portrait and landscape orientations. So, I took a screenshot of Browser running in Android Player and Photoshop-ed the Virtual Keys PNG image on the the PlayBook screen just to get the idea how it’s gonna look. See for your self in bellow screenshot.

playbook-android-player-keys

playbook-android-player

Looks nice, and it will be quite easy to navigate within Android Player with these standard Android buttons.

I think this is a great idea to allow Android apps run on PlayBook, as we have already seen how slow RIM is coming up with native email client, which gives us the idea how future updates going to come.

Just couple of days ago I was asking from a local mobile gadgets shop to exchange my PlayBook with a Samsung Galaxy Tab. Good that I didn’t went all the way to exchange it :D

// chall3ng3r //

PayPal Why You Do This To Me?

The story begins in mid 2008 when I was on a 1 year contract position, working as Mobile Specialist in Germany. I opened up my first ever PayPal account and happily linked it to my German bank account. Everything was working flawlessly.

I made few purchases using PayPal, and also I managed to sell my Nokia N96 to get Nokia 5800XM (Nokia’s first touch input device) using eBay, and received payment of it in my PayPal.

When my contract was over, I started to roll my stuff, and found out from my German bank (Dresdner bank at that time which was in-transition to merged with Commerzbank) that I can keep my account open and use it from overseas via internet banking. I was really happy, that I can still use PayPal and my future European clients can pay to my German account easily.

I headed back to my homeland Pakistan in May 2009, and kept using PayPal for small payments for our web hosting services and domain name renewals. My same PayPal account is also used to accept payments from 99designs.com where my younger brother Najam has won some logo design competitions.

As some of my fellows in Flash and mobile developer communities know that we have recently published couple of apps for BlackBerry PlayBook, and we got quite a success from them so far. The payments of App World are also sent to my PayPal as it’s the only option for App World developers.

In last week of June 2011, I received an email from PayPal that my yearly money receiving limit is reaching (2500 euros) I was at 1800 euros from (August 2010). They asked my proof of identity and proof of address. I sent them a copy of my Passport and my recent German bank statement which shows my current address.

The address didn’t match the address in PayPal profile, as I never updated it in PayPal because Pakistan is not in countries list. So, I tried to add the address in PayPal profile and sent them the statement again. I called the PayPal (Ireland) support as well, as they deal with German PayPal accounts. They told me that I should wait for reply via email.

Now, I got a reply, that says:

After reviewing your PayPal account, we’ve determined there to be excessive
risk involved and would like to begin parting ways in a manner that is
least disruptive to your business.

I logged in to my PayPal account and found one additional note:

This limitation cannot be appealed.

Googled it and found that this is it. I cannot use PayPal anymore. Even I have a German bank account which legally allows me to use it from anywhere, and I am providing my proof of ID and correct address, PayPal don’t want to use my account anymore. There were no complaints filed against my account in past. It’s a clean PayPal account with limited number of transactions.

We recently planned that we exclusively target PlayBook device for our current development as there’s really lack of quality and good looking apps and games. Making our chances more than double compared to already filled iPad and Android markets.

We have been forced to stop here. It’s an unfortunate situation. PayPal for some reason does not support Pakistan, while they support many other Asian and African countries which are almost equal to or even worse than Pakistan’s political or stability situation.

I would have never used PayPal more if App World allowed to directly send funds to my local bank account. For now, I am thinking of asking a German friend who can accept my payments from App World for a month or two, then we are going to pull back from App World until they start paying directly to bank account.

I think it’s time that I start finding a job overseas again :/

Update “€œ Aug 2011

Okay, my PayPal account is now permanently blocked. PayPal opened it for 3 days again to let me withdraw my remaining fund to my linked German bank account. Now I’m done with PayPal.

I got the good news from RIM as well, as they agreed to offer me direct transfer of funds to my bank account. They sent me a contract, and it’s currently in progress of being activated.

We are now back on AppWorld development, and have couple of apps under development to the PlayBook. Thanks for RIM for listening to us.

// chall3ng3r //