Dynamics Light Seeing the (Silver)Light effect in Dynamics CRM

Fuel My Car – Windows Phone 7 App

I attended Melbourne Bizspark Camp which was held last week at Microsoft Freshwater. The camp itself started with a workshop session on Friday followed by 2 days of hands-on stuff for building application for Windows Phone 7. Due to work commitment, I wasn’t able to make it to the workshop on Friday.

So I turned up on Saturday morning with one of my colleague from Oakton (Jonathan Hao) with expectation to learn new tips & tricks from Dave Glover and Nick Randolph. These guys are one of the best when it comes to Windows Phone 7.

Dave kicked off the hands-on day by announcing a competition for building a proof-of-concept application for Windows Phone 7. So I decided to team up with Jonathan and after a 5 minutes brainstorming, we came up with an idea to build Fuel My Car. After 2 days of very little sleep (and I blame World Cup for that) and a dreaded presentation on Sunday afternoon, we were awarded as the winner of the Melbourne WP7 Bizspark Camp. I was truly surprised and didn’t expect this coming. I would like to thank Dave and Nick for their great advice. Thanks a lot guys!

In a nutshell, Fuel My Car is a social mobile application that one can use to find nearby petrol stations. It uses the current user location to determine the closest petrol stations. The user can also mark petrol stations as their favourites and they will be displayed under the ‘favourites’ panorama item.

Once the user tap on one of the petrol station, they can see additional information for that petrol station such as the address / contact details as well as the pricing for different type of fuels available. The plan is to make this more social in a way that they can punch in the pricing into the app as they drop by the petrol station. When we were building this application, we want to make sure that the application still ‘works’ under all circumstances (including offline scenario).

Here are some of the UX design decisions behind the user interface:

- For the home screen, we decided to use the Panorama control (http://phone.codeplex.com) as it provides a sleek and consistent user experience. The panorama items displayed on the home screen are not tightly related to each other, hence lend itself to the concept offered Panorama control.

- For the Petrol Station detail screen, we decided to use the Pivot control as it displays a more tightly related information for that particular petrol station. We used the Silverlight 3 Visifire (www.visifire.com) charting control to render the dynamic charting. Note: currently Visifire doesn’t have a supported version for WP7, however their Silverlight 3 version works fine with WP7. We also utilized the PhoneCallTask which will show the phone call popup when you tap on the phone number.

- The one effect that I really love is the offline effect. Took me a while to work out what’s the best way to show the offline status to the user. At first, with my developer hat, I was tempted to just put a label somewhere on the screen with a red-bolded text that says ‘Offline’. After further thoughts, this awesome idea came to me while I was having shower. Would it be cool to change the image saturation to gray-ish style when the app goes offline? Didn’t take me long to implement it and I was really impressed with it (and I think the judges too!)

I hope this inspire people to build more and more mobile application on WP7.