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!

Read this blog with my Windows 8 App

Get the App

Categories
Tags
Archives