Getting Excited for MIX10

MIX is by far my favorite Microsoft event, and not just because it’s in Las Vegas. It’s the mix of designers and developers, about learning cool stuff and just getting the creative juices flowing. Whether I’m there in person or just watching the keynote via the web it has a rejuvenating effect on me and gets me excited to make cool stuff.

This year I’m also excited for two reasons: first it looks like I’ll get to speak (link to my talk to be posted once it’s on the schedule) and two because as a gadget and code nerd we get to learn about the development story of the upcoming Windows Phone! Per the MIX website a few weeks back:

Yes, at MIX10 you’ll learn about developing applications and games for the next generation of Windows Phone. Yes, we’ll have Phone sessions, and we can’t say more…yet.

One thing I think people outside Microsoft don’t realize, at least I know I didn’t before working here, is that there is so much going on inside the company and we get so focused on whatever our project is that announcements like this are just as exciting for people inside the company as out!

Mix10_SeeYou_blk_240

Updated Mp3tag Sources for Zune 4.0

A new Zune release, a new updated set of sources for Mp3tag. The instructions are the same as always:

  1. Download the latest Mp3tag Zune Marketplace Sources: ZuneMarketplace.zip
  2. Unzip the two .src files into %appdata%Mp3tagdatasources
  3. Click the Sources button in Mp3tag and you’re ready to rock!

image

Two notes about this update:

  1. I renamed the sources to “Zune Marketplace” from just “Marketplace”, mostly to put
    it at the bottom of the list making it faster to select as well as giving Zune some
    branding love.
  2. Now this change may be a bummer for some, I no longer have a good end-point for
    the 800×800 album art.  I used to be able to do a little dance and grab the
    nice hi-res album art but no longer.  I’m still poking around to see if I can’t
    find a better source but for now you’re stuck with 200×200.

UPDATE: I’ve changed the scripts slightly to accommodate a change in version 2.48 of Mp3Tag where the BAND field has been renamed to ALBUMARTIST.

Zune.net Now Using Silverlight 3.0

One criticism we get as a company is that on the day Silverlight 1.0 was launched we didn’t do a massive refactoring of all Microsoft media-based or media-containing sites to use Silverlight. Since dry humor doesn’t often translate via blog I’m poking some fun at our critics with that statement. Any technology transition takes time, even one we believe strongly in like Silverlight. Given skill sets, market requirements and different time-frames it was never that surprising that the previous Zune.net still used Flash. It just made sense at the time.

Today is a different story though, today we can count one more site as having come into the Silverlight fold, Zune.net. If you visit my Zune profile and do the right-click dance you’ll see the lovely “Silverlight” popup (circled in red below).

image

In fact Silverlight is used twice on the page, first as the portion that shows recent plays, badges and the artists a member is following as well as the media player on the bottom of the page.

image

That little player is pretty nice for playing 30-second previews but it’s even better when paired with a Zune Pass. If you’re logged in and you have a Zune Pass then you can stream the full length track of anything in the Zune catalog. You don’t even need the Zune client software installed to listen to full albums. To give iTunes a friendly little dig you have install the software just to search their catalog.

Two great tastes together at last Zune and Silverlight.

Things I Heart About the Zune 4.0 Software

The next generation of Zune is here and as someone that has been fortunate enough to play with both the new software and a ZuneHD I wanted to share some of my favorite things in the new software. More details on the ZuneHD itself to come, as while I wrote this post the software features kept piling up so I’ll save the hardware focused one for tomorrow.

Quickplay

image

This is the new landing page when you first open the software and you’re instantly given a rich, media-centric view that shows new items, your most recently listened to items as well as anything you’ve pinned to the Quickplay menu. One of my favorite things about the Zune software is the fact that the UI adds to the media experience instead of just being a database of media.

While Quickplay is a nice, big, in-your-face feature there are quite a few little details I’d like to call out that you may miss.

Smart DJ

image

