SmartyP

An updated version of the UI Design and Interaction Guide for Windows Phone was posted on the Windows Phone 7 forums today. There is also a big collection of Photoshop files to help when designing your apps which can be downloaded here as well.

Take a look through the new guide and feel free to post anything you find interesting either here or at the official forums. The guide has gone from 69 pages to 101 pages, so there should be lots of expanded content to look through.

Below are some sample shots from the updated guide. You can find the 10 items that can be shown in the Status Bar, the push notifications whose colors conform to the user's accent color, and the updated application bar which now shows button labels - hopefully you've already noticed most of this playing around with the most recent release of the developer tools.

You can also check out all the available accent colors in the updated guide. My guess is that these are the final theme choices, but I wouldn't be surprised if different phone carriers add in their own company colors and perhaps set them as the default.

Two weeks ago in my post Pre-Alpha Videos of My Windows Phone 7 Games in Development I posted a short video of a game called 'Hungry Castaway' that I am working on with one of my friends for Windows Phone 7. At that point I had only gotten as far as replicating a concept I had done in Silverlight over to XNA. Now that I've had two weeks to get some work done I wanted to post an updated video.

At 0:44 into the clip the video skips ahead to show more hectic gameplay to give an example of how the gameplay scales based on skill. Please keep in mind this game is still early on, so the gameplay in this video likely doesn't reflect the final game.

While sitting on the couch last weekend, I had the idea for putting up a Twitter panel on my site - you should see it off to the right. I figured since this is a Silverlight site, that it might be nice to actually have some Silverlight on it. I got the Twitter panel mostly done in 2-3 hours, and ended up using a few Silverlight features I haven't blogged about yet on the site - hence this blog post.

This post contains:

• Binaries for the Twitter panel so you can use it on your own site
• Passing in startup parameters from the object embed code
• A simple reusable Twitter assembly for Silverlight
• Source code for the Twitter panel
• Using Fluid UI to animate items added to the ListBox

(click 'read more' to keep reading..)

I am very excited to say that I've been awarded the 2010 Microsoft MVP Award in Silverlight! It is very humbling to now carry the same title as many of my peers from whom I've learned so much - and I still have much to learn from them. Thanks to those of you who've helped me achieve this great accomplishment.

It is also exciting that another member of the Atlanta Silverlight Meetup group was named Silverlight MVP as well - Jeremy Likness. If you're not familiar with Jeremy's blog, be sure to check it out.

For a complete list of new and renewed Silverlight MVPs from this quarter you can check out Tim Heuer's blog entry here.

It has been mentioned a few times in the last month or so that if you want a Windows Phone 7 test device, then you need to be showing why you deserve one. Most notably, Brandon Watson has laid out a post showing 2 such examples, and listing 6 suggestions of how to garner the @wp7dev team's notice. Well, I'm going to take those 6 suggestions, and respond to each - because I want a friggin' test device.

1) Get the tools and start building apps.
I am working on 3 games independently, as well as several at IQ.
2) Blog about your development progress. Screenshots and videos help a lot.
See #3
3) Tag posts with "Windows Phone 7 Development" or "wp7dev" so that we, and other developers, can find you.
Windows Phone 7 Posts on SmartyPantsCoding.com
4) Build something which extends the platform and can be used by other developers.
How to use the Facebook Developer Toolkit with Windows Phone 7
My Windows Phone 7 Pivot Control
5) Post videos of your apps running in the emulator to youtube
See new preview videos below (hopefully Vimeo is alright)
6) Register in the Windows Phone Marketplace.
Done.

To put things in context, I had no intention of posting any videos of my WP7 side projects anytime soon. I hope (read: pray) that folks watching these videos understand that both of these games are very much in the pre-alpha / proof-of-concept state at this point, and honestly any sort of feedback at this point would be very premature.

Pre-Alpha Preview Video of Matchingo 2
This first video showing Matchingo 2 is a very rough port of the original Matchingo - this game will be getting a complete frontend overall and hopefully some pretty cool additions. The UI in the video below is 100% temporary.

Pre-Alpha Preview Video of Hungry Castaway
This second video is showing Hungry Castaway, which is in the proof-of-concept stage as well. This is the game I have been working on in both XNA and Silverlight versions, which I've referenced recently. I spent quite some time evaluating Silverlight vs XNA for this game, but I have now chosen XNA and am back to focusing on functionality.

