Windows 8.1

Using MS Project Siena for Rapid App Development

 

The first truly visual tool for developing Windows 8 apps has emerged from Microsoft. Project Siena (beta) is a Windows 8/8.1 Windows Store App that enables you to create a Windows 8 Store App for Windows 8/8.1 users from a Windows 8.1 or 8.1 RT device. Because it’s a Windows Store app, this means you can indeed use your Surface RT or Lumia 2520, etc. to create functioning apps. It’s a very cool tool and has a very short learning curve. You can read about see how an app is created start to finish and access the complete reference list of supported commands and functions online.

I have been interested for quite some time in creating an app for my photos displayed on my web site, but never found the time to do so in Visual Studio. I decided to see what Project Siena could do for me. I’d been thinking that Project Siena would be a neat way for photographers to deliver customized wedding albums, or even sell their services. Make a few templates, then use them for specific jobs or contracts. Provide them as part of a wedding/photography package etc. to current or possible future clients.

I sat down to try a proof of concept using Project Siena one morning and found it was very intuitive.

The first step was to decide what to display in the app. Since I already had the photos on line, I wanted the app to display the photos from the Internet and not store them locally. I created an Excel sheet for each category and saved each sheet to my SkyDrive storage. Using the photos already available online provides a way to minimize the size of the app and also (after thinking about this for a bit) a way to change out content on the fly. I’ll get to that in a minute. I knew I might need both a list of thumbnails (already on my website) and full size photos (already on the site), so I created a basic template that I could search and replace or paste in the real data.

siena excel

While currently the template uses numbers, my real image names on the site don’t, but the next time I add or change photos on the site, I’m going to rename the images in each category numerically. If I do this, every time I change out a photo on the web site, the change will be reflected in the app. I’ll have to keep the number of photos the same in each category as on the spreadsheet for this to work but it’s an interesting concept. I used this template to create s separate Excel sheet for each category and created a table in each sheet.

The first step in building the app was to import my data sources, and I quickly imported all five Excel sheets.

I wanted the app to look something like my photography website, so I re-used graphics I already had saved. And I selected a color scheme similar to what I use on the web.

siena photo app

I created a screen for each of the five categories and an About screen that is accessed when the name of the app is touched/clicked. On the screen for each gallery, I added navigation (a back button), and specified that OnSelect, it should navigate to the Home screen. Then, I added an image gallery, which I styled the way I thought it should look and specified the corresponding data source which would auto fill the gallery.

build siena

Since I could copy and paste elements between screens, I really only had to style the image gallery on each individual page. So for rapid visual development, this was way cool. And really fast.

A few quick steps to create and style Windows Store icons and Tiles from a single 245×245 px PNG image and I was ready to “publish”. For now, I’ve created an appx file which can be installed from an included PowerShell script, but there are options to run a cmdlet that you can download from Microsoft to turn into a full blown Visual Studio project for publication to the Windows Store (you will need a developer account to do this).

You can download the app from the Windows Store if you’d like to check it out!

Tweaking IE11 Live Pinned Tile Code for dual feeds on same domain

After using Microsoft’s Build My Pinned Site web app for my personal site, I decided to see what I could create for www.msmvps.com which hosts two blog platforms, WordPress and Community Server. I did some reading on MSDN, but found no reference to using more than one feed. So it was time to experiment.

 

Build My Pinned Site really does most of the work, even for tweakers like me. I started by specifying a Title (which you can leave blank if you wish), a background color for the Tile and by uploading a single image (use a png 558×558 pixels for best results and maximum flexibility). Leave lots of padding in your image so that it can be cropped to each of the supported tile sizes. Cropping for each tile size is easily done right on the web page. In the case of building the Live Pinned Tile for msmvps.com, I specified a white background, but wanted a border around the edges which the crop function does not allow you to specify. So after downloading the zip file from buildmypinnedsite.com, I used PhotoShop (you can use any editor) to add the borders to each of the four image files to give each tile a more a finished look.

build1

 

The code generated by the web app within the wizard or in the download contains references to the first RSS URL I used:

 

build2

Once you’ve specified the text and graphics, you enter the URL for the RSS feed. Then you can download the package. I ran the Add Notifications process again on the second RSS URL so that I could edit the browser.xml file in the package I would be downloading.

 

The edited browser.xml contained references to both feeds (so the most recent three posts from the Community Server blogs and two posts from the WordPress blogs would always cycle through the Live Pinned Tile):

 

xml

 