OK, so this isn’t really a subtle, little detail and many will argue that this is the feature that makes Zune 4.0 worthy. Smart DJ is like the iTunes Genius feature married to Pandora, able to create a never-ending stream of music based on an artist or song. Where this really shines is when you couple it with a Zune Pass because now you can pull music not just from your collection but from the entire Zune catalog. I’ve already discovered a ton of great music this way with the added benefit of being able to save these Smart DJ recommendations to playlists that I can then put on my device.

Remaining Credits & Expiration Date

image

Your Zune Pass gives you 10 free songs month but they don’t roll over so it’s nice to know when you’re entering “use ‘em or lose ‘em” territory. Now as their expiration date grows close the number of credits you have left turns a bolded pink and the credit’s expiration date is shown, calling out that you better use them soon. Given that I’m not close to my date it’s hard to screen capture this feature :)

Suggested Songs

image

If you click on your remaining credits you’ll be offered a list of suggested songs you might want to own, another great feature because invariably right when you need to pick exactly 10 songs is when you completely blank on all the music you’ve listened to, ever, and you end up either wasting the free songs or buying something you didn’t really want.

Content Filtering

If you’re a Zune Pass subscriber you’ve probably found yourself asking, “what music do I actually own and what is from my Zune Pass?” Wonder no more with the ability to filter your content:

image

New Backgrounds

Silly as it is every new release I look to see what new backgrounds are available and they didn’t disappoint, my favorite new one is Geisha.

image

Windows 7 Support

AeroSnap

One of the best UX features in Windows 7 to me is AeroSnap, the ability to use Win+Left/Right Arrow to automatically position a window at 50% of your screen. The Zune 3.0 software didn’t work with it, 4.0 gives us the snap love.

Taskbar Thumbnails

Full support for taskbar thumbnails, including a nice way to quickly pause and rate the current song.

image

Jump Lists

Another great Windows 7 feature that you slowly come to depend on is Jump Lists, now fully supported with Zune 4.0, offering quick access to your Quickplay pinned items and Smart DJ lists.

image

New Now Playing Layout

Another thing I’ve always loved about the Zune software is that instead of going the 1980’s route of WinAmp-style visualizations (sorry candy kids) it went for an artistic mashup of colors, art and metadata. That combined with some typographic treatment has really made the Now Playing screen one of my favorites in the software and something that I’d love to see on my 50” plasma during a cocktail party vs. the seizure-inducing XBox or WinAmp fractural crackfest.

image image

Here is Now Playing when there isn’t any hi-res art to use. Previously all the album covers were the same size, with 4.0 they’re varied giving the UI a more organic feel.

image

Whew, and that’s just off the top of my head while I’m waiting for my bus :) Needless to say the Zune 4.0 brings a host of new features and improvements on existing ones that makes this release exciting even without the ZuneHD. Of course the ZuneHD is here and as I’ll blog about later it’s a beauty.

Huh, Where Am I? (Redirecting enginefour to shawnoster)

If you were expecting enginefour.com and are now on shawnoster.com don’t worry, it’s all part of my mad plan.  Mad as in these little things really shouldn’t take as long as they do sometimes.

I’m redirecting all my old enginefour.com blog traffic over to shawnoster.com (which is where you should now be).  This is also a sneaky way to make sure all my old slugs (the bit after the domain name that uniquely identifies each post) have a corresponding one on my new site.

I created a “Hey I’m moving” post over there that will now redirect to *this* post here if all the regex’s line up :)  Back to our regularly scheduled broadcast.

Silverlight TreeView Connecting Lines And Blend 3 Support for HierarchicalDataTemplates

The July 2009 release of the Silverlight Toolkit has a bunch of great things in it but a few of them require just a little digging. A common request in the forums and on CodePlex is how to add connecting lines to the standard TreeView. Well, thanks to TreeViewExtensions and a pre-built template it’s now an easy request to fulfill.

