Those of us who work for corporations/companies/whatever (read: not self-employed) usually get an allotment of vacation (or ‘PTO’ – personal time off) each year.  Most companies have policies that put a cap on the amount of PTO you can carry over year after year.  Anything you don’t use, you lose.  You’d be an idiot to lose PTO (which is effectively paid days of work). 

I was an idiot last year.

At the end of the year I got the email from HR indicating that I was going to forfeit a lot of vacation if I didn’t use it.  The problem?  The math didn’t even work out that I could even use it.  It was forfeiture by idiocy for sure.  I left money on the table, but more importantly it led me to a realization that has been obvious to me, of course, for a long time.

I work too much.

I love my job.  I really do.  I enjoy going to work every day, I enjoy the people I work with, and I love the technology that I’m working with daily.  My work is also my hobby/passion.  This presents a problem for my non-work life and a conflict in what people call ‘work/life balance.’

Working from home

For the first 5 years working for Microsoft I was able to work from home.  This provided me the flexibility (an incredible flexibility I might add) of being there for my family when I needed as well as being able to succeed at work.  My commute was downstairs.  I ate lunch with my friends (yes, I realize work folks can be friends as well, but not always the case).  I was able to take/pickup my kids from school.  In the hot summer days I could go outside and jump in the pool.  Okay I rarely did that, but I could.  Reflecting on this time, I never really cared about vacation because I truly did have a decent work/life balance.  Yes, I still worked a lot, but felt I was “there” for my family.  They may disagree, of course.

Working in an office

3 years ago I moved to our corporate offices in Washington.  Aside from the other challenges of relocating a family, my fundamental work structure changed.  I don’t work from home.  I go into an office, mingle with co-workers, drown in meetings and lose track of time to realize that I’m not making it home for dinner at times.  Vacation has a different meaning and is more important…or should be.  Since I spend more time away from those niceties of seeing friends/family very frequently during the day, my perspective has certainly changed.

I spend more awake time in my office than I do in my home during the week.  Think about that.  If you work at a company, you likely do as well.  So why are us workaholics giving up so much time given to us in our vacation?

Philosophy conflicts with career growth

In reflecting on this work/life balance (or imbalance) I have, a co-worker pointed me to a blog post from Jon Gallant on this very topic.  It is a good read and resonated (too well) with me likely because he also works at Microsoft.  I shared this post with some other community-driven guys in the company and started some more thoughts.  One of which (and somewhat pointed out in Jon’s post) is that establishing a real work/life balance is in conflict with career growth, stack ranking systems, etc.  On this point I agree.  However, it all comes down to priorities.  If you want upward career growth you are sacrificing something.  If you want massive family time, you are likely sacrificing career growth.  A small discussion happened about how you can’t even be in the middle and have a job.  I don’t subscribe to that, but understand that every org/division/manager is different and that is something you have to manage against in your role at work.  One thing pointed out in Jon’s post is so true:

“At work you can be replaced in about 5 minutes, but you are effectively irreplaceable at home. Keep that in mind. I think about it every day.”

I shared some thoughts with Jon via email, thanking him for writing what was in my head for so long and we shared some more thoughts.  In the end, his final comments to me were something I don’t think anyone could argue with (note the ‘number’ refers to the stack ranking system), emphasis mine:

The [rank] [your company] gives you doesn’t mean anything.  No one is EVER going to bring it up in my house – except me. No one cares.  Especially my 2 year old.  I’ll get whatever rank I get this year...it doesn’t bother me because I know that the time I would have put in to always getting the absolute top rank I was at the playground with my kid or teaching him how to ask to be excused from the table.

It made me pause and realize how true that is.  I need to get better at this.  I need to stop saying “just wait one second” to my kids so much.  In fact, Jon got an email from a co-worker that I thought was funny as well…his co-worker *who was on vacation even* said:

“One of my directs was on the beach celebrating his kid’s birthday when he read it.  He put down his phone and went to play with his kid.”

