Software development

Developing apps for the Microsoft Surface tablet

Posted on by
1

Microsoft has just announced its entry into the tablet market, the Surface.

Microsoft Surface

Designed and manufactured by Microsoft, Surface will launch this Autumn and comes in two models:

  1. A more powerful, expensive, thicker & heavier (13.5mm, 903g) one running Windows 8 Pro on an Intel chipset comparable to the latest ultrabooks. This tablet will be able to run demanding desktop applications such as Office, Photoshop and others. An attachable stylus will also be available for handwriting and annotation.
  2. A cheaper, more lightweight (9.3mm, 676g) model running Windows 8 RT on an ARM chipset comparable to the latest tablets. This tablet will not be able to run desktop Windows apps, only the Metro style apps bought from the Windows Store.

Along with the tablets, Microsoft announced their own range of covers for the device, with integrated keyboards. One a thin, pressure-sensitive multi-touch keyboard in a range of colours (shown in the image above); and one a tactile keyboard with depressible keys. Both include a trackpad and Windows 8 function keys.

I mention these details because it’s important to keep the device’s form-factor in context when developing apps for Surface; the presence of a physical keyboard (as opposed to on-screen) or stylus will certainly impact design decisions.

Apps for Surface

Surface is Microsoft’s platform for delivering Windows 8 to the mobile market. Unlike Apple, Microsoft will be running the exact-same operating system on their tablets as on their laptop and desktop devices. For developers this means the Windows Store will be key in delivering applications to every Windows device, whether mobile or not.

Windows Store

Any Windows 8 Metro app on the Windows Store will be available to Surface users, and those with the higher-end model will also have the option of using the Store (or other methods) to find and install desktop applications too. Let’s focus on the Metro apps and look at the development process.

Developing Windows 8 Metro apps

The great news is that you can get started with app development entirely for free, as all the tools are in beta or preview stage at the moment. Once Windows 8 is released you’ll likely be able to choose between paying for fully-featured professional software and Microsoft’s free “express” tools.

To get started you’ll need the following:

Once you have your tools you can begin the design process:

Choosing your development languages will probably depend on the experience of you or your team:

Deploy your app to the Windows Store:

There’s a lot of great documentation out there to help you along the way, so take a look through the Metro development section of Microsoft’s website, and keep up with the Windows Store for developers blog.

Let us know how you get on, and if you need any advice or assistance, we’re here to help!

Follow our developers at Dev Camp

Posted on by
1

Day 1 was spent settling in and setting up in the beautiful cotswolds.

After supper and before turning in, they get stuck into business splitting up the application tasks thus:

  • Server-side – RavenDB and ASP.Net MVC – Mariusz and Neil
  • Client-side – Backbone.js and HTML5 – Tomasz (and Andrew, when he arrives)
  • UX – CSS framework(s) and JavaScript – Luke

They will do a fair bit of pair programming before moving on to parallel development after getting the basics done.

Follow their Day 1 activities on their OCC Dev Camp blog

They are covering a lot of ground during the week, starting with Rapid, reponsive UI development and looking in some depth at the many CSS frameworks and Responsive Web Design.

Follow the OCC Dev Camp week progress.

Dev Camp kicks off in the Cotswolds

Posted on by
Reply

Some of our developers have gone camping. Dev Camping.

All Set Up - raring to go!

5 of our IT consultants have disappeared to deepest Gloucestershire where they have set up camp where they aim to do some amazing things, experimenting with some of the latest technologies and bring this experience back to web application development at OCC.

You can read about the OCC Dev Camp on their own blog. Please do interact with the guys via their blog, post comments, give useful tips, or if you wish to know about anything you read about on their blog.

Object-relational mapping

Posted on by
Reply

At OCC there are regular presentations between the engineers on any technical topic of interest. We’ve decided to post a recent one on a technique called Object-relational mapping.

Object-relational mapping in computer software is a programming technique for converting data between incompatible type systems in relational databases and object oriented programming languages.

So it bridges the gap between the database and the code that uses the data.

ORM can be used for Fast prototyping and any data-based product that doesn’t have very complex data structures and data-retrieval procedures.

Engineers use ORM because if offers Object orientation (a lovely way to organise complex code), greater productivity, it makes the code agnostic as to the database it’s talking to (SQL server, MySQL, Postgres…), it offers easier maintenance and testability.

And yet…it only offers these advantages when it’s deployed judiciously.Yes, it needs to be used carefully.