I’m going to show you how to add connecting lines using Blend 3 but it’s not a requirement. Grab a copy of Expression Studio 3 if you don’t already have Blend installed. There were a lot of great enhancements with the last release so I encourage you to give it a go.

Prerequisites

  1. Make sure you’ve installed the July 2009 release of the Silverlight Toolkit
  2. Start a new Silverlight project in Blend 3
  3. While you could start by dragging a TreeView from the Asset pane onto the design surface I want to show off Blend’s support for sample data and editing the HierarchialDataTemplate.

Define Sample Data

One of the more annoying things when trying a do a little research into how you can tweak a control is having to come up with some kind of mock data to work with, especially when working with a TreeView because of its hierarchical nature. Blend 3 introduced a huge time-saving feature, Sample Data, that we’ll take advantage of.

For this example I want to end up with a common TreeView UI pattern, an icon followed by some text, similar to a basic file browser. With those requirements in mind lets create some sample data.

  1. Switch to the Data panel
  2. Click on the ‘Add sample data source’ icon (circled below) and choose ‘Define New Sample Data…’
    Define New Sample Data
  3. Go with all the defaults and click OK
  4. Presto, magic sample data!

At this point you can drag the SampleDataSource onto the design surface and Blend will create a ListBox with fields properly bound to the control and fully interactive sample data. Very useful but we need to do a just a little more tweaking to get it where we want it.

Change the property type of Property1 to an Image and Property2 to a String. You do this via the property type dialog accessed by clicking on the icon to the right of property name (circled below).

image

Almost there. We now have an image and some text but it’s missing that hierarchical nature. Easy enough to fix. Click on the drop down to the right of the Collection and click “Convert to Hierarchical Collection”:

image

At this point you’ll have a collection that contains a collection that contains a collection that… you get my drift. Grab the first Collection underneath SampleDataSource and drag it onto the Blend design surface and watch the magic happen!

You’ll end up with something like this:

image

Pretty awesome considering you didn’t have to create a single mock object, mess with any XAML or write any code.

Customizing the HierarchialDataTemplate in Blend

OK, now that the rush of excitement has worn off (if it hasn’t don’t worry, just take a few deep breaths, take a walk and come back when you’ve got your heart rate under control) the harsh reality creeps in that this doesn’t look exactly like your basic file browser. Image is a bit big and the text is underneath it the icon.

Easy enough to fix:

  1. Select the TreeView
  2. There are at least three ways to navigate to the Edit Current Template menu but I find the fastest is clicking on the TreeView breadcrumb underneath the MainPage.xaml tab (illustrated below)
    image

At this point you have a very simple template to work with, a basic StackPanel containing an Image and TextBlock

image

Go ahead and tweak the template into something a little more like what you’d expect from a file browser:

  1. Change the orientation of the StackPanel to Horizontal
  2. Change the Width and Height of the Image to 16 x 16
  3. Change the VerticalAlignment of the TextBlock to Center

Now we have something much more useful:

image

(I changed my sample data generation on the string to only create one word with a maximum of 12 characters)

Where Are Those Connecting Lines?

I know what you’re thinking, I brought you all this way, are we ever going to get to the connecting lines part? Well, the grand revel is here!

  1. Add a reference to System.Windows.Controls.Toolkit (if you went with the default install it should be in C:Program FilesMicrosoft SDKsSilverlightv3.0ToolkitJul09Bin)
  2. Download TreeViewConnectingLines.xaml and add it to your project
  3. Switch to the Resources panel and expand TreeViewConnectingLines.xaml, it’ll look like this:
    image
  4. There is a style for both the TreeView itself and the TreeViewItems that it contains.
  5. Drag ConnectingLinesTreeView onto the TreeView and when prompted select “Select property on “[TreeView]” Style
    image
  6. Switch to the Properties panel for the TreeView
  7. Scroll down to ItemContainerStyle (in Miscellaneous section)
  8. Click the Advanced property button to the right of the property (circled below)
    image
  9. Select Local Resource –> ConnectingLinesTreeViewItem