Yep…been there.  Bottom line, there is NEVER a good time to take vacation.  I’ve used that excuse too much.  I need to stop.  My career may suffer.  My thirst for knowing everything around me may suffer.  My family and my own personal sanity will not suffer.  I hope that I can find that right balance as I continue to grow both as a parent/husband and a professional.  I’m not perfect, haven’t found it, but strive to achieve a true work/life balance.

Anyhow, I hope you read his post.  And I hope you are better and balance than I am currently.

In my working with Windows Store apps, I’ve become increasingly fond/aware of the advantages for app localization.  There are a lot of resources out there for you to localize your app using a good-better-best approach as well.  I’ve previously written about localizing a Windows Store app using some of these methods and what the WinRT platform supports to make this easier in most cases.

Now that you’ve localized your app, you may be faced with the question of how you might want to respond to language choice changes by the user.  Remember that the Windows Store app model is that it honors the user’s language choice preferences matching that with the available languages the app indicates it supports.  This may not always map to the user’s installed OS language.  For instance I can have an English OS install but prefer German in my apps and set my language preference to: de-DE, en-US.  If a Windows Store app was localized in German, then I would see that version instead of English because my preferences say so, regardless of my OS install.

Language switching problem

Now, I’m not as proficient in German as I’d like to be, so there may be times where I need to flip back to English to understand certain areas of an app.  I can do this easily by going to the languages panel and switching my order of preference:

But when I go back to my app, it is still in German…until I terminate/restart the app.  Let’s say I started the app and it honors my language preference:

Now I go and change back to English and click the button to take me to page 2.  It is still in German even though my language preference list is now: en-US; de-DE.

The XAML framework doesn’t automatically re-evaluate the resource cache in response to these changes.  This is something the developer has to manage and luckily there are some easy steps you can do to make this experience better for your users.

We should point out that this is likely a rare case that a user of your app is constantly switching languages and switching back to your app, but having your app support this is a delighter for your users when it does happen.

Solution: listening to qualifier updates

There are APIs to the rescue here!  When you switch your language preferences, the system actually is aware of it, however the context that your app already had at launched has been cached…and thus it will still be delivering the original context-aware resources.  Good for us is that the APIs can let us know when this happens and we can respond.

Since most apps have only a single Window object and since this change is likely rare, we should manage this call and not put it on every Page load, for example, but rather higher up in the App because it will likely be rare that it happens.  In our activation code path we can listen for the resource context to change

   1: protected override void OnLaunched(LaunchActivatedEventArgs args)

   2: {

   3:     ...

   4:     ResourceManager.Current.DefaultContext.QualifierValues.MapChanged += QualifierValues_MapChanged;

   5:     ...

   6: }

In this snippet we are using the default ResourceContext and listening for when its qualifier map changes.  The qualifier map is the set of context for resources like language, but also scale, phonetics (for Japanese), high contrast, etc.  Once that map changes we can force a refresh of the cache essentially:

   1: void QualifierValues_MapChanged(IObservableMap<string, string> sender, IMapChangedEventArgs<string> @event)

   2: {

   3:     ResourceManager.Current.DefaultContext.Reset();

   4: }

This simple flow basically says “hey, when a qualifier has changed, reset the context map so that I get the new data” and our app in subsequent calls to the resources will get the updated resources.

Here’s a video demonstrating the completed before/after approach.

There is a big caveat to this approach.  The change doesn’t automatically affect your current view.  So your page has rendered and is in German.  If I go and change it to English, then go back to my page…it isn’t automatically in English.  Subsequent view loads (and even going back to this page) will get the new resources, but already-rendered ones do not.  The developer can, of course, implement way more logic to refresh the view, traverse the tree, etc. to manage this, but that experience is up to the app developer to determine what is most appropriate for the app itself.

This is a little subtle but helpful tip in enabling your localized apps to be flexible to these types of changes by users when that happens.