There is a third game I am working on for WP7 as well, however it is way too early to show anything. I also would love to port ImageWind.net to WP7 - but I have to get a better understanding of if such an app can make it through the app approval process. Now that a few of the cats are out of the bag, I guess I better get back to work.. ;)

The last month or so has been pretty hectic both at work and in my personal life - but rather than make excuses or promise to blog more frequently, I'll instead just post a grab bag of random tidbits I've learned / come across this month.

First Screenshot of the Windows Phone 7 Launch Screen in Landscape

Having played with the hacked emulator quite a bit I'd grown concerned at how few apps so far supported landscape orientation - including the main launch screen of the phone. I am pretty sure that this screenshot above is the first shot of the launch screen running landscape, which is nice to see. I am very hopeful that the WP7 team might update their Windows Phone 7 Series UI Design & Interaction Guide to discuss more about landscape orientations, and that more videos or screenshots might come out showing how native apps will handle this orientation.

Some New Understandings about the Visual State Manager in Silverlight
Two of the biggest issues I'd run into using the Visual State Manager was the inability to know when a state transition had completed, and the ability to query the current visual state. Thanks to this month's presentation at the Atlanta Silverlight Meetup by James Chittenden I now know the solution to both of these issues.

It turns out that in Silverlight 3 you actually CAN tell when a visual state transition has completed. I had asked around to several folks about this, so apparently I wasn't the only one in the dark on this ability. It is actually very simple. Supposing that the name of your visual state is 'MyState', attaching a completed event is as simple as attaching a completed event to the relative Storyboard:

MyState.Storyboard.Completed += new EventHandler(Storyboard_Completed);

New in Silverlight 4 is the ability to query the current visual state of your control. Supposing that the name of your visual state group is 'MyVisualStateGroup', you can check the current state like so:

string currentStateName;
if (MyVisualStateGroup.CurrentState != null)
    currentStateName = MyVisualStateGroup.CurrentState.Name;

Windows Phone 7 Development Continues...
Finally, I just wanted to point out that I am still working on Windows Phone 7 applications - both at work, and in my personal time. Brandon Watson and others have recently commented that developer devices will start rolling out in July, and that those who want a test device need to be showing off their work. I hope to post some information as to the initial apps/games I hope to have in the marketplace on launch soon - and if you want an early test device, I suggest you do the same.

In my last blog post on XNA for Windows Phone 7 I said that I was working on a game in both Silverlight and XNA, and that if I got a chance to test out performance I would report back. As you can see in the image below, I got a chance to test out my Silverlight game on a real device last week at ReMIX Atlanta - so this post is to cover some insights gained.

First off, if you are trying to get a basic understanding of when to choose between XNA and Silverlight for WP7, you should take a look at this post by Michael Klucher. Michael lays down the basic differences between the two platforms - Silverlight has great controls with great tool support for styling them, and XNA has a crazy fast sprite rendering pipeline which supports full 3D.

But, let's say that you don't need controls for your game, and you don't need 3D - is Silverlight good enough for writing a basic 2D game? After playing with a device briefly last weekend I can tell you the performance of Silverlight on the device looked great - but you will need to analyze the game you're creating a bit before making the ultimate decision.

(click 'read more' to keep reading..)

Update 07/14/2010: With the latest Beta release of the Windows Phone 7 Tools there is now built in support for landscape games in XNA Game Studio 4.0. I just put it into my landscape game and it works great - it even automatically supports both landscape directions. Check out this article for details.

I've been working on a game in Silverlight for Windows Phone 7 (WP7), but I have started thinking I should have gone the XNA route. I am now trying to recreate the game in XNA so that once I can get my hands on a device I can figure out for certain if the Silverlight version can perform as well as the XNA version for what I'm trying to accomplish.

In getting started in XNA it took me a bit to figure out how to draw my sprites and game in the landscape orientation on the phone. I also thought it was a bit tough to add a frame per second counter, something I heavily rely on when developing for Silverlight - this blog entry will show how to accomplish both.

How to create a landscape game in XNA for WP7
Keep in mind that according to this article by Shawn Hargreaves there will eventually be built in support in WP7 for handling the landscape orientation - this solution is just a temporary solution until then. Also, keep in mind that things like the X and Y positions for mouse and touch events will need to be inverted as well to support landscape.

