Windows Phone 8: PhoneGap Porting Challenge

Take your existing PhoneGap (Apache Cordova) application published in any store and port it to Windows Phone 8.

Windows Phone 8

Prize

  • 17 first prize winners will each receive a Windows Phone 8.
  • 3 grand prize winners will each receive a Surface Pro and Windows Phone 8.
  • 20 winners will be announced Friday, July 19th at the PhoneGap Day event in Portland, Oregon.

How to participate?

  • Register with your Microsoft account and tell us about your app.
  • Port your app and test it in the Windows Phone Emulator.
  • Publish to the Windows Phone Store by June, 30th 2013.

You can read more about this contest @ http://www.phonegapwpchallenge.com

Windows Phone 7/7.5 + Phonegap = ????

When I saw Microsoft’s cool HTML 5 demo, I was pretty excited because it has all effects/animation that we need for Windows Phone. Pivot control and live title are already parts of that demo. (Of course, it’s not a re-usable component but it has all basic functionalities )  You can visit this link if you want to see the demo in action. ( Note: you must use the browser that uses webkit (For example: Google Chrome)).

We decided to give a try with HTML 5 + Phonegap for Windows Phone development. The first thing that we do is to create a pivot control based on that demo’s code. Of course, we can invest time to create an awesome pivot control that works on all browsers but this wasn’t our goal. We just want it fast! As I mentioned, the demo’s CSS is based on webkit so it doesn’t work on IE. IE10 supports some CSS3 with Microsoft specific tag “-ms” (just like -webkit for web kit engine, -moz for Mozilla ) but again, Windows Phone (mango) has IE Mobile version with IE9 engine (not IE 10). Then, we tried using “Sass CSS3 Mixins! The Cross-Browser CSS3 Sass Library” with Phonegap. After spending a few days, we realized that it’s not worth to make HTML 5 and CSS 3 works on IE9. We decided that we will be using Silverlight until Windows phone supports IE 10.

Does anyone use Phonegap for Windows Phone app development? How was your experience?

Cheetah, next running app’s prototype

I managed to create this prototype when I was in long holiday. I know that there are a lot of few running apps for windows phone 7 but I couldn’t find the one that I used to use so I decided to create one app based on what I need.

What do you think? :)

P.S. As I mentioned in my previous post, it’s always better to get a designer to do the UI design but when you have nothing better to do during holiday, you can still create some prototypes and let designers to publish it later.

Designer’s power

I was working on small windows phone app that implements well-known time management technique called pomodoro. I tried to come up with metro style but I wasn’t so happy with what I created so I outsourced this design to a designer who is already familiar with metro design concept. He managed to send the prototype within 24 hours and send the final one within two days. I’m quite happy with his design. (Please check the screenshots with red background.)

The moral of the story is that it’s just a waste of time if you ask developers to take care the UI design of your application. Sometimes, it’s more expensive to get the crappy design from developers than outsourcing the UI to designers.. It’s surprised to see that some developers are being asked to handle the UI part in some companies around my area. This is the reason why some products in our area got crappy design and bad usability.

But still, I still have one application that I designed when I was bored. It will be my next application. I will show you some screenshot in next post. I have developed “Metro Pomodoro” app and submitted to Marketplace. I will let you know once it’s published.

My initial design

Final design from designer

Windows Phone 7.1 (Mango) – Socket Sample

As some of you might know, I’m currently writing a book called “Windows Phone 7 in Action” with two amazing authors for Manning. We managed to put new sample for Socket to our git repository yesterday. Our small program has the conversational style chat message view which is similar to the SMS view on Windows Phone (Mango) and socket classes ( Tcp Unicast, Udp Unicast and Udp AnySource Multicast). In order to make our code simple, we didn’t add any validation logic in our code. We hope that our sample might help for those who are new to Windows Phone socket programming.

You might say that there are some examples for sockets in MSDN already but one important thing to note is that the author of those samples encourages developers to use ManualResetEvent. It’s so misleading. I don’t really understand why they did that. But all I can do is to give them feedback so I (and a few other MVPs as well) submitted the feedback a few months back but nothing changed until now.

Anyway, let’s get back to our sample code. Here is the folder structure and a bit of details about samples.

Clients

  • ChatTcpUnicast : This sample uses Tcp Unicast so you will have to run the Tcp Server to test the code.
  • ChatUdpAnySourceMulticastClient : This is UdpAnySourceMulticast sample so you don’t need to run any server. It’s just peer-to-peer.
  • ChatUdpUnicast :

Servers

  • TcpSocketServer
  • UdpSocketServer

You can download the full source from this link below.

  • Gitwp7.1 socket
  • git clone git@github.com:michaelsync/Michael-Sync-s-blog-sample.git

Please feel free to let us know if you have any question or anything for improvement. We are sorry that we couldn’t write all those explanations here. If you are interested in detailed explanation, please get our book “Windows Phone 7 in Action” from Manning. Thanks.

UPDATE: 

Note that I didn’t use appbar which is not bindable and doesn’t have Command.. so you gotta touch twice to send the message .. You may want to replace with this bindable appbar http://www.maxpaulousky.com/blog/archive/2011/01/10/bindable-application-bar-extensions-for-windows-phone-7.aspx