And there you go! You now have connecting lines, with a plus/plus icon showing expansion state. It even shows inside of Blend so you see exactly what you get but it’s more fun to run it and see it in all its connecting line glory!

image

Source

UPDATE: I’ve been asked in the comments to provide the source so without further ado get it here:

Connecting Lines Source

Epilogue

To be honest I could have just started with adding the connecting lines and you’d be on your way but I really wanted to show off sample data for TreeView, converting that sample data into a hierarchy and editing the HierarchicalDataTemplate in Blend 3.

Trying Out Oxite

Been quite on my blog lately and of all reasons it was because I just wasn’t happy with my old theme.  Lame I know yet if I’m not excited about how it looks then I’m not really compelled to write.  So I went searching for a cool theme for my old blog engine BlogEngine.NET and while a few grabbed me they all had some pretty basic flaws.  I believe using bulleted lists, quotes, proper headings, etc. help in the digestion of information and if the formatting for those items are off then a simple post can look like a train wreck, at least to my eyes.

Long story short I keep bumping up against the Oxite “theme” and decided the best way to get that theme was to switch to Oxite as my engine.  I’ve been super busy lately with all sorts of ninja projects and so every time I hit a roadblock in installing Oxite on GoDaddy I’d stop and move onto real work.

Well, today I finally got it all working and I can start flooding my blog with new posts once again.  The irony being of course that most people just use a feed reader (FeedDemon being my favorite) to read blog entries so all of that deep theme searching was probably in vain.

I want to note that nothing is wrong with BlogEngine.NET and if I had spent as much time fixing the CSS of the themes I liked as I did installing Oxite then I’d still be using it.  I’m also addicted to updates and while BlogEngine.NET development hasn’t exactly stalled things over there seem a bit stale.  For example the official release is 1.5 yet the home page still calls it a RC.

Your Inner Remembrance One

Part of my personal daily rounds is catching up on all the gaming news which means hitting up Engadget and Joystiq.  I was reading a recent tidbit about how new XBox 360’s are starting to show up with both the Jasper motherboard and 512MB of internal memory, something some of you may or may not be as excited about as I am.

The part that really caught my eye though was when I did a Bing search for “xbox jasper”, in an effort to catch up on my XBox motherboard goodness, and stumbled across the exact same Engadget article on another site with some slightly different phrasing.  This isn’t surprising in itself since it’s a pretty common ad trap to scrap content from a popular website and surround it with ads hoping people will click on them but the fun part was this site tried to make the content more unique by running it through a thesaurus.  Most of it ended up sounding like a drunk pedantic linguistics professor muttering to himself but here is the choice bit that had me rolling on the floor (ok, chuckling softly to myself like a crazed madman but you get the idea):

Original:

That’s twice the size of the old one, giving the equivalent of a 512MB internal memory unit.

New And Improved!

That’s two times the bigness of the rich person, giving the tantamount of a 512MB inner remembrance one.

MIX ‘09 & The Silverlight Toolkit March 2009 Release

It has been an action packed last week, a lot getting announced, released and talked about. What happened?

MIX ‘09

MIX09 was awesome, first because it was the first one I’ve ever been able to attend and second because of all the great announcements and energy of the people. I met great people, had amazing conversations and the energy was so high that I didn’t even notice that I lived off of Red Bull and a couple of hours a sleep a night.

No, the Adobe guy and I didn’t fight as people kept asking me :). We had a great conversation though I do forget his name (drop me a line if you read this cool Adobe guy). That’s in fact one of the reasons I love MIX, it’s bringing together different people inside the industry all focused on making rich interactive experiences for the web denizens. It’s saying here are all these cool tools and technologies but instead of focusing on whether a site is Rails or ASP.NET MVC lets talk about how to give users something useful.