First, we are going to create a RenderTarget2D - this is basically a buffer we are going to render everything to before rendering this buffer to the screen at a 90 degree rotation. We also want to define variables for the width and height of the game window instead of relying on GraphicsDevice.Viewport since we are flipping the X and Y coordinates to make the game landscape.

private RenderTarget2D renderTarget; // what game world is rendered on before being rotated
private int GameWindowWidth; // the width of the game window we are rendering to 
private int GameWindowHeight; // the height of the game window we are rendering to

Setup the GameWindow variables in the Initialize() method:

GameWindowWidth = graphics.GraphicsDevice.Viewport.Height;
GameWindowHeight = graphics.GraphicsDevice.Viewport.Width;

Initialize our RenderTarget variable in the LoadContent() method:

renderTarget = new RenderTarget2D(GraphicsDevice, GameWindowWidth, GameWindowHeight, false, 
    SurfaceFormat.Color, DepthFormat.Depth16);

(click 'read more' to keep reading..)

I am very stoked to say that I've been selected to speak at CodeStock 2010 in Knoxville, TN on June 25th and 26th. I'll be doing a revamped version of my Thinking Outside the Battleship Gray Box talk I did at the Atlanta Silverlight Meetup group a few months ago, and I'll be adding some new examples including some demos on Windows Phone 7.

Thanks to everyone who voted for my session - there were 300+ submitted, and I am very psyched to have been selected. Several other folks from the local Atlanta Silverlight Meetup group will be presenting as well including Corey Schuman, Jeremy Likness, James Ashley, and Jason Rainwater. Hope to see you there!

Ever since Long Zheng pointed out an alternate start screen for Windows Phone 7 I've been convinced that the older layout was the better layout. The blank area in the current start screen (example B) is referred to as the 'gutter' - but it seems to be inconsistent with the use of cutoff text in the rest of the experience. I want to see what other folks think, so click the image below and weigh in via a twitter poll on the subject:

Our friend Wally McClure, whom you had a chance to see at ReMIX Atlanta, is making waves in the iPhone world.

Learn iPhone Programming for Free with Wrox, Novell, and McClure

Are you a .NET Developer wanting to get into developing on the Apple iPhone and iPad? Learn iPhone Programming for Free with Wrox, Novell, and McClure. Wrox/Wiley has released Wallace McClure’s Wrox Blox on Novell’s MonoTouch for free. The MonoTouch Wrox Blox is available at:

 http://www.wrox.com/WileyCDA/Section/id-406371.html.

For .NET Developers, Novell has produced the Trial Version of MonoTouch. The Trial Version is a free download that allows a developer to write and build applications and test them in the iPhone simulator. The Trial Version is available at: http://monotouch.net/DownloadTrial.

Wallace B. (Wally) McClure is the author of the Wrox Blox on Novell’s MonoTouch and the author of the updated Professional iPhone Programming with MonoTouch recently released. In addition, McClure has produced a downloadable video podcast introducing MonoTouch. The video is available for download from http://aspnetpodcast.com or directly at http://bit.ly/deMCoJ

Of particular interest to Silverlight developers in Atlanta learning WP7, the Atlanta Leading Edge User Group will be running a hands-on lab this coming Thursday in which attendees will work through building several WP7 applications. The meeting is on Thursday, July 29th in Duluth at 6:30 PM. Be sure to bring your laptops with the Windows Phone dev tools installed. For more information go to www.alemug.net .

Jim Wooley’s talk on RX to the Silverlight Atlanta User Group on Wednesday was a big hit. He had examples in WPF, Silverlight and also Windows Phone. Now you can have them, too, as he’s posted the code on his website: http://www.thinqlinq.com/files.aspx

At the July meetup, Jim Wooley (the LinqKing) will present on a powerful, but often overlooked, technology that has always been married to Silverlight: the Reactive Framework. We will meet at 5 Seasons Brewing at the Prado. 6:30 PM on Wednesday July 21st.

The Rx Framework, which came out of Microsoft R&D, was originally released with the Silverlight tools. It is also built into the Windows Phone core libraries. And yet few people know about it.

Learn how to use this amazing framework for turning pull-oriented apps into push-oriented apps. Find out why it is a mind-bending technology and how it improves your ability to make async calls on the Silverlight platform.