You don’t have such easy control over the code, and this can present an overhead on complicated projects. You don’t have such easy control over the performance (though you can fine-tune this). Finally, ORM tools can lead you down a path to poor database design.

We’ve used Nhibernate for the following example. The “Fluent Nhibernate” extension allows easy auto mapping and database script creation straight from .NET objects

Take two simple classes; Customer and Address.

A simple object model

A simple Customer-Address object model

Using the Fluent NHibernate extension we generate code to create the database straight from the classes.

config = Fluently.Configure()
.Database(MsSqlConfiguration.MsSql2005.ConnectionString(c => c.Is(connectionString)))
.Mappings(m =>m.AutoMappings.Add(AutoMap.AssemblyOf<occ.showandtell.orm.hibernate.Customer>()).ExportTo(SchemaExportPath));
Configuration nhconfig = config.BuildConfiguration();
SchemaExport se = new SchemaExport(nhconfig).SetOutputFile(@"C:\development\fluenthibernate\example\schema.sql");
se.Drop(true, true);
se.Create(true, true);

The code generated for Microsoft SQL 2005 would look like this:

if exists (select 1 from sys.objects where object_id = OBJECT_ID(N'[FKFE9A39C05A2214B5]') AND parent_object_id = OBJECT_ID('[Customer]'))
alter table [Customer]  drop constraint FKFE9A39C05A2214B5
if exists (select * from dbo.sysobjects where id = object_id(N'[Customer]') and OBJECTPROPERTY(id, N'IsUserTable') = 1) drop table [Customer]
if exists (select * from dbo.sysobjects where id = object_id(N'[Address]') and OBJECTPROPERTY(id, N'IsUserTable') = 1) drop table [Address]

create table [Customer] (
Id INT IDENTITY NOT NULL,
Name NVARCHAR(255) null,
Description NVARCHAR(255) null,
Address_id INT null,
primary key (Id)
)

create table [Address] (
Id INT IDENTITY NOT NULL,
City NVARCHAR(255) null,
Country NVARCHAR(255) null,
Street NVARCHAR(255) null,
Number NVARCHAR(255) null,
primary key (Id)
)

alter table [Customer]
add constraint FKFE9A39C05A2214B5
foreign key (Address_id)
references [Address]

Which is hard to read (!)  but the code you write to use the ORM is nice.

Here’s something simple

for (int cnt = 0; cnt < 10; cnt++)
{
Customer cust = new Customer();
cust.Name = "Customer" + cnt.ToString();
cust.Description = "Customer description " + cnt.ToString();

Address ad = new Address();
ad.City = "Oxford";
ad.Country = "UK";
ad.Number = rnd.Next(200);
ad.Street = "some street "+cnt;

cust.Address = ad;

session.Save(cust);
session.Save(ad);
session.Flush();
}

List customers = (List)session.CreateCriteria(typeof(Customer))
.AddOrder(new NHibernate.Criterion.Order("Name", true))
.SetMaxResults(5)
.SetFirstResult(0)
.List();

Customer retcust = session.CreateCriteria().Add(Expression.Eq("Name", "Customer8")).UniqueResult();

The alternatives to ORM are Hand written SQL or LINQ or non-SQL approaches such as Cassandra and Big Table.

If you are interested in ORM software and Microsoft Enterprise Library then take a look and new Enterprise Library 5 and it’s  contrib projects at  http://entlibcontrib.codeplex.com/. It comes with Mapping Application Blocks that used with Query Application Blocks gives you an ORM solution.

Useful links

…And that was a sample of a regular technical presentation given within OCC – followed by tea & cakes.

Tips for streaming video with Amazon CloudFront + Flowplayer

Posted on by
Reply

Flowplayer is a Flash-based video-player that supports streaming video using the Adobe’s Real-Time Messaging Protociol (RTMP). Amazon CloudFront is a content-delivery network (CDN) tied in with Amazon’s Simple Storage Service (Amazon S3), and can stream via RTMP. Great! This is a simple-to-set-up, cost-effective, and reliable video-on-demand system.

Where you can get a little bit tangled up is the way the video resource is identified to the player. Following the recipe for Flowplayer with the RTMP plug-in, you need two values, the url property of the clip, and the netConnectionUrl of the plug-in. The second of these is the URL of the streaming distribution from CloudFront with /cfx/st added to the end, as in rtmp://s2xxxxxxxx.cloudfront.net/cfx/st .

