thebeebs

Shape Conference: Windows 8 Game Development

thebeebs — Mon, 08 Apr 2013 17:01:22 GMT

During the talk I referenced a few projects. The code can be found here:

Throughout the talk I used the EaselJS Library.
There are complete instructions on how to build the 2D Platformer are over on David Rousset’s blog which can be found here.
The guys over in Norway have produced the excellent HTML5 Game Starter kit I showed towards the end of the talk. Instructions on how to get it running can be found here.

ASP.NET MVC 4

thebeebs — Fri, 05 Apr 2013 11:05:24 GMT

Over the past few months I’ve been locked away in a dark cellar working on a small MVC 4 project called ZipApp. It’s a basic Windows 8 app builder, for me one of the highlights of the project was using some of the new MVC features in anger. The last full-time project I worked on was MVC 2 based… it’s amazing to see how much has changed and matured in the past 3 or so years.

Last week, I was chatting to Steve Sanderson and he mentioned he had some “Pro ASP.NET MVC4” books going spare and wondered if I wanted to give them to the community.

I jumped at the chance and so if you want one of the 8 copies simply tweet me ~~@thebeebs with the hash tag #givemeABook with a link to any website you have built using .net.~~ The Competition is now closed.

I’ll send the books to the 8 best websites I see.

P.S. You have to be a UK based developer (but the site can be from anywhere) I’ll name the winners at 4pm today (Friday, 5th of April)

The Winners were:

The MVC Book winners are ‏@andiih ‏@steentottrup ‏@brendan_rice @chris_neff_pgh ‏@costall ‏@ravimotha ‏@petethedev ‏@christosmatskas
— Martin Beeby (@thebeebs) April 5, 2013

How do you stop element breaking inside a CSS3 multi column layout

thebeebs — Thu, 28 Feb 2013 15:57:16 GMT

I came across a rather annoying feature today when I was trying to create a layout with CSS3 multi column. I wanted to stack some divs on top of each other in columns.

My first attempt lead to this, which was not what I wanted:

I wanted the tile’s to break to the next column if they didn’t fit into the column in their entirety. It took me a while to find out what I need to do was add the following code to each div:

break-inside:avoid;

This tell the browser to avoid breaking an element in half or as the spec puts it: “Avoid a page/column break before inside the generated box.”

Code can be found here: http://jsfiddle.net/zR2FY/