And if you still have no idea what the Rx Framework is — then you really need to come to this meeting.

James Chittenden gave us a preview of the Silverlight Pivot Viewer — a fantastic tool for data visualization — at the last meetup. I’m happy to announce that it is officially out. Go here to check it out: http://www.silverlight.net/learn/pivotviewer/

This meeting has been moved from Wednesday June 16 to Thursday June 24. James Chittenden, our guest speaker, was unavoidably and unexpectedly delayed in our nation’s capital on the 16th.

Going from “Meh.” to “Whoo!”… Designing and Animating UIs in Silverlight

Microsoft UX Evangelist James Chittenden will present a design-centric talk aimed at developers. We will meet at 5 Seasons Brewing at the Prado. 6:30 PM on Thursday, June 24th.

Why build a “meh” Silverlight app when with a little more effort you can make people go “whoo”?!

James will cover the essential steps that every designer and developer of Silverlight applications needs to know. Building off of a fully functional MVVM app that’s extremely bare on the design side, he will use Expression Blend to show you how to find your mojo when it comes to design. He’ll cover everything from quickly sketching out your ideas, importing design assets, creating and manipulating objects, building timeline-based animations, and wiring up interaction design to convert a typical user interface into one that harnesses the power of Silverlight.

Shawn Wildermuth of Agilitrain will provide an overview of Microsoft’s new Windows Phone platform on May 26th. We will meet at 5 Seasons Brewing at the Prado. 6:30 PM.

In case you missed Shawn’s excellent presentation at ReMIX Atlanta, this is another chance to catch it.

Microsoft’s Windows Phone 7 Series has been a top secret project for the past year and was finally announced at the recent MIX conference in Las Vegas. This is Microsoft’s first entry into the consumer phone market and is the first phone to support both Silverlight applications as well as XNA applictions. Shawn will walk us through the free tools that have been provided for WP7 development — including the desktop emulator — as well as some of the intracacies of working with phone specific features (vibrate, anyone?).

If you are a budding Windows Phone application entrepeneur or simply a Silverlight hobbyist looking for a different way to ply your skills, this is the place to be on May 26th.

Sketchflow — Wednesday, March 24

Chad Surprenant of Slalom will present on Sketchflow and the Process of Silverlight Development on March 24. We will meet at 5 Seasons Brewing at the Prado. 6:30 PM.

Sketchflow is one of the gems hidden away in Blend, allowing developers to prototype and then annotate the design of an application in a collaborative manner.

While anyone can build a Silverlight application, doing so within a process is still something we as an industry are trying to work out. Chad will be using Sketchflow as a springboard for discussing usability, process, and design in Silverlight development.

Chad Surprenant is a User Experience Evangelist and Senior User Experience Architect for Slalom Consulting, a Microsoft Gold Certified Partner that focuses on business and technology consulting with local expertise and national reach. He has been a usability advocate and consultant since 1997, and has experience in a wide range of vertical industries, technologies, and platforms, but has been focused on the .NET platform since 2007. He has a passion and strong advocacy for usability and intuitive design, and continues to champion the user experience. When not redesigning better solutions for bad usability, Chad likes to work on his graphic novel and spends time playing video games on the Xbox 360.

The last two Atlanta Silverlight Meetups have been recorded using Expression Encoder’s screen capture utility, and have now been posted for you to watch. Click the images below to check them out!

January Meetup – Silverlight Line of Business Applications – Jeremy Likness

February Meetup – Thinking Outside the Battleship Gray Box – Roger Peters

Thinking Outside the Battleship Gray Box – Wednesday, February 24

Roger Peters will be presenting at our February Meetup. We will meet at 5 Seasons Brewing at the Prado. 6:30 PM.

Here is Roger’s synopsis:

As developers, we’ve grown accustomed to the confines of the technology platforms available to us. With new platforms like WPF and Silverlight, developers must change their perceived limitations and learn how to think outside the box to create engaging experiences. How can we use new presentation layer technologies to create more engaging applications and break away from the traditional battleship gray windows application?

Drawing on Roger’s recent experience leveraging Silverlight technology, this presentation provides insights on how developers can learn to think beyond their perceived limitations, and shows real world implementations of some of the concepts discussed.