The clip’s url property is based on its Amazon S3 object key.  The instructions in Amazon’s developer guide says mysteriously:

To serve MP3 audio files or H.264/MPEG-4 video files, you might need to prefix the file name with mp3: or mp4:. Some clients can be configured to add the prefix automatically. The client might also require you to specify the file name without the file extension (e.g., magicvideo instead of magicvideo.mp4).

Some experimentation indicates that with Flowplayer you add the mp4: prefix and can omit the .mp4 suffix. Also when they say ‘file name’, they mean the whole object key, including any slashes. So if the clip is stored on S3 as foo/bar.mp4, then the clip’s url property is mp4:foo/bar.

MCERTS

Posted on by
Reply

OCC software is being submitted for approval by MCERTS. This is the Environment Agency (EA) Monitoring Certification Scheme.

As OCC provides software for air quality monitoring, we have attracted interest from “MCERTS for Software” which is new. As the EA document puts it:

Problems with Data Management can have a number of serious adverse effects

Nothing new there. So what’s involved in MCERTS certification? It’s one of those happy occasions where a standard imposes reasonable and not too onerous restrictions on the engineer.

Working through the Generic Software Quality standard it’s mostly demands that any good practice would answer. Here are some samples:

  • The application developer shall apply change control procedure
  • There shall be configuration management
  • There shall be a system for reporting, logging and tracking software defects

and so on in this vein.

We had a similar experience with the Gambling Commission when producing software for a beautiful “Guess the Rugby League score” site.

Nice to see standards that help, not hinder.

3D PC desktops, 3D operating systems & 3D search… the future

Posted on by
Reply

Desktop concept

It seems that now as well as every new movie being released in 3D and the next generation of televisions also sporting three dimensions your PC’s desktop is next! In recent weeks a relatively modest company called BumpTop catapulted themselves into news headlines when they were bought out buy Google. BumpTop’s 3D desktop creations we’re of great interest to search giant google who have started to venture beyond their search expertise with Android operating systems for mobile phones, Chrome web browser and the forthcoming Chrome OS for PC and MAC. Google stepping into the operating system market is a logical but brave move. Taking on the current market leader Microsoft whom in preparation for this onslaught have significantly upped their advertising activities with the launch of Windows 7 and Internet Explorer 8.

BumpTop’s creation was not an operating system but a program that sat on top of your OS providing you with their funky fresh three dimensional approach to desktop design. Along with the added depth their desktop featured several new slick animations triggered when interacting with items on, or should I say in your desktop. Icons icons icons… pile them up and knock them down. Organise and arrange your files exactly the way you want using lasso tools to group files together.

But wait a minute! So far I’ve based this post on the assumption that Google will use BumpTop technology and techniques in their OS because that was the obvious fit. However, there could be something far more revolutionary on the horizon, 3D search. With Open GL 3D on the web is entirely possible with flash also being used to create dynamic environments and slick animation for many years now.

About 2 years ago Amazon created a concept site introducing on-line shoppers to a completely unique way of browsing and sampling products before purchasing them. Amazon’s concept website shopwindow.com demonstrates a very clever use of flash and much more visual online experience.

Amazon's ShopWindow site

Google themselves have already publicly dipped their toe in the water as it were by trying to make search a more visual experience and dynamic experience with Wonder Wheel. So perhaps Google’s acquisition of BumpTop will lead us into the next frontier of online search.

Google's Wonder Wheel

Choosing agile development

Posted on by
Reply

The oldest software process is “code and fix”. This actually works on small one-man projects, but as a system grows, bugs become harder to fix. A typical sign of such a system is a long test phase after the system is “feature complete”. Such a long test phase plays havoc with schedules as testing and debugging is near impossible to schedule.

The classic response comes from engineering, whose methods try to plan the software process in detail for a long time span. The goal of engineering methods is to define a process that will work well whoever happens to be using it.

In an attempt to strike a balance between these two approaches, “agile” methods appeared and current best practice at OCC follows an adaptation of an agile methodology.

Agile methods follow iterative development: frequently producing working software with subsets of required features.  This kind of adaptive process requires a close relationship with the client and encourages adaptive development. The advantage is that this lowers software risk – the client sees what they are getting early. However, the project needs to be held within the client’s business constraints – we are usually hired to deliver business critical systems on time and on budget.

At OCC we usually work on fixed-price contracts. Clients issue requirements, ask for bids, accept a bid, and then the onus is on us to build the software.  A fixed price contract requires stable requirements and hence a predictive process.