Hope this helps!

As someone who uses a few iOS devices around the house, I’ve become fond of visiting sites and seeing a little banner that lets me know that a native app is available for the web app I’m using.  This concept was introduced in iOS 6 and called “Smart App Banners” in the developer documentation.  You may have seen them as well

I wanted to provide the same affordance for Windows Store apps and recalled there are already two ways to integrate the web app browsing experience with the native app in the Windows Store:

• Linking to your app
• Connect your web site to your Windows Store app
• High quality visuals for Pinned Sites in Windows 8

In iOS, this is implemented a bit natively in mobile Safari, not through any additional JavaScript files/functions.  As with any random idea I have, I always set out to search if it has been done before (often it already has).  I couldn’t find something like this specifically for Windows Store apps, however I did find an implementation for pre-iOS6 browsers as well as Android.  It was from Arnold Daniels and hosted on GitHub, so what’s a guy to do?  Fork it!

And that’s what I did: https://github.com/timheuer/jquery.smartbanner

With a few more conditional checks, if you put this in your web app/site now you’ll get it automatically linked to your Windows Store app if you have the correct meta tags.  For the implementation for Windows Store apps I’ve made some assumptions about the meta tags used.  The following would get you a good experience:

   1: <html>

   2:   <head>

   3:     <title>Hulu Plus</title>

   4:     <meta name="author" content="Hulu LLC"/>

   5:     <meta name="msApplication-ID" content="App" />

   6:     <meta name="msApplication-PackageFamilyName" content="HuluLLC.HuluPlus_fphbd361v8tya" />

   7:     <link rel="stylesheet" href="jquery.smartbanner.css" type="text/css" media="screen"/>

   8:     <meta name="msapplication-TileImage" content="http://wscont1.apps.microsoft.com/winstore/1x/c8ac8bab-d412-4981-8f31-2d163815afe4/Icon.6809.png" />

   9:   </head>

  10:   <body>

  11:         <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
   1:  
   2:         <script src="jquery.smartbanner.js">
   1: </script>
   2:         <script type="text/javascript">
   3:             $(function () { $.smartbanner() })
   4:         
</script>

  12:   </body>

  13: </html>

If you have the combination of linking your app using the msApplication-ID and msApplication-PackageFamilyName values and the pinned sites high fidelity msApplication-TileImage value to deliver the combined experience.  If you have all these, then the banner “just works” for you.

NOTE: Because the Microsoft documentation mixes msApplication and msapplication (note the casing on the “A”), you should use the capitalization (which is more consistent in the documentation) for ensuring it all works smoothly. 

Now some may use a different pinned site TileImage than that of what they may use for the app tile, however this can also be overridden in the options:

   1: $(function () { $.smartbanner({ icon:'http://some/url/to/tile/image.png' }) })

When done the web app/site would display a dismissable banner (using Hulu as an example here) on a machine running Windows 8:

So adding one reference, 2 files and an initialization and you’ll help give your app a bit more promotional flare for those viewing in browsers other than the ‘modern’ IE view.  As you can see the screenshot above is from the desktop version which doesn’t take advantage of the other msApplication-** attribute usage in desktop mode.  The one thing it doesn’t do that the iOS system-level banner does is detect if the app is installed and change “view” to “open” however there isn’t a mechanism to easily detect if the app is installed using JavaScript from a web app.

NOTE: While the ‘View in Store’ button works in IE, Safari and Firefox it does not work in Chrome.  I’m not sure what any timeframe it would be for Chrome to support the store launch protocol.

Anyhow, I thought this might be a useful addition to app developers web apps that have a Windows Store app counterpart (and perhaps already have an iOS and Androi counterpart as well).  I’ve submitted a pull request to the project I forked from, but you can get it from my GitHub repository for jquery.smartbanner.

Hope this helps!