Please Note: All the code is standards based (i.e. Doesn't include any vendor prefixes) At the time of writing only IE10 and Opera 12 support this unprefixed syntax, if you are using Chrome then they use a slightly different syntax and –webkit- prefixes.

App Rewards Xbox Games

thebeebs — Wed, 20 Feb 2013 11:39:47 GMT

Update: All ARE NOW GONE! Here are the winners:

After being taunted by Mike I have 6 Xbox games to give away… The first 6 Folks to tweet with the hashtag #thebeebsIsbetterthanMtaulty #apprewards and a link to the rewards programme http://www.appbuilder-rewards.co.uk/ will get them.

The games are:

2 x Call of Duty Game
2 x FIFA 13 Game
2 x Need for Speed Most Wanted Game

#thebeebsIsbetterthanMtaulty #apprewards http://www.appbuilder-rewards.co.uk/

App rewards and why I don’t want to “Pull a BlackBerry”

thebeebs — Wed, 20 Feb 2013 10:33:25 GMT

On Monday the UK marketing team Launched an app rewards programme… After a discussion on twitter I thought I'd put my thoughts in writing:

Rightly or wrongly the total number of apps is becoming shorthand for the consumer experience that a device is going to provide. "It's a great phone/tablet, but doesn't have enough apps" is the rhetoric regurgitated by tech journalists up and down the country. For me, total number of apps on a platform is a nonsense. Too much choice is no choice at all, Interesting, compelling and well executed apps are what consumers want and they are not created overnight, they are crafted by professionals and like it or not you can't build them in a weekend.

As someone who works on and cares about developer platforms, the pressure of large app numbers creates a huge challenge. You could do what Blackberry did and pay a company like Mippin to auto generate thousands of apps for you, you can refuse to play the game and have every tech journalist point and laugh at your app number (oblivious to the fact that app development lifecycles are far longer than the 24 hour hackathon culture that we are all quietly obsessed with), or you can incentivise developers that you know are capable of building quality by giving them a reason.

To me stuffing a store full of which are rushed ports from other platform and WebView versions of mobile websites is like opening up a museum next to the Louvre with photocopies of their art and 70,000 drawings you did last night then wondering why nobody is buying tickets.

I'd love it if we could take all of our marketing money and spend it on working 1-2-1 with developers to produce only the best apps (we spend lots of time doing just that), but I have to face the realities of the current market. We can't just compete on quality of applications, we have to compete on quantity as well. It's all about quality, but on a large scale.

Trying to develop a rewards program which rewards developers for building great apps rather than simply porting rubbish from other platforms is really hard. I think the UK team have done a great Job of putting together a developer rewards program that tries to encourage quality by giving developers time and incentivizing them to incorporate Azure, Phone and Windows 8.

Rewards programs are only a fraction of what we do here in the UK Developer evangelism team, as well as Myself, Mike, Andrew, Lee, Ben, Andy, traveling the country to show developers how to build Windows apps, Our UK based team of around 60 work with app builders from small to large. We work on funding, making heroes of developers, create apps of the future, work with start ups and showcase the best of local talent.

What do you think about rewards programs? How can we tailor them to make them better for developers. Let me know, I'd love to know your thoughts on our programme.

App Rewards Mashup

thebeebs — Wed, 20 Feb 2013 09:27:53 GMT

To celebrate the Launch of the our new App rewards programme, I’ll give 12 Months XBOX Live Gold Membership to the two best app names that use the hash tag #apprewards #appmash. Sadly only folks in the UK are eligible to win.

You don’t need to go into detail about the app (if you don’t want)… Just tell me the name:

Here is an example

Plants Vs Chuck Norris #apprewards #appmash bit.ly/YFEBby
— Martin Beeby (@thebeebs) February 20, 2013

I’ll announce the winners at lunch time today around 12:00pm.

The winners are :

Zombie Sharks from Outer Space. You are Laser Lion, earths last hope for survival after the invasion of 2021 #apprewards #appmash
— Macs Dickinson (@MacsDickinson) February 20, 2013

Horse Vs Cow #apprewards #appmash bit.ly/YFEBby
— Andy Pierrepoint (@zangluk) February 20, 2013

Managing an Agile project

thebeebs — Thu, 10 Jan 2013 17:29:08 GMT

I have worked as a Developer Evangelist for around 3 years now and whilst I still code, it’s been quite some time since I have worked on a software project. Over Christmas this changed as I found myself building a service to help people with no coding skills build Windows 8 Applications.

Since I was the lead developer, Architect, Project Manger, Tester, Junior Developer and cleaner, I felt it was good opportunity to try the cloud version of Microsoft's Team Foundation Server. I figured, if I didn’t get on with it, I was only going to upset myself.

Ordinarily I’d use a mix of technologies depending on if it was me or someone else running the software project, but generally speaking these would range from Subversion, Git or TFS for the source control, MSTest, NUnit and QUnit for the tests and something like cruise control or Team City for continuous Integration.

I’d then manage the project on BaseCamp or MSProject (I have tried loads of tools, all have pro’s and cons – the biggest con of most is that I never remember their names). I’d also likely resort to good old fashioned post-it notes to manage the backlog.

In summary, there are lots of moving parts and different systems that integrate with each other with varying degrees of success.

TFS in the Cloud is brilliant

There i said it. In my experience the software you use to manage your source control and build process is only as good as the guy that set the whole thing up. If they know what they are doing, you are living the dream, if they didn’t, you are in software building hell. That's what makes http://tfs.visualstudio.com so good, all that crazy set up and configuration is completely taken away and you can have a system set up and running in about 10 minutes.

So far these are the things I really liked:

It’s free for up to 5 users, so I could get started without having to raise a PO.
The beginners guide is really straight forward and explains all the basics very concisely.
Adding Backlog and work items is really easy.
It has a board view so I can see what is and isn’t in progress
It integrates directly into Visual Studio to I can check-in my code changes directly against work items which in turn reflects in the systems so that others can see the projects progress.
You don’t have to use TFS as your source control – You can use Git too which will make it easier for me as the UI developer I plan to use uses Git pretty much exclusively and I don’t fancy paying him to learn TFS when I only can afford a few weeks of his time.
You can have the system run your tests on check-in so you don’t need a separate continuous integration server.
Merging and code reviews are as easy to manage as they are with TFS

It’s still early days, but so far… I bloody well love it.

How do I get the users current location in a Windows 8 app?

thebeebs — Tue, 07 Aug 2012 07:00:00 GMT

There are instances whilst developing Windows 8 applications in HTML5 when you discover there are two ways to do the same thing. Geolocation is one of those examples. You can either do it the same way you would in a browser like IE9 or Chrome or you could do it the WinJS way.

By providing both methods it ensures that we retain all of the browser APIs from Internet Explorer so that code ported from a website will just work, whilst also ensuring JavaScript maintains the same WinRT features and namespaces that are available across C# and C++.

So the question arises… which should you use? The standard API or the WinJS version? My answer is: Use whichever you prefer.

The standards based way:

function getLocationBrowser() {
   if (navigator.geolocation != undefined) {
       navigator.geolocation.watchPosition(getPositionHandlerBrowser, errorHandler);
   }
}

function getPositionHandlerBrowser(pos) {
    document.getElementById('latitude').innerHTML = pos.coords.latitude;
    document.getElementById('longitude').innerHTML = pos.coords.longitude;
    document.getElementById('accuracy').innerHTML = pos.coords.accuracy;        
}

The WinJS way

The main difference is that we use the promise pattern which enables us to more easily chain asynchronous calls. Also the pos object that gets passed to the getPositionHandler has different property names, specifically coords is called coordinate.

var loc = Windows.Devices.Geolocation.Geolocator();

function getLocation() {
    try {
        loc.getGeopositionAsync().then(getPositionHandler, errorHandler);
    } catch (e) {
        // Catch Errors
    }        
}

function getPositionHandler(pos) {
    document.getElementById('latitude').innerHTML = pos.coordinate.latitude;
    document.getElementById('longitude').innerHTML = pos.coordinate.longitude;
    document.getElementById('accuracy').innerHTML = pos.coordinate.accuracy;
}

How do you test the touch / on-screen keyboard inside the simulator?

thebeebs — Mon, 06 Aug 2012 07:00:00 GMT

I got asked this question on email last week. The simulator, for those that don’t know, is a way to test your Windows 8 application on simulated hardware. You can, for example, simulate a higher resolution or Pixel density than your actual machine. Amongst other things it also allows you to simulate touch events.

To test touch you can simply click the hand icon, the simulator will then treat click events as if they were touch events. To test the touch keyboard simply click in any test field, because you are simulating touch the on screen keyboard will appear.

How do I ask the user to add my application to the lock screen?

thebeebs — Fri, 03 Aug 2012 07:00:00 GMT

For background task with timers to launch you must ensure that your app is added to the lock screen. You can request to be added as a lock screen application by adding the following code to your project:

var Background = Windows.ApplicationModel.Background;

var promise = Background.BackgroundExecutionManager.requestAccessAsync().then(
    function(result) {
        switch (result) {
            case Background.BackgroundAccessStatus.denied:
                // Background activity and updates for this app are disabled by the user. 
                break;
    
            case Background.BackgroundAccessStatus.allowedWithAlwaysOnRealTimeConnectivity:
                // Added to list of background apps.
                // Set up background tasks; can use the network connectivity broker.
                break;
    
            case Background.BackgroundAccessStatus.allowedMayUseActiveRealTimeConnectivity:
                // Added to list of background apps.
                // Set up background tasks; cannot use the network connectivity broker.
                break;
    
            case Background.BackgroundAccessStatus.unspecified:
                // The user didn't explicitly disable or enable access and updates. 
                break;
        }
    });

You can also check to see if your app is a lock screen app by using the following code:

var Background = Windows.ApplicationModel.Background;

var result = Background.BackgroundApplications.getAccessStatus();
switch (result) {
    case Background.BackgroundAccessStatus.denied:
        // Disabled by the user.
        // Cannot display on the lock screen. 
        break;
    
    case Background.BackgroundAccessStatus.allowedWithAlwaysOnRealTimeConnectivity:
        // Added to list of background applications.
        // Can display on the lock screen.
        // Can set up background tasks and use the network connectivity broker.
        break;
    
    case Background.BackgroundAccessStatus.allowedMayUseActiveRealTimeConnectivity:
        // Added to list of background applications.
        // Can display on the lock screen.
        // Can set up background tasks but cannot use the network connectivity broker.
        break;
    
    
    case Background.BackgroundAccessStatus.unspecified:
        // The user didn't explicitly disable or enable.
        break;
    }