We cannot fix all of (time, price & functionality) in software projects. The usual agile approach is to fix time and price, and to allow the functionality to vary in a controlled manner. At OCC we fix price and functionality and manage time in a controlled manner – at our own risk. That is, we typically guarantee delivery of agreed functionality for an agreed price. We then work towards the agreed deadline. As software development is not a predictive process the deadline is at risk.

In practice, OCC accepts the risk of slippage on fixed-price contracts because we are good at estimating timescales. For large projects, we often advise breaking the project up into smaller contractual projects to contain risk for both parties.

This behaviour by OCC means our method is best described as an Agile method called Feature Driven Development[1] (FDD). Feature Driven Development separates into two distinct project phases:

  1. Pre-proposal (Develop an Overall Model, Develop Features List and Plan By Feature) is a “one time” process and leads to the project proposal. If the project initiation is long and complex this becomes it own small consultancy project on a time & materials basis.
  2. The second construction phase is iterative and proceeds in a [design by feature - build by feature] manner incrementally delivering the project with high client visibility.

We’ve been developing software since 1989 constantly enhancing and adapting our methodologies and perfecting our processes, enabling us to deliver original, robust and flexible IT soltutions.

Online video content using Amazon S3 for TaxTV

Posted on by
Reply

The conventional approach to making videos or other data available online is to buy a server and host it at an ISP. This requires up-front capital costs for the server, and development of systems to keep track of backups, redundant copies, and scaling up as your needs increase. An alternative approach is to use storage web services, such as Amazon’s Simple Storage Service, or Amazon S3 for short. Your files are stored on the same highly scalable, reliable, fast, inexpensive data storage infrastructure that Amazon uses to run its own global network of web sites. They only charge for storage you use (starting at 15¢ per gigabyte-month), so the costs start low and ramp up as you gain traffic. Your development time is freed up so you can spend more working on the more interesting aspects of your application.