There are five files in the package which need to be uploaded to the root of your blog folder on the blog server. You will need to edit the header.php of a WordPress blog or insert the code within the header tags on any site and add the following code in the appropriate place:

 

 

<meta name=”application-name” content=”Whatever name you specified when building mypinnedsite”/>

 

Favicons are also included in the pinned live tile functionality if you have configured this in your header and added the ico file to your root directory. If the header includes the code:

 

<link rel=”shortcut icon” href=”/favicon.ico” />

 

Visitors to  MSMVPS.com who elect to use the IE 11 Live Pinned Tile feature should

1. Select the Favorites icon

pin1

2. Select the Pushpin icon

pin2

3. Select one of the four tile sizes (I suggest the wide tile which should be the first one presented) and then select Pin to Start.

 

pin3

End result, the Pinned Live Tile will cycle through five recent posts from both blog platforms at www.msmvps.com

 

pin4pin5

 

Images will display if included in the feed as well.

IE 11 Pinned Tiles with Full RSS and Image Support for Windows 8.1

 

During the Windows 8.1 preview, I posted an article about IE 11 pinned tiles. Last night, one of my Twitter followers asked me why I didn’t have a Pinnable Live Tile for this site and I replied that I’d removed it as I wanted visitors to download my dedicated app for me blog. I soon realized that not everyone wants an app, so went about restoring/rebuilding the functionality. If you haven’t tried Microsoft’s free and easy buildingmypinnedsite.com, put it on your to-do list and spread the word.

 

My Twitter friend pointed me at a WordPress plugin for this function. I took a quick look at it and found it to be a derivative of Microsoft’s Build My Pinned Site and that it used PHP and Javascript and a single image with less control over the end result. The plugin is ok for novice users, but buildmypinnedsite.com also offers a way to upload a single image, crop it for each of the five supported tile sizes. I do recommend that if you have a self hosted site and access to the root that you use buildmypinnedsite.com and upload the images and the xml file to the root and then edit the header (header.php) in your WordPress theme for the best impact and full functionality. It’s wizard driven (and you can even manually tweak the images if you download the zip file).

You start by specifying a Title (which you can leave blank if you wish), a background color for the Tile and by uploading a single image (use a png 558×558 pixels for best results and maximum flexibility). Leave lots of padding in your image so that it can be cropped to each of the supported tile sizes. Cropping for each tile size is easily done right on the web page.

 

build1

 

Once you’ve specified the text and graphics, you enter the URL for the RSS feed. Then you can download the package. There are five files in the package which need to be uploaded to the root of your blog folder on the blog server. You will need to edit the header.php of a WordPress blog and add the following code in the appropriate place:

 

<meta name=”application-name” content=”Whatever name you specified when building mypinnedsite”/>

 

The browser.xml contains all the code needed to fetch the RSS feed to cycle through the most recent five posts.

build3

You can alternatively copy ALL the meta code presented to your header and upload the four png image files. (But again, I recommend you use the xml and image file upload method if you are able to access the root of your server).

build2

The user experience to add a Pinned Live Tile in Internet Explorer in Windows 8.1 is quite good.

The visitor to your site navigates to your site in IE and swipes or right clicks to display the app bar and the add to favorites command.

 

Screenshot (63)

 

Then, they select the Pin to Start icon.

 

Screenshot (65)

Finally, the visitor to your site selects one of the four tile sizes using the < and > arrows presented and then selects Pin to Start.

 

Screenshot (66) Screenshot (68)
Screenshot (69) Screenshot (70)

 

The end result on a Windows 8.1 computer:

 

Screenshot (71)

The large tile shows titles of recent blog posts and IMAGES from digitalmediaphile.com.

 

Undocumented extra bonus! It looks as though favicons are also included in the pinned live tile functionality if you have configured this in your header and added the ico file to your root directory. If the header includes the code:

<link rel=”shortcut icon” href=”/favicon.ico” />

 

then the Pinned Live Tile will display the favicon in the lower left hand corner (which you can see in the screen capture above, just below the listing of three recent posts).

Fitbit Devices Now Sync with Windows 8.1 Store App

 

Wow, just got a Windows Store Update for my Fitbit App. I figured it was XMAS and just maybe… (syncing with my favorite fitness tracker was one of the three big missing features on my Windows 8.x list, the others being a real Sonos controller and Quicken Mobile – which would be like Mint but sync with desktop Quicken – which may be coming, now that the Mint app has launched)

