Thoughts on building metro apps

Today was a workshop at Microsoft Lithuania HQ about how to build metro apps with HTML5 and JavaScript.

It was a really fun and productive day with a lot of cookies, coffee and code. Not to mention really bright people that came to learn.

Contrary to the popular belief – heard it from various developers in various levels and work areas – JavaScript and HTML5 based apps are not compiled or transformed in any way to the regular C#/XAML apps. Rather they use a Internet Explorer 10 engine to render everything and everything you code is run as-is. This has some awkward drawbacks but also proves one thing straight: that IE is finally efficient, modern browser capable of doing lots of stuff, providing all necessary API’s (even IndexedDB) for cutting edge web and, as learnt today, application developement. This also means that you can easily incorporate any JavaScript framework you like, ranging from jQuery, jQuery UI/mobile/plugins, knockout.js, backbone.js, like whatever floats your goat.
One important thing here is that this should not be compared to HTML5 implementations of apps in other platforms (Android, iOS, BlackBerry). There it is actually converted to the native code and the troubling factor is that doing so hits your performance real bad. Apps made with HTML5 don’t feel as smooth, they lack the intended awesomeness of native apps. Hence, HTML5/JS tandem is merely a tool for prototyping and quick demo building or an app that you must build cross-platform ASAP (see Titanium SDK, etc.). But when you decide to do quality things right you need to switch to the native code (so Objective-C or JAVA). It is a big advantage here that it is not the case here. You won’t experience any slugishness or other unitended consequences when choosing HTML5/JS over C#/XAML, you will have the same – if not better – performance results and quality.

Now on to the awkward drawbacks: you cannot use TypeScript in your project. http://www.typescriptlang.org/ – just look how very nice and metro this website looks! It provides the type safety and other features, that some say are missing from native Javascript. The TypeScript compiler compiles/transforms TypeScript code into native JavaScript that can be later used in websites. This is a real fetish for Microsoft based developers that call <table> – a grid component and a absolutely positioned <div> – a dialog component. They have the urge for stuff to be compiled, they need type safety because they think it is safer, cleaner and so on. You might get the feeling that I’m don’t like any of those things, but the truth is I’m someone in the middle. While not seeing how type safety can benefit anyone in the web development, the benefits in business intelligence, heavy data processing – well all kinds of enterprise software – are crystal clear. Coming back to the TypeScript incompatibility in metro apps we see a big corporations failure in communication when doing a lot of things fast. Well that is a thing hard to achieve, but the situation gets just plain silly when you have one team of Microsoft evangelising TypeScript as the companies way to do stuff with JavaScript, by adding features to it and telling us how to do things. Yet another team is telling us how to program apps for their platform in JavaScript and it does not support the stuff you should be doing according to the TypeScript people. Note here: it is possible to use TypeScript, but you have to compile and then add the compiled JavaScript to your app.

The overall development of apps look quite simple and well thought-through. One can claim that Microsoft is taking the approach that Apple took a while ago. Our lecturer Stepan Bechynsky was excelent at stressing what we can and cannot do with metro apps. For example there are fixed number of tile layouts of the apps. And you cannot customize them or add anything new. Everything you will ever need is put on the plate and you must use it because that is the convention and that is the guideline. There is finally no such thing as an analyst designing UI or making stuff up that he thinks is comfortable or usable. This arrogant approach is common practice in many many development organizations. Some people might advocate that this approach limits their creativity and freedom to do whatever they like, but actually, simply put, it protects them from their overrated “competences”, over-though, over-complex ideas and puts it into a solid framework where you build from basic parts, which have defined shapes and other basic features. For example a simple idea – to play a video in a tile, or to have smaller font in one of the templates – would violate the continuity of the metro environment and eventually things would start to get messy.

Being all nice-looking and really usable metro apps have not much to offer to institutional clients, big business or governments. The most common and the only worth noticing case of such implementation is executive summary kind of dashboard. Where a manager sees the overview of his subordinates, tasks, budgets, project deadlines, bottom lines, etc. So basically we could have a metro app for a working ERP, DMS, CRM system that shows some reports, charts, maybe allows to make decisions, delegate tasks. The scarcity of ideas in this sphere shows, that the environment is indeed young, undeveloped and promising a lot of big opportunities, new ideas and ways to change peoples habits.

That could be supported by the fact that everything is very very “cloudy”. You basically are encouraged to use Windows Azure or other cloud services. The thing here is that you have no much ways to deal with this any other way. You have no backend in HTML5/JS and most likely you will obtain any data from a service and services tend to reside in the cloud.

Another notable thing is about licensing and app store approvals. Apple has a bit different approach – you have the mobile market which covers tab and phone apps and you have the dekstop market which covers Mac OS apps. Here you have Windows market which covers Windows 8 and Windows RT so desktops and tablets are covered and you have the Windows Phone which covers phones. The price for developer license is 49$ for Windows and a hundred for Windows Phone. Now, make no mistake here blaming Microsoft for not having a unified license, because you actually get something for your fee here. That is actually quality assurance: you need to pass a certification for your app to comply with the requirements. This way Microsoft helps you test your app and identify its weaknesses, find bugs, common issues and it also keeps the store clean of crappy software. And this process is done well, although sometimes could be very subjective:

1. Windows Store apps provide value to the customer
1.1 Your app must offer customers unique, creative value or utility in all the languages and markets that it supports

This indicates that the app must provide “creative value” which is a very abstract term. The given example was about an app “Bazinga” which actually had only a picture of Sheldon Cooper from Big Bang Theory and one button, which, when pressed, outputed the sound “BAZINGA!”. This app was rejected the first time it was submitted because according to the tester it had not provided any value. Well that might be true for monetary value, yet the entertainment value is huge, at least for 5 to 10 seconds. So, my guess would be alright. But a developer doesn’t have to worry about these kind of things. Everything is negiotiable with the testers and you can prove your point – explain the cultural background, the entertainment purposes, etc.

So all in all, it was a really fun and creative day which inspired for some new ideas and will definetely result in an app in few weeks time. Microsoft is starting again to be the cool company in a new way which helps developers across the globe build the business around its architectural solutions, products and services. It even helped me already when my Windows 8 had some problems running on my Macbook, they lent me a ASUS tab which was a strange way to build apps, but definetely something every developer should try.