I was asked a great question by my sound guy (thanks for making me sound good!) after my talk:

“As a consumer, as someone that uses the web, why should I care about Silverlight?”

A lot of reasons went through my head and I tried to imagine what a good marketing peep would say but perhaps due to the lack of sleep I instead spoke the first thing that came to my mind which is that “You shouldn’t care about Silverlight, you should care about the great applications these people are creating with it.” That really goes for any technology, at the end of the day people don’t care about Flash or Silverlight or whether your site is 100,000 lines of spaghetti code being spit out by CGI scripts, they just want it to work easily without getting in their way while providing a rockstar experience.

I talked with people from all over the industry, from companies that are often our competition but at the end of the day we all want to provide a killer experience for the people that just want to watch a little bit of March Madness online :) See what I did there, I just made someone in marketing happy but I’m also highlighting that the web is about providing an experience, not what technology is used. You can watch March Madness in SD using the Flash player or in HD with Silverlight. By the way if you haven’t watched a game in HD in your browser I encourage you to do so, it’s awesome. I don’t even really like basketball but I find myself watching it amazed at the quality that’s being live streamed.

Silverlight Toolkit March 2009

To coincide with MIX we released a new version of the toolkit, officially known as the Silverlight Toolkit March 2009 release. As a team that focuses on bringing new controls to everyone this release initially felt ‘light’, because with every release we want to bring as many controls as possible and to fix every bug under the sun but as I was preparing for my MIX talk we realized there is a ton of stuff in this release. It was a true forest for the trees moment. You can find all the goods in the official release notes but here are just a few highlights:

  • New Controls: Accordion, DomainUpDown, TimeUpDown, TimePicker, LayoutTransformer, TransitioningContentControl, AreaSeries (for charting). Check out the DomainUpDown sample showcasing Jesse Liberties tutorial videos. Pure hotness.
  • Silverlight 3 Beta Controls: DataPager, ChildWindow, Frame/Page, DataForm, Validation controls (ErrorSummary, FieldLabel, DescriptionViewer) and DataGrid enhancements.
  • Bug fixes as always.
  • VB.NET versions of all the samples! The community spoke and we listened so now we have full VB.NET samples.
  • A real installer that puts the controls right into the Visual Studio and Blend toolbox. The less monkey work you have to do to get off the ground with the controls the better.
  • New source! Now the full source for Calendar, DatePicker, GridSplitter and TabControl are in the toolkit. No more needing crack those open using Reflector, you can go straight to the source, comments and all.

High-Speed RIA Development Talk

If you were at my talk at MIX and had a question I left you hanging with ask it in the comments or forums, we’ll get your questions answered. Also any feedback you want to give would be great. I have a thick skin, I can take it :) I want to make sure that my next talks address your needs better and also to help shape future blog posts about what things you may want to hear about and see.

My MIX Talk Online

Update: If you want to tease, scoff or hear about what’s new in the Silverlight Toolkit you can watch my session online. If you want to learn more about sharing skills and code between Silverlight & WPF check out my team mates Jeff Wilcox’s talk.

MVP Summit Talk: Silverlight Toolkit: Past, Present & Future

Today I’m giving a talk at Microsoft’s 2009 MVP Global Summit here on campus. The title of the talk is “Silverlight Toolkit: Past, Present & Future” and I’ll be talking a little bit about where the Silverlight Toolkit came from, what’s going on with it right now and what we’re planning in future versions. Pretty self-explanatory actually :) I’m done a few dry-runs and once it came out at 30 minutes, the next at an hour and 15 minutes so I’m hoping I’ll find a nice average and nail the 45 minute window I have.

We’ve done a lot with the toolkit in a very short time and we’re not done yet. There are some really great things shipping in the MIX09 time-frame and I’m lucky enough to get to speak about them at MIX09 as well.

For anyone coming to my talk today I look forward to sharing our plans with you and if you were there feel free to drop me a line with any follow up questions.