So I plugged the tiny Fitbit wireless sync dongle into first my Surface Pro, then my Surface 2, and finally into my new Nokia Lumia 2520 (using a USB to Go Host adapter) and the results were:

 

fitbit1

 

And yes, it can run in the background and sync automatically just as my iPhone does. I didn’t turn that on (yet) because I’m sharing this dongle among these three devices, but I will decide on which one to wmpower.

 

fitbit2

Thank you Fitbit folks for the holiday gift!

Cleaning Up Xbox Music on your PC and in the Cloud for Windows 8.1

 

I’m one of those Luddites who has multiple terabytes of local NAS redundant storage for my photography hobby and my music collection. I’m not interested in paying anyone for the privilege of storing “my stuff” in “their” cloud. Yes, I have oodles of SkyDrive storage thanks to the 200GB free for one year with purchase of a Surface offer, but it is ONE YEAR. I’ve also got multiple SD and micro SD cards that contain redundant copies of my Music collection. All ripped from CD’s I own, vinyl I’ve converted to digital, etc. And I have some digital purchases from Amazon.

 

I was a huge fan of the Zune Software for Windows, but it isn’t available for RT. Sadly, Microsoft’s Xbox Music App on Windows 8.1 has driven me crazy. It misidentified albums and provided bad album art, and it indexed multiple copies of the same track in many cases (and then listed some as unavailable). It defaults to the cloud collection unless you change it. And worst of all, it isn’t possible to use Windows Play(to) DLNA to stream to another device when accessing cloud based music with this app. I’m sure it is some DRM fear on the part of Microsoft, but streaming is what I do and I rarely listen directly on my computers (or iPhone).

I decided to try to clear out the cloud based music in Xbox Music and found that it was a time consuming and frustrating PITA to rid myself of tracks in the cloud.

First, I needed to turn off Cloud collection and Media Info, on EVERY Windows PC and fix up the bad album art.

xbox music cloud off-2

 

Then, on EACH computer, I had to DELETE all cloud music by carefully selecting In the cloud from the dropdown and then deleting everything.

xbox cloud empty on computer

So great, I thought that all the music in the cloud was gone. Boy was I wrong. Visually, the Cloud based content no longer appeared on any computer, but it was just hidden from all views.

Using a web browser, I navigated to http://music.xbox.com/Collection/Songs and found I had some 3200 tracks listed. I reverified that all music was deleted on the local computers. I scratched my head. I guess Microsoft wants to save me the trouble if, at some future time, I want my collection in the cloud. Still, there should have been an option inside the App to permanently delete this stuff. And no, I don’t own or intend to purchase an Xbox One. Onwards…

Easy, I thought, I’ll sort the music by Album and delete. Wrong. The only way to delete music from the Xbox Music Cloud that I could find is to sort by Songs and delete track by track, and it’s a well hidden delete option. It’s necessary to hover over a track and click the trash can. For every single track. The screen shot below (after I deleted about 1000 tracks and (probably jump started carpal tunnel) shows the tiny trash icon you have to “hit”.

 

delete xbox music-2

 

And after selecting the trash icon, a prompt displays asking you to confirm the deletion.

 

xbox music-3

The cloud collection was mangled and useless to me. Check out the number of track listings for “Listen to the Music”, as an example – some apparent duplicates, and see the Unavailable annotation. This mirrored the experience inside the Xbox Music app. Music Russian Roulette. And I own ALL of these CD’s and all versions of this track are in my ripped music collection stored locally. Hovering over one of these unavailable tracks produces the strange message that I can add to my collection and play later on my Windows 8/Windows RT device. (But these tracks are all accessible locally on those devices already). More head scratching.

hover can't play

 

After several hours long sessions, I’ve emptied the music in the cloud (I hope) as shown by this screen shot from IE.

 

finally empty

 

I’ve got plenty of other options for cloud music storage in the off chance I’m someplace without one of my devices/SD cards, and I’ve chosen Google’s Free Standard service for a backup copy of my ripped music. There is an App for my iPhone (where music is stored locally anyway) and Windows 8.1 (third party ad supported app). Best of all, the third party GMusicW app on Windows 8.1 supports DLNA Play(To) streaming from the cloud as you can see below.

 

google

I’ve got Pandora, Spotify and Nokia Music for those times I might decide to explore similar/new music. And I no longer have XBox Music altering my music collection and providing frustration.

Windows 10 users: Read this blog with my PWA (Progressive Web App) from the Windows Store



Read this blog with my Windows 8 App

Get the App

Categories