So you got that shiny new Surface device today?  I’m sure you spent the first few hours just opening it up, setting your personal experiences to your desire, re-installing and discovering new apps.

But you are a developer and now you want to see how your app looks on this great device…Here are some tips to get you quickly started.

Setting up the tools

One thing to keep in mind is that Surface is NOT a full ‘desktop’ machine and runs on an ARM processor.  This means to that you cannot install Visual Studio directly on the Surface RT device.  You will need to still ensure that you have a full development environment set up.  But the first thing you will need is to get the remote developer tools for Visual Studio *for your target remote device* architecture.  For Surface RT, this is the ARM tools.

You can get them here: Microsoft Visual Studio Downloads.  Scroll down a bit and look in the “Additional Software” section.  Grab the Remote Tools for Visual Studio 2012 section. 

You can do this either from the desktop browser on the Surface or from your own desktop and download the remote tools for ARM to a USB key.

On your device, install the remote tools for ARM.  No other Visual Studio installation is required here.  Just run the installer.  When completed you should have a tile on your screen for the tools:

Now you can get started with your remote debug session!

Configuring the Remote Debugger

After install go ahead and launch the Remote Debugger on your device.  You’ll be presented with (maybe after some firewall questions you need to authorize) the remote debugger now running and in default mode:

By default, it is set up secure.  This means that in order to attach a remote session you’d need to ensure permissions are correct, etc.  Now since your ARM device isn’t likely on the same domain/workgroup as your developer machine this may be tricky.  Personally, I turn off the authentication options to make my developer experience smoother.  Now of course, you shouldn’t leave your device in this state, but you can close the remote debugger when complete.  Here is the config that I use on my remote debugger:

This allows me to just launch the app on the remote machine without having to use any special authentication tricks since the machine isn’t on my domain, etc.  My remote environment is now set up and ready for me to launch an app and start debugging!

Launching an App on the remote debugger

Now that your remote device is configured and listening, you want to start your app and debug remotely.  Once you have your app in Visual Studio you’ll want to change your launch target to “Remote Device” in the IDE.  This is in the toolbar or in the project properties.  For a C# application it looks like this:

Once you launch that you’ll be able to select your device.  Now if you are on your home network, with no domains and all on the same subnet, you may just be able to discover your device in the remote debugger connections window.  However you can also just specify the machine name.  Be sure to match the authentication method in this window with what you chose when you set up the remote debugger…in my case “none.”

Now that the configuration is there (and selected), when I run (F5) the application it will attempt to deploy it on the remote device.  When you run you’ll notice the remote debugger will show the connections:

And in your developer workstation you’ll be able to set breakpoints, investigate watch parameters, etc.  All the same stuff you normally do is still available to you.

Summary

Now that you have a Surface (or other Windows RT device) running on an ARM processor, this remote debugging toolset/workflow will be important to you.  The great thing is that once it is set up and you understand the flow, it is very simple and seamless to use.  This presents a great opportunity for you to debug and profile your apps on Windows RT to see any areas that you might be able to optimize for the target device.  And all you need is Visual Studio Express for Windows 8 (free) and the Remote Debugger tools for Visual Studio 2012 (free)

Hope this helps!

In some of our internal discussion lists there was some questions about how to host certain content for their application.  Most of the discussion came up from apps needing a privacy policy (Rule 4.1 from the Windows Store App Certification Requirements).  Some folks had apps they just developed, but no “site” or service they were using.  But they needed to host a privacy policy.  Lots of thoughts were floated around and I suggested Azure Free Web Sites as an option.  I originally suggested it as a simple way you could just have a URL to a privacy policy, but…duh, you could easily use it as a very quick marketing site for your app.

Creating a web site in Windows Azure

If you didn’t know, Windows Azure allows you to create a free web site!  It is very quick and simple to set up once you have your Azure account set up.  After doing that go to the portal and choose to create a new Web Site.  I recommend picking from the gallery and choosing WordPress.  There is such a vast ecosystem around WordPress as a CMS system that it is simple to use and set up. 