TAXtv (http://taxtv.co.uk/) is a subscription-only monthly video of tax news and information. The episodes are viewable by subscription only, and the editing and production of the video files is contracted out to Video Inn Productions. OCC’s task was to provide a convenient way for Video Inn to upload the files to the web site and for the editors of the site to obtain a unique URL for the episode to include in the monthly mail-out. To do this we used the service from Amazon called Simple Storage Service, or Amazon S3 for short.

The Trouble with Videos

If a picture is worth a thousand words, a video is worth a million: less poetically, an episode of TAXtv weighs in at about 200 MB. You generally want to offer users a choice of sizes, so we could reckon on an episode being 500 MB. In the case of TAXtv, we can delete old episodes; a site with videos that do not expire would need to budget for a lot more storage.

There are two other limits we may bump in to: monthly download caps, and maximum data rate. Assuming subscribers watch the video once each, we can multiply the number of subscribers by 200 MB to get the monthly download requirement. Someone watching in real time needs to fetch the video data at around 1 Mb/s to avoid pauses for buffering. With a monthly subscription, the majority of views can be expected to fall in the two days after an episode is released; worse than that, we can expect them to fall mostly in office hours. So we can estimate the necessary data rate by dividing the monthly bandwidth by 16 hours.

Subscriber count 100 1,000 10,000 100,000 1,000,000
Monthly bandwidth/GB 20 200 2000 20,000 200,000
Data rate/Mb/s 3 28 280 2,800 28,000

These are just rough figures, but they show that 1000 subscribers would be pushing the limits of a shared host, 10,000 subscribers exceeds the capacity of a dedicated server with 100 Mb/s Ethernet and 100,000 exceeds Gigabit Ethernet: it will need a server farm, not just one server.

Obviously you don’t expect 100,000 subscribers on day one. The headaches start because you need to worry about future requirements while deploying even the small-scale version. This entails buying server hardware before you have the subscriber numbers to pay for it. You also need to plan ahead for when you need to scale up to a server farm rather than a single server.

Amazon S3 and Amazon CloudFront

Obviously Amazon have had to solve this problem for their own massive datacentres, and they are willing to sell their solution as a service, Amazon S3. The idea is to pay just for the capacity you use, without needing to know the details of hardware and configuration.

S3 objects can be downloaded via normal URLs, or for greater performance we can use Amazon’s content-delivery network, Amazon CloudFront. This gives each person downloading the file the lowest-latency, highest-bandwidth connection to the data, using Amazon’s edge servers. CloudFront also supports streaming, using the protocol understood by Flash video players.

We developed a small web app that presents a form for uploading video files directly to Amazon S3. This is great because it saves us the trouble of handling the uploaded files and then copying them to S3 ourselves. The form includes a digital signature which means we can allow Video Inn to upload videos without giving them the keys to the S3 account. Our app stores the URLs of the uploaded files against the episode number, and then produces a URL for inclusion in the monthly mail-out.

The episode page uses the same embedded video player as before, Flowplayer 3.1. The difference is that we activate its streaming plug-in, and supply URLs referring to our distribution on Amazon CloudFront instead of on our own server.

Bottom Line

Uploading and downloading the videos during development cost us about 30¢, which is a lot easier to pay up-front than £5000 for a dedicated server and hosting. Not only that, but the development time was reduced by eliminating the need for us to plan and deploy a scaleable solution, or even to purchase and deploy the streaming server. The existing shared hosting will suffice for the episode page and the editing app.

As the number of subscribers increases we would expect the Amazon CloudFront cost to increase accordingly:

Subscriber count 100 1,000 10,000 100,000 1,000,000
Monthly bandwidth/GB 20 200 2000 20,000 200,000
Monthly CloudFront cost $3 $30 $300 $2500 $17,000

These figures are approximate and ignore a few dollars spent on S3; the important thing is that you don’t have to pay for 1,000 subscribers’ usage until you have 1,000 subscribers.

iPad, iAd and Me

Posted on by
Reply

As of yet the iPad is not available to buy in the UK, but should you be thinking about it? If you have a public-facing web site, you might be wondering, Do I need an iPad version of my site? How will I deliver content without Adobe Flash? Do I need an iPad app?

newscom

Because the iPad can display full pages at close to the size of a laptop or desktop screen, there is no need for a specific version of the site for the iPad the way there is for a phone like the iPhone. Instead, it should be cost-effective to tweak an existing site to display well in the iPad The main difference will be that hover effects, small link targets, and and small text will not work well with fingertips. So we predict a fashion for less cluttered, fatter-linked, iPad-friendly designs in mainstream web pages.

The big deal for sites showing video, menus, or slide shows using Adobe Flash is that the iPad does not, and will not, display Flash (or indeed use any plug-ins at all). But it’s more than that: the upcoming iAd system, where Apple hosts ads for display in iPad and iPhone apps, is implemented using HTML5.

The demonstration in the iPhone OS 4 event showed their vision of ads resembling the mini-sites that are today often implemented with Flash (downloadable wallpapers, video clips, character notes, and all that jazz). When iAd takes off, advertisers will be thinking that if the iAd is in HTML5, then the main web site might as well be as well.

All of which is lighting a fire under HTML5 support on the web as a whole. If your site is aimed at people at home, then you will want to support iPad readers, and you will need an HTML5-savvy web site. YouTube and other video-hosting sites already offer an HTML5 alternative; it seems that in future HTML5 will be mainstream and Flash will be the alternative for legacy browsers.

Sites aimed and education, government, and corporate users will be under less pressure to transition to HTML5: they are more likely to be read on a conventional computer, and Microsoft’s failure to persuade IT departments to upgrade from IE6 means that HTML5 will only reach a minority of readers.

The biggest problem with replacing Flash with HTML is that we don’t yet have designer-friendly tools like those Adobe sell for Flash: you need a collaboration between designers and programmers. At OCC, we are building our HTML5 and our design expertise, and have been producing dynamic HTML interfaces rather than Flash for some time now in anticipation of this transition.

The question of whether you want to create an iPad app for your site is a more complicated. There is a lot of experimentation happening right now with content delivery through specialized apps: the New York Times and other publications are selling apps that they hope provide a more compelling reading experience than their web site can.

The problem is that an iPad app will only run on iPad: it has to be extra work, using a different programming environment, over and above the work on a web site (or whatever) — and in the end, it will only reach a minority of readers for the next few years. The iPad platform would be very attractive for vertical applications (e.g., electronic patients notes for hospitals) but in many cases cheaper and less desirable hardware will be preferred. The successful apps to date are games (which are multi-platform as a matter of course) and productivity apps from small firms that specialize in app development.

So for most of our existing customers I would wait and see how the app market turns out. Our customers’ video sites are aimed mostly at education and commercial sectors, where the transition to HTML video is not at all urgent, so the only action required in the short term will be glancing at their existing site in an iPad to verify that its design works in the new screen size and with fingers instead of a mouse.