Synergist

Making a Great Snapped View for your Web Site on IE10 on Windows 8

Synergist — Tue, 24 Apr 2012 03:11:15 GMT

One of the great features of Windows 8 Metro Applications is the Snapped View where app developers create a 320px wide view of their app. When the user snaps their app to the left or the right of the screen they can continue using their primary app while still having the secondary app visible in a thinner view. The project templates in Visual Studio come with this capability built-in to make it easier to address this important part of the application experience. If you build your Metro application with HTML, you see that this is done with CSS Media Queries, a feature supported in all HTML5 modern browsers. This is also the way that you support snapped view for your website, with the @-ms-viewport rule (since it’s Microsoft-specific today, it has the –ms- prefix and can be safely ignored by other browsers.

@media screen and (max-width: 400px) {
  @-ms-viewport { width: 320px; }
  /* CSS for 320px width snapped view goes here */
}

Since Mobile browsers like Windows Phone’s IE and the iPhone both report their width as 320 px, you may be able to reuse the media queries that you created for mobile for the snapped view by adding one line of css to your style sheet. If you are intrigued by CSS Media Queries, and want to see more examples of responsive design that use them, take a look at the Media Queries site which hosts a great collection of them.

You can also take a look at a site that I’ve been working on that uses media queries and implements the snapped mode media query at TimeLapseApp.com.

More details

My Favorite New Features of Windows Phone 7 Mango

Synergist — Sat, 01 Oct 2011 07:28:57 GMT

A few days ago I got a notice over my phone that an update was ready to be installed and I should connect it to my computer. Mango had arrived for my Dell Venue Pro on T-Mobile’s network. I connected my phone to my computer and proceeded to update the phone. A few minutes later it was ready. Now after using it for a few days, I am really happy with so many of the new features. I’d like to share my favorites with you:

Turn-by-turn audible directions on Bing maps
Podcasts are now in the Marketplace and you can now subscribe to them
Visual Voice Mail – I had to enable/disable/enable this on the T-Mobile account website but finally it is working
Quick App Switching/Multitasking
Easy check-in to locations
Integrated Messenger/SMS/Facebook Chat
Twitter & LinkedIn integration
Ability to open and Share Office documents on SkyDrive
Pinning a playlist to my home screen
Pinning an Outlook folder to my home screen
Groups in the People hub (and pinning groups)
Auto-Fix for photos
Upload videos from the phone to Facebook
New HTML5 IE9

What are your favorite Windows Phone 7 Mango features?

Teaching Computer Programming at Home

Synergist — Mon, 27 Jun 2011 16:16:27 GMT

This past week I had a great time teaching my 9-year-old son Alex and 9 of his friends computer programming in my home. I used Kodu Game Lab and Small Basic, two free tools created for kids to learn programming. I wrote a series of blog posts about it on my personal site Charette.com:

Has anyone else had an experience teaching programming at home? Please share it.

I’m About to Start Teaching Ten 9-Year Olds Computer Programming

Synergist — Fri, 17 Jun 2011 17:00:55 GMT

Next week, the Fairfax Computer Camp will open in my home. As I work from home, I have a bit of flexibility in scheduling my working hours, so I’m attempting an exciting new challenge – how to teach my son Alex computer programming in a fun environment with 9 of his friends. Take a look here – I plan on writing about the experience on my website Charette.com.

Wish me luck.

Converting SVG to XAML with IE9 and the Microsoft XPS Document Writer

Synergist — Wed, 20 Apr 2011 16:56:00 GMT

There is a growing library of content on the internet in SVG, especially with sites like The Noun Project. With a Windows Phone project that I am working on I wanted to use a graphic from the Noun Project. To do this I needed to convert the SVG file to XAML in order to put the graphic into a Silverlight application on the phone as XAML Paths. Here is how I did it:

I downloaded a SVG file to my computer from the Noun Project
I double-clicked on the SVG file and it opened up in Internet Explorer 9
On the Command bar I clicked on the Print Icon…Page Setup and set all the headers and footers to –Empty-
I printed the page using the Microsoft XPS Document Writer and saved the file to my desktop.
I changed the filename of the file created by the XPS Document Writer from .XSP to .zip and opened the zip archive
I opened the file Documents\1\Pages\1.fpage from the zip archive in Notepad – this is XAML text
I copied everything inside the <FixedPage> which included <Canvas/> and <Path/> elements to my clipboard
I created a new Canvas element in Expression Blend and pasted the contents of the clipboard into it.

Note: this might not work for all SVG graphics, especially those with more complex combined paths.

Silverlight UI Developer Job at Check Six Training Systems

Synergist — Tue, 19 Apr 2011 14:55:58 GMT

Immediate Opening with one of the fasting growing U.S. companies. What? You haven't heard of Check Six Training Systems? Oh, you will! Even sooner if you are the right fit for our totally unique, rapidly growing company. Our roots come from aviation, but we are taking aviation training solutions and applying them to other high performance industries. After the BP offshore disaster, the Oil and Gas companies are struggling with a complex training problem and they know that we have the solution. Our clients, which include Chevron, Shell, Exxon Mobil, etc. are begging for our Human Performance systems now, but we need your help.....

We have an immediate need for the best Silverlight / UI Developer and Web Graphics Developer in the Dallas/Fort Worth area. If you feel that you've got "The Right Stuff", but you are not from here, we're still interested since a lot of us work virtually. You’ll be instrumental in the design and development of our Human Performance application's look and feel to make it intuitive, simple and "loveable". Best of all, your software will save time, money, and LIVES in high performance industries that drive world economies. If you are ready to make a difference in addition to embarking on a fantastic career, we are your company.

Silverlight / UI Developer Job Posting

Generous salary and options depending on your contribution. Substantial bonus opportunity.
Qualifications:
Everybody seems to equate "years" to experience. If you can work in an agile startup atmosphere and can turn a complex data set into an elegantly simple, yet stable interface, your "years" don't matter to us!

Mandatory:
Experience designing and implementing web-based user interfaces.

UI portfolio available including Microsoft Silverlight examples.

Candidates must have current work authorization in the US. We will not sponsor visa candidates.

Desired:

Experience building web services and integrating with Microsoft SQL Server 2005 or 2008

Experience designing and implementing middle tier business logic in C#

Strong familiarity with web graphic formats and tools

Experience delivering commercialized software

Please send your resume and/or portfolio to korn@c6ts.com.

Why I Chose the Dell Venue Pro

Synergist — Fri, 14 Jan 2011 23:33:16 GMT

After more than a month of waiting, I am the proud owner of a new Dell Venue Pro Windows Phone. As a Microsoft employee I had my choice on phones and carriers and I wanted to share the reasoning behind my choice.

The T-Mobile network has great coverage in my area and where I travel. Like all carriers today, T-Mobile has an interactive coverage map where I was able to see the quality of coverage in the areas that I care about. When people ask me about which mobile carrier they should go with, this is the primary determining factor, I always ask them about the carrier quality in the areas that they care about. If you can’t make call’s it’s not a phone.
Numerous colleagues have told me that T-Mobile had great customer service.
After using virtual keyboards on a phones for over a year, I am still horribly inaccurate. I wanted a phone with a real keyboard that didn’t force me to reorient what I was doing. The Dell Venue Pro has a great slide-out keyboard and when collapsed, the phone is barely bigger than my former phone, the HTC Imagio.
The 4.1 inch AMOLED screen is very large and bright making the the graphics beautiful and the text crisp. Because the screen uses Corning’s scratch-resistant Gorilla® Glass, I can be confident that the phone will withstand the travel pressures that I put on it. The new Surface computer demonstrated at CES earlier this month also used Gorilla Glass.
The phone has a solid feel and a professional look. I’m done with flimsy-feeling plastic phones.

Great job Dell, T-Mobile, and Windows Phone!

C# Silverlight Developer Jobs at Inviso in Bellevue, WA

Synergist — Tue, 04 Jan 2011 17:22:20 GMT

Subscribe to this Silverlight Jobs Feed.

Inviso builds world class software solutions specializing in business intelligence, web applications, and service oriented solutions. Inviso works with a steady stream of new Microsoft technologies and prides itself on exceptional service.

Inviso is looking for a C# Silverlight Developer to contract for a short-term project. The candidate can be junior, intermediate or senior in level and the ideal candidate will possess excellent visual and user interface design skills. The candidate is expected to work with Silverlight, WPF, and XAML to develop a world class line-of-business application. Preference will be given to candidates who submit code samples. Communication and team skills are at the top of our list. A Computer Science, related degree or equivalent experience is a must. Good patterns and object-oriented design skills are a must for the senior role. Depending on the individual’s performance and needs of the business, the role might mature into a longer term opportunity.

You will be expected to either know, or be on the path to knowing the ins and outs of Expression Blend, XAML, Silverlight and WPF.

You will be involved in the full software development life cycle, including design, development, and maintenance.

Responsibilities include:

· Working closely with a Project Manager and Analyst to understand the business problem

· Contributing to functional specifications and design conversations

· Working with a Solution Architect to get guidance on design patterns required as part of solution

· Writing and rewriting code so that it not only solves the problem but is clear and maintainable

· Accommodate client requests that may drift through the duration of the project

· Understand and negotiate tradeoffs between competing implementations of components or algorithms

· Work closely with designer to enable design-driven development

· Work closely with designer to integrate XAML styles and custom controls

Job Requirements for Senior C# Silverlight Developer

· Computer Science, related degree or equivalent experience is a must

· Minimum of 5-8 years of experience in industry.

· Industrial caliber object-oriented design skills

· Practice and understanding of design patterns

· Solid team and communication skills

· Solid technical communication skills: wireframes, ERDs, UML diagrams

· Experience with enterprise patterns and architectures

· Command of C#, Silverlight, XAML, XML, WFC, WPF, WF, SQL Server, LINQ

Job Requirements for Junior C# Silverlight Developer

· Computer Science, related degree or equivalent experience is a must

· Minimum of 2-4 years of experience in industry.

· Background in object-oriented design

· Introduced to design patterns

· Solid team and communication skills

· C#, XML, SQL Server, exposure to Silverlight, XAML, or WPF and LINQ

If you are interested in this position, please email us your resume to apply@invisocorp.com. Reference SilverLightJobs.

Subscribe to this Silverlight Jobs Feed.

Updated SMF Thumbnail Scrubbing Sample Code

Synergist — Tue, 28 Dec 2010 18:59:32 GMT

I just posted an update to the code I wrote almost a year ago for showing thumbnail images of a video while scrubbing (moving the play slider) in Silverlight. This is similar to the experience that you get when scrubbing on Netflix Watch Instantly with Silverlight. Here is what I’ve done:

I updated the code for Silverlight 4.
I updated the code for the Silverlight Media Framework 2.2 release by making the code a plug-in. This makes it very easy to integrate the code – all you have to do is add the ThumbnailScrubbing.dll assembly to your project and the SMF Framework takes care of it with the Managed Extensibility Framework (MEF).
I added a GenerateThumbnails command line tool that uses the Expression Encoder 4 object model to generate the necessary thumbnail images.
The Thumbnails control is now a custom control that can be styled or skinned.

You can download the code here or try out a demo that uses it at http://xmldocs.net/smf/

A Free Webcam Photo Application in Silverlight

Synergist — Wed, 15 Dec 2010 18:37:24 GMT

My wife Liz has a Dell Studio laptop with an integrated webcam. The computer originally came with Windows Vista and I upgraded it to Windows 7 when it came out. The upgrade went well, although one of the applications that came with the laptop, the webcam capture app, was not updated for Windows 7. She asked how to use the webcam and after a look at the Dell website, her computer and various free downloadable apps, I could not find an appropriate application for her specific use.

Knowing that Silverlight supports webcams for photos and video, I decided to build a quick Silverlight 4 Out-of-Browser application that would enable her webcam to take photos and save them to her system. In about an hour I was able to create this application to capture webcam photos and save them as JPEG files.

Try it at http://xmldocs.net/webcam and tell me what you think.

Silverlight Designer/Developer Job in Orange County, CA

Synergist — Wed, 17 Nov 2010 18:59:37 GMT

This person will be the pivotal person in the development and design of the "new" GUI. The current environment is PowerBuilder and they are asking this person to be the go to person for the new web based application.
They require a strong coder in .NET, C# and MUST have strong Silverlight GUI design experience. The task at hand is to design the web bases applications but in such a manner they are not totally "foreign" to the current users base. The new application will include newer functionality and will be designed with ease of use in mind.
This will be 100% development and design work, so we need a strong person with great communication skills.
Support will be provided from the other development team in China, but it is imperative to have a strong person in-house to handle more company sensitive functions and application.
Minimum of 7 year’s experience within web applications and at least 2 years Silverlight, and have experience in a Financial app environment.

Submit your resume to rosborne05@gmail.com.

Subscribe to the Silverlight Jobs Feed.

Silverlight Engineer/Architect Jobs at Netflix

Synergist — Wed, 17 Nov 2010 17:44:47 GMT

I have just heard that Netflix has two job openings for Silverlight Architect/Engineers in Los Gatos, California. As a Netflix subscriber, I use the Silverlight-based Watch Instantly feature on my computer and on my Windows Phone 7 device. What I’ve really liked is the ability to pick up watching a movie on the phone where I left off on the computer.

Netflix has been very active in our San Francisco Silverlight User Group. You should come to the next meeting on December 9 at the Microsoft office in San Francisco.

Subscribe to this Silverlight Jobs feed.

Dotfuscator for Windows Phone Released

Synergist — Tue, 02 Nov 2010 21:14:15 GMT

One of the great partners that I have worked with on the Microsoft Silverlight Analytics Framework (MSAF) has been PreEmptive Solutions. For Windows Phone 7, Microsoft is partnering with PreEmptive to provide application reporting for phone application with their Runtime Intelligence for Windows Phone. Because of the overlap in functionality between the Runtime Intelligence for Windows Phone and the Analytics Framework, I’ve put together this short list to help you differentiate the two:

You can use Runtime Intelligence for Windows Phone alone, with the MSAF, or use the MSAF without Runtime Intelligence for Windows Phone.
Both allow you to track application events, including user interaction events.
You would use the MSAF where you want use analytics services that you are already using for your website like AT Internet, Webtrends, or Google Analytics.
The MSAF has been optimized for media scenarios using the Silverlight Media Framework and IIS Smooth Streaming Client.
The MSAF has an interface optimized for designers using Expression Blend to add tracking to the user interface that they created. The MSAF has specific handlers and trackers that are specialized for the Silverlight controls on Windows Phone whereas Runtime Intelligence for WP works on a general event model.
Runtime Intelligence for Windows Phone has some capabilities that are out of scope for the MSAF. · Specifically, the MSAF does not
1. Integrate with the XNA framework
2. Inject opt-in/opt-out switches and extensible dialogues
3. Capture unhandled and handled exceptions (NOTE: this is not yet supported by Runtime Intelligence for WP7 either, but I am told this is coming before the end of the year)
If you want to track analytics to your own service endpoint instead of a third party, you can either
1. Extend the MSAF framework to your own tracking behavior
2. Create a network endpoint that supports the ServiceOrientedAnalytics behavior protocol.
3. Runtime Intelligence for Windows Phone also allows you to specify your own endpoint and it transmits SOAP signals – with our without SSL encryption.

PreEmptive Solutions has been among the earliest supporters of the MSAF and supports it today. While they have not committed to a date for WP7 MSAF support, they have confirmed that it is on their roadmap. At that point, the integration options will become even more seamless.

Adding Windows Phone Capability Detection to your Build Process

Synergist — Sun, 31 Oct 2010 00:08:36 GMT

There is a new Capability Detection tool in the Windows Phone Developer Tools October update that you can run to determine the capabilities of a DLL or Xap files. Here is a post build step that I added to a WP7 project to list the capabilities that are explicitly needed for an application:

set CAPDETECT=%ProgramFiles(x86)%\Microsoft SDKs\Windows Phone\v7.0\Tools\CapDetect\
pushd %CAPDETECT%
@echo Detecting Capabilities of "$(ProjectDir)$(ConfigurationName)"
CapabilityDetection.exe Rules.xml "$(ProjectDir)Bin\$(ConfigurationName)"
popd

If you don’t accurately list your application capabilities in your application manifest, your application will get rejected when submitted.

Windows Phone 7 at the Sprint Developer Conference

Synergist — Mon, 25 Oct 2010 17:57:42 GMT

Tomorrow, October 26, 2010, I will be at the Sprint Developer Conference in Santa Clara, California, where I will be giving a talk about Windows Phone 7 and running a coding session on developing Silverlight applications for Windows Phone 7. We are very excited to be partnering with Sprint to deliver some great Windows Phone Experiences. You should also come to the Microsoft Windows Phone 7 booth at the conference to learn more about the platform capabilities and opportunities:

1:45-2:45 PM	Microsoft Windows Phone 7 Overview
7:30-9:30 PM	Building Great Applications with Windows Phone 7 Developer and Designer Tools

Download Progress Bar for Silverlight Media Framework Player

Synergist — Sun, 24 Oct 2010 06:04:54 GMT

One of my customers has been using the Microsoft Silverlight Media Framework player for their Business-to-Business media sharing portal and wanted to add a download progress bar behind the scrub bar. I was able to show them how to do this with a combination of template binding, re-templating the SMFPlayer and Timeline classes and subclassing the Timeline class.

Since the Timeline bar is a custom control embedded in the SMFPlayer custom control, you need to modify the control template of both the SMFPlayer control and the Timeline control.
I created a new class DownloadProgressTimeline derived from Timeline so that I could add a DownloadProgress Dependency Property and a new default control template.
I used template binding to connect the SMFPlayer.DownloadProgress property to the DownloadProgressTimeline.DownloadProgress
I used template binding to connect the SMFPlayer.Foreground color to the color of the download progress
I bound the DownloadProgress value (0.0-1.0) to the Scale Transform of the progress bar rectangle

The Download Progress bar in the DownloadProgressTimeline control template

Notice how the X scale of the rectangle is bound to the download progress (both are values from 0-1).

<Rectangle x:Name="DownloadProgressBar" Grid.ColumnSpan="3" 
    Fill="{TemplateBinding Foreground}" Margin="0,6" 
    Stroke="{TemplateBinding BorderBrush}" Opacity="0.5" 
    RenderTransformOrigin="0,0" IsHitTestVisible="False">
    <Rectangle.RenderTransform>
        <CompositeTransform 
            ScaleX="{Binding DownloadProgress, RelativeSource={RelativeSource TemplatedParent}}"/>
    </Rectangle.RenderTransform>
</Rectangle>

The DownloadProgressTimeline in the SMFPlayer control template

This replaced the Timeline control:

<dp:DownloadProgressTimeline x:Name="TimelineElement" 
    Cursor="Hand" Chapters="{TemplateBinding Chapters}" 
    EndPosition="{TemplateBinding EndPosition}" 
    HorizontalContentAlignment="Stretch" 
    IsLive="{TemplateBinding IsMediaLive}" 
    LivePosition="{TemplateBinding LivePosition}" Margin="0" 
    StartPosition="{TemplateBinding StartPosition}" 
    TimelineMarkers="{TemplateBinding TimelineMarkers}" 
    VerticalAlignment="Center" 
    DownloadProgress="{Binding DownloadProgress, RelativeSource={RelativeSource TemplatedParent}}"
    Foreground="{TemplateBinding Foreground}"/>

You can download the source code of a sample application here.

Microsoft Silverlight Analytics Framework 1.4.7 Released

Synergist — Mon, 11 Oct 2010 15:10:03 GMT

This weekend, in preparation for today’s Windows Phone 7 launch, we released, the Microsoft Silverlight Analytics Framework 1.4.7. We fixed a few bugs and added tracking for the Microsoft Silverlight Media Framework 2.2 now available for both Silverlight and Windows Phone 7.

Thank you to the community of partners, developers, and designers who are using the framework and giving great feedback.

If there is anything that you would like to see added or improved in the framework, please post it or vote for it in the Issue Tracker.
I have started a page which will list customers who are using the framework. If you would like to add your company or site to this list, please contact me.
Download, install, and start using the framework today – it’s easy to use, free, open source, extensible, and works with the analytics services that you are using today.

San Francisco Silverlight User Group 10/14 Meeting: Windows Phone 7 Design & Development

Synergist — Tue, 05 Oct 2010 23:20:17 GMT

What	San Francisco Silverlight User Group Meeting
When	Thursday 10/14/2010 7:00 PM
Where	Golden Gate North Conference Room Microsoft Corporation 835 Market Street Suite 700 San Francisco, CA 94930
Who	Navin Prasad, Netflix: Designing for Windows Phone 7 Mat Trunnell, Netflix: Tips for Successfully Developing on Windows Phone 7
Why	You want to learn more about Silverlight and Windows Phone development and meet others who are doing do.
How	Please register here so we know that you’re coming.

Adding A Dynamic JumpList to My Site’s Pinned Application in IE9

Synergist — Wed, 22 Sep 2010 23:46:00 GMT

Earlier this week, I explained how you could easily add an Internet Explorer 9 pinned site mode to your website so that your site behaves like a first-class application when running on Windows Vista or Windows 7. I also explained how you might use a Google Analytics service to track when the your site is launched from a pinned icon. Now I’m going to show you how to add dynamic content to a JumpList that shows up in the site mode icon. For my site, which contains a personal blog using Graffiti CMS, I can write some template code that will be used in each page. Graffiti CMS has its own simple template code which lets me iterate through each post on the page and for each post, I add a JumpList item. I use the $post.Title, $post.Url for each item and call the window.external.MsSiteModeAddJumpListItem() method for each item. Also note how I used try/catch and checked for the site mode feature using if (window.external.msIsSiteMode). See the full code template below the image to see what I wrote – if use something other than Graffiti CMS like Wordpress, then they syntax would obviously be slightly different for iterating through each of the blog posts.

You can see the end result on http://charette.com once you pin the site – by dragging the Charette.com tab from the IE9 beta to the task bar in Windows Vista or Windows 7. To read more about IE9 pinning and what else you can do now with Internet Explorer 9, go to the Internet Explorer Developer Center on MSDN.

    <script language="javascript">

    function AddJumpList()
    {
        try
        {
                if (window.external.msIsSiteMode())
                {
                    window.external.msSiteModeCreateJumplist("Posts");
  
                    #foreach($post in $posts)
                    window.external.msSiteModeAddJumpListItem("$post.Title", 
                         “http://charette.com$post.Url?utm_source=windows&utm_medium=sitemode&utm_campaign=IE9”, 
                         "http://charette.com/favicon.ico");

                    #end

                    window.external.msSiteModeShowJumplist();
                }
        }
        catch (error)
        {
        }
    }

    AddJumpList();

    </script>

Job Opening: UX Integration Developer at Turner in Atlanta, GA

Synergist — Tue, 21 Sep 2010 03:22:01 GMT

Position:

UX Integration Developer

Overview:

The successful candidate will work closely with the interaction design team to implement their vision of the user interface in our applications, and will engage in prototyping exercises to test the workflow and user experience, making adjustments to the UI according to user feedback. He or she will work with the visual design team to insure that the look and feel is consistent and work closely with the development team to apply the styles to production-level code.

Responsibilities:

Strong empathy for users and a passion for good user experiences
Ability to take designs from Adobe Illustrator or Sketchflow and convert them to XAML
Good communication between development and UX team
Ability to produce prototypes in Sketchflow
Review the overall product and help break up the code to facilitate efficient designer/developer interaction, as well as facilitate easier updates to UI
Contribute to design, development & architecture of a highly robust UI framework
Deliver next generation user experiences on Web, Desktop, and other applications
Help design and develop complex but easy-to-use user interface interactivity (this includes reusable and complex visual components)
Work with UI patterns such as MVVM

Requirements:

5+ years of direct experience developing Rich Internet Experiences or equivalent
BS in Computer Science or equivalent experience
Blend, XAML, ability to read & understand C# experience consuming/binding data from WCF or other web services (JSON, RESTful services, ActionScript, et al.)
Experience working with Agile teams

Solid understanding of design and UX principles

Contact me if you are interested and I’ll make the introduction.

Tracking IE9 Site Mode Launches with Google Analytics

Synergist — Mon, 20 Sep 2010 19:50:31 GMT

So you’ve taken the five minutes to add an Internet Explorer 9 Site Mode for your website so that it has a great Windows experience (see blog post here). Now you want to track if your visitors are pinning your site – this would be a major indication of affinity for your site and and visitor engagement. One easy way to do this is by adding query parameters to the meta tags that specify the startup URL and the tasks. If you are using Google Analytics, you can use their URL Builder tool to generate the URL query paramters that you just put into the meta tags. Other web analytics services also track query parameters so you can do a similar process for them as well.

You could also specify a completely different base URL and have that go to its own landing page. See the end result here on my personal site, Charette.com:

Launch the website http://charette.com in Internet Explorer 9 Beta
Drag the “The Charette Project” tab to your Windows Vista or Windows 7 task bar
The site is now pinned to your task bar

Updating My Personal Site, Charette.com to have a Site Mode in IE9

Synergist — Mon, 20 Sep 2010 19:23:19 GMT

Now that the beta of Internet Explorer 9 is out (you can download it from here), there are new opportunities to make your website act like an application in Windows. One of the easy things that you can do is to create site mode when your users pin your site to the Windows Taskbar. You can do this with a few meta tags and links in your HTML page headers.

On my personal website, Charette.com, I use Graffiti CMS to manage my blog posts and content, so changing the content of the head on every page is simple. I used Visual Studio to create an icon with larger, high-resolution icon images. The source image that I used was a sharpie sketch of my dog Charm that I did years ago. For Graffiti, you should replace your static favicon.ico as well as the favicon.ico file in the \__utility\img folder – see here for the tip. Here is what I added to my site page template in the Graffiti Admin/Site Options/Settings/Header field:

<meta name="application-name" content="The Charette Project" />
<link rel="shortcut icon" type="image/ico" href="http://charette.com/favicon.ico"/>
<meta name="msapplication-tooltip" content="Michael Scherotter's Digital Playground" />
<meta name="msapplication-starturl" content="http://charette.com" />
<meta name="msapplication-navbutton-color" content="Orange" />
<meta name="msapplication-task" 
    content="name=Forums;action-uri=http://charette.com/phpbb;icon-uri=http://charette.com/favicon.ico"/>
<meta name="msapplication-task" 
    content="name=Journalist;action-uri=http://charette.com/journalist;icon-uri=http://charette.com/favicon.ico"/>
<meta name="msapplication-task" 
    content="name=Artwork;action-uri=http://charette.com/artwork;icon-uri=http://charette.com/favicon.ico"/>
<meta name="msapplication-task" 
    content="name=Safari;action-uri=http://charette.com/safari;icon-uri=http://charette.com/favicon.ico"/>

The application-name meta tag specifies the name of the site as is shown in the jumplist, in this case “The Charette Project”
the shortcut icon is the icon with at least a 32x32 pixel image
the msapplication-tooltip meta tag is for when you create a shortcut to the site
The msapplcation-starturl meta tag is the start URL for the site mode (in this case it’s the same page but it could also contain additonal content (like a web analytics query arameter) or go to a different start page
The msapplication-navbutton-color meta tag is for specifying the navbutton colors when in site button
The msapplication-task meta tags specify specific navigation tasks (in this case they mirror some of the top navigation on my site

To read more about IE9 pinning and what else you can do now with Internet Explorer 9, go to the Internet Explorer Developer Center on MSDN

Tracking Ad Clicks with the Microsoft Silverlight Analytics Framework on the Windows Phone

Synergist — Thu, 16 Sep 2010 19:44:26 GMT

Along with the release of the Windows Phone Developer Tools and the Microsoft Silverlight Analytics Framework 1.46 today, Microsoft also released the Mobile Advertising SDK for Windows Phone. The SDK consists of a custom control AdControl that you add to your Silverlight application on the phone. Because the AdControl exposes an AdEngaged event whenever the user clicks on an ad, it is very easy to make the Analytics Framework work with the control. I plan on adding another assembly to the next build of the Analytics Framework to support this. Here is the code that is necessary for it if you don’t want to wait.

To use this code:

Add the AdControl to your application as described in the SDK
Add the HandleadControl.cs code to your project
Add a TrackAction behavior to the AdControl and select the AdEngaged event
Now the AdControl.AdUnitId will be tracked in the AnalyticsEvent.ActionValue

HandleAdControl.cs

namespace Microsoft.WebAnalytics.Advertising
{
    using System;
    using System.ComponentModel.Composition;
    using Microsoft.Advertising.Mobile.UI;
    using Microsoft.WebAnalytics;
    using Microsoft.WebAnalytics.Contracts;

    /// <summary>
    /// Track a Microsoft Advertising SDK for Windows Phone 7 AdControl.AdEngaged event
    /// </summary>
    /// <remarks>
    /// Platforms: Windows Phone 7
    /// </remarks>
    [Tracker(typeof(AdControl))]
    public class HandleAdControl : ITrackHandler
    {
        #region Properties
        /// <summary>
        /// Gets or sets the event Logging method
        /// </summary>
        [Import("Log")]
        public Action<AnalyticsEvent> Log { get; set; }
        #endregion

        #region ITrackAction Members

        /// <summary>
        /// Track the DatePicker ValueChanged event
        /// </summary>
        /// <param name="associatedObject">an AdControl object</param>
        /// <param name="analyticsEvent">the analytics event</param>
        /// <param name="eventArgs">the event arguments</param>
        public void Track(
            System.Windows.FrameworkElement associatedObject,
            AnalyticsEvent analyticsEvent,
            System.EventArgs eventArgs)
        {
            var adControl = associatedObject as AdControl;

            if (analyticsEvent.Name == "AdEngaged")
            {
                var args = eventArgs as EventArgs;

                analyticsEvent.ActionValue = adControl.AdUnitId;
            }

            this.Log(analyticsEvent);
        }

        #endregion
    }
}

Microsoft Silverlight Analytics Framework 1.4.6 Released

Synergist — Thu, 16 Sep 2010 17:27:04 GMT

We have just released on CodePlex the latest version of the Microsoft Silverlight Analytics Framework to support the final release of the Windows Phone Developer Tools. You can read the release notes here.

New Features for Windows Phone 7

Since the last release, we also added some more new Windows Phone features and we have started working with a number of companies who are creating Analytics-enabled Windows Phone Applications. Their early feedback helped us create a more robust framework for the phone (and fix a few bugs).

Tracking of the Panorama and Pivot controls that now come with the Windows Phone Developer Tools
Tracking of the DatePicker and TimePicker controls that come with the Windows Phone Toolkit
We are in the process of adding support for the new Mobile Ad control. Vote here if you want it added.

Web-Analysis.Net

We’ve added another Analytics Service partner for Silverlight 3, Silverlight 4, WPF, and Windows Phone, Web-Analysis.Net

BALL Watch Silverlight Contest Winners Announced

Synergist — Tue, 31 Aug 2010 04:27:00 GMT

The judging for the BALL Watch Silverlight Contest is now over and we are proud to announce the winners. Entrants had 59 days to recreate one of the watches from BALL Watch USA with Silverlight using Microsoft Expression Blend 4 (no images, or video allowed - only XAML vector graphics). Once the entries were submitted, we had a panel of judges rate the watches on visual accuracy, functional accuracy, and the innovative usage of Silverlight.

See this announcement of the winners.

Judges

Jeffrey Hess – President BALL Watch USA
Gary Girdvainis – Editor in Chief, International Watch
Bill Buxton – Principal Researcher at Microsoft Corp.

US Contest Winners

	Jesse Chu won the Grand Prize with his entry, the Ball Trieste Chronograph - he will win the BALL Engineer Hydrocarbon TMT Watch, retail value $3,399.
	Brian Mutschuler won the First Prize with his entry, the Ball Conductor Chronograph - he will win the BALL Fireman II Watch, retail value $999.

We also held a similar contest for Microsoft employees in the United States and we are proud to announce the winners of that contest:

Microsoft Employee Contest Winners

	Jonathan Steed won the Grand Prize with his entry, the BALL Trainmaster Moonlight Special LE - he will win the BALL Trainmaster TMT Watch, retail value $2,999.
	Joe Milan won the First Prize with his entry, the BALL Fireman Storm Chaser - he will win the BALL Fireman II Watch, retail value $999.

Thank you to everyone who participated in the contest. If you are interested in seeing the Silverlight 4 (and Windows Phone 7) custom control that these watches were based on, you can see my BALL Trainmaster Cannonball Watch and download the code here.