NOTE: Of course you can use others, even a static web site using the TFS/Git deploy feature even.  Do whatever you want.  I just think WordPress is great and allows you to scale your site features without writing code, etc.

Choose to create a site from the gallery:

This will walk you through a wizard to pick some names and options.  It is pretty self explanatory.  Once completed you will see your site provisioned in the portal.

Just click that link and you will be taken to your site…which for WordPress will be the initial setup page to choose your login.

Choosing a WordPress Theme

Once in the WordPress admin site, choose the Appearance option on the left, then the Themes sub-menu.  Once there, go to the Install Themes tab to pick a theme from the gallery.  Optionally you can grab a premium theme from various sites.  There is one called “Responsive” (search for that term) that is in the built-in gallery, free, and actually serves the basic needs well.  We’ll choose that one:

After you pick it you’ll want to Activate it as the current theme.  Now let’s do some simple configuration.

Configure the WordPress site

In order to serve the goal of making this more of a marketing site and to host our privacy policy we don’t need commenting on pages.  Additionally we want “nice” URLs for our site.  Let’s start with a few simple tweaks.

First (in the WordPress admin site) go to Settings->Permalinks.  Choose the “Post name” option.

Next go to Settings->Discussions.  In the top uncheck the “Allow people to post comments on new articles” in the top:

This will prevent commenting on content.  Next using the Responsive theme we can configure the home page.  Go to the Appearance->Theme Options section.  You’ll see a “Home Page” option for the Responsive theme.  You can set the main text, tagline and two other options.  This gives you the chance to set the URL for your app that is provided from the Windows Store. 

Here are some posts to help you find URLs for your app: Linking your apps on the web and Connect your web site to your store app.

Here is an example:

Now go to Appearance->Widgets to modify some information on the home page for the 3 widget areas.  These could be simple things like a quick blurb about what the app is, maybe some top features, or whatever.  In the admin widget area you’ll see Home Page Widget 1,2,3.  Simply add the “Text” widget to these and you can add the title/text for this:

You can also remove the theme logo to provide your own logo in the Appearance->Header section to provide your own image.  You can also specify a custom image on the main “hero” section of the home page instead of the default image and specify that.  Once all these quick tweaks are done, your home page is done.  Visit the site to see the quick changes.

Now let’s add our privacy policy so we have a permanent place for our privacy details.

Add a Privacy Policy page

From the WordPress admin site, go to Pages->Add Page.  Name it “Privacy Policy” and then type in your privacy policy text.  You can modify the text using HTML formatting to fit your needs.  Make sure to use the “Full Width Page” template so that it shows the entire page.  Notice the URL for the permalink.  I recommend keeping it simple with “privacy” or “privacy-policy” as the name (which should be default):

Once you Publish the page, your site will now have a link to “Privacy Policy” on the home page and you can use that in your site, for your certification process and other areas you may need it.

You can now provide a link within your app to your privacy policy as well.  Andy has a simple method of adding it to the Settings charm and simply linking to your online site now.  You can visit the site to confirm it looks as you wish:

Done!  You can see this example at http://timscoolapp.azurewebsites.net. 

Profit!

Now you have a free site on Azure to host marketing your app.  Of course this helps those getting over the hump with providing a nice place for a simple privacy page, but also enables you to have a way to provide other pages for your app.  You could provide more detail on features, have a form to collect feature requests, whatever.  WordPress is very flexible and the same process you used to create the privacy page can be used for other full-page content.  Or you can explore what WordPress has to offer you.  Again, there are many different ways you can do this and even within WordPress other themes you could choose.  However I think the Responsive one is a simple one to get started with as a base.

You may want to not have “azurewebsites.net” as your site URL as well.  If you wanted you can migrate to a shared instance (not free) and have custom domain name resolution on your Azure site as well.

Hope this helps!