The Technology Studio

My name is Mark, I am 23 and I am the latest developer at The Technology Studio. This blog post aims to give you a basic understanding of the development of metro style applications using Microsoft’s new JavaScript and html framework.

The main advantages of using the framework are immediately evident:

• Most web developers already have a strong foundation in html and JavaScript. These skills can be translated to the desktop app realm without too much trouble (arguably!).
• JavaScript already has solid support for asynchronous web requests (xmlhttprequest) which comes in handy if you want to integrate Ajax or web 2.0 mash-up features e.g. Twitter.
• If you start with one of Microsoft’s project templates (for example, Grid application) the Windows 7/8 look and feel has already been set up for you. This means you can be confident the application will respond smoothly to touch and will look good on a wide variety of screen sizes.
• The framework has clearly been influenced by knockouts binding feature so if you are familiar with this then you shouldn’t have too much trouble getting used to slightly different syntax:

Spot the difference!

Microsoft:

<div data-win-bind="innerHTML: trafficImage"></div>

Knockout JS:

 <div data-bind="html: trafficImage"></div>

• Furthermore, the full range of debugging tools are now supported for JavaScript within Visual Studio 2011. This thankfully means no more JavaScript alert boxes or web browser debugging is required to inspect code.

Some small quirks that I have noticed.

The following line of code DID work:

trafficImage: '<img src="' + src + '" class="resize" />'

The following line of code did NOT work:

trafficImage: '<img src="' + src + '" class="resize"></img>'

At a guess, the framework doesn’t seem to appreciate strict xml structure when you write your html.

An Image Caching Issue…

I had trouble trying to stop the traffic images from being cached when I wanted to refresh the images. This might be a positive thing for another project but TFL defines rules for the public display of the traffic camera images.

One of these rules state:

‘Feeds must be grabbed and displayed with the same frequency as that in the <RefreshRate> tag.’

To avoid caching I tried the following possible solutions: (all to no avail)

• TFL doesn’t let you append a unique query string to the request URL.
• Attempted to access the DOM element and change it’s ID to a random number when a refresh is due.
• Destroying the contents of the element and rebuilding it also did not refresh those darn images.
• <META HTTP-EQUIV=”PRAGMA” CONTENT=”NO-CACHE”> This also didn’t help me.

Perhaps I am missing something very simple here. If any one knows a solution please leave a comment.

In conclusion, I look forward to developing less trivial applications with this new technology as there are some definite upsides, particularly, the improved debugging and intellisense support for JavaScript in VS2011 and the JS Knockout-esque data binding. However, I plan to wait until Microsoft has ironed out some of the quirks and built up more comprehensive documentation for WINJS.

Next time, I will attempt to integrate these cameras into a map.

To get started with this development go to: http://msdn.microsoft.com/en-us/windows/apps/br229516

We are delighted that the website we’ve been involved in developing for the past 5 years GoLearnTo.com continues to go from strength to strength and this year has been nominated for no less than 3 British Travel Awards.

The categories are:

1) Online tour operator of the year

2) Best specialist singles tour operator

3) Small tour operator of the year

GoLearnTo.com are learning holiday specialists and sell a wide array of inspired holiday courses where you can learn anything from yoga, photography, painting and cooking to surfing, horse riding, languages and even gladiator fighting.
It’s great to hear that a website we have been involved with developing for 5 years now has made it into such prestige award categories and we wish them every success.

Winning relies on votes from the public and if you like the website we would love any support you can offer. In addition, if you register to vote you’ll automatically be added to the prize draw to win some amazing holiday prizes.

To vote for GoLearnTo.com (and we really hope you will!), please follow the steps below…

1. Click here to open the British Travel Awards website

2. Fill in your details

3. Our categories are the FIRST and THIRD boxes you see so please click on them to expand the sub-categories…

i) WHO ARE THE BEST TOUR OPERATORS FOR SPECIALIST HOLIDAYS

Under here you’ll find a sub-section for ‘BEST SPECIALIST SINGLES HOLIDAY TOUR OPERATOR” (its the last one in the list)
Please vote for GoLearnTo here…

ii)  The third box down says ‘WHO ARE THE BEST OVERALL TOUR OPERATORS (OF THE YEAR AWARDS)’

Expand this box and the first one you see is ‘SMALL TOUR OPERATOR OF THE YEAR’
Please vote for GoLearnTo here…

The third box you see is ‘ONLINE TOUR OPERATOR OF THE YEAR’
Please vote for GoLearnTo here…

4. You can either skip the rest and scroll down to the bottom to click submit for your chance to win or if you have some time, feel free to run through other categories and fill in your favourites…

Thank you for voting!

As we engage in more and more projects in the healthcare sector we are constantly keeping an eye on the way the digital marketing landscape develops. Of course, many of our clients operate in other sectors (and for many of them online is their main marketing channel), so it is often interesting for us to contrast their approach to that taken by our healthcare clients (who often consider digital as a bolt on to their “core” marketing).

Here at The Technology Studio we have over 25 years pharmaceutical expertise and our experience of delivering digital projects within that environment can be frustrating with  irrational objections sometimes voiced by Medical, Legal and Compliance departments (among others).

So are things changing for the better in healthcare? Is a digital strategy becoming part of the norm rather than seen as a “pilot”?

We found this recently published report from eCRM Consultants Across Health a fascinating insight into the current  mind-set amongst executives in the Life Sciences industry.

Some of the stats that stood out for us include:

• 45% of respondents stated that lack of eBusiness strategy is in the top 3 barriers to digital marketing
• 30% of respondents say that lack of internal knowledge was a major barrier to digital marketing
• Less than 10% of companies engage in mobile marketing as standard practice
• 45% of companies are engaging in mobile marketing pilots
• 77% don’t measure the impact of digital activities

So what is our conclusion from this?

It seems clear that there is a desire from healthcare companies to improve their digital marketing strategy and comparisons made in this study with previous years suggest things are moving in the right direction.

We were particularly interested by the mobile stats. A study by Morgan Stanley suggests that mobile browsing will exceed desktop by 2014 and we are certainly seeing an increasing demand for our mobile solutions. According to this report it seems that whilst few healthcare companies currently have a mobile strategy, the number of pilot’s in place suggest it is hitting their radar. Of course, are these pilots simply the development of an iPhone app (which seems to be the “in thing” to do right now) or are companies taking a wholesale look at their mobile strategy? We also hope that more than the 33% who currently measure digital ROI will be measuring the return from these pilot projects!!

The statistics on internal barriers suggest that Life Sciences companies still need to be given strategic direction (either by consultants or their agencies) as in-house expertise is rare. In our experience, the incumbent Advertising, PR or Medical Education agencies who operate in the healthcare sector often lack the necessary knowledge of the digital world as well. Perhaps it is time for the industry to look outside of the Life Sciences graduate pool for the next generation of Marketers?

Chris

Twitter:@chrismfinch

Thanks to Richard Sharp at Gadgets and Gizmos who wrote a great blog article about us being at The Gadget Show Live.

He wrote …

“Neil from Earthware admitted that the ‘Eye’ is really just a party piece and not what the puffersphere was built for. It’s actually a high end advertising ‘orb’ used at tradeshows and events. Neil showed us another interesting use for the Puffersphere, a complete video of the earthquakes leading up until the fateful one that caused the Tsunami and beyond. Although watching the events on the sphere was a little eerie it does show the power this type of tech could bring to research and development and educational institutions.”

I hope Richard’s prediction of the future uses of the PufferSphere hold true – the future is bright, the future is spherical!

Neil

You will need:

• 1 x PC (which I assume you already have)
• 1 x Microsoft Kinect (about £120)
• 1 x Puffersphere (worth quite a lot, but you can hire them from Pufferfish)

Total cost: more than a few week’s pocket money…

There was a lot of excitement in the Technology Studio this week when a nice man with a van dropped off three large flight cases containing something rather special: a spherical display system called a Puffersphere. Pufferfish, the company which invented them, has been kind enough to lend us one for a week.

Things got even better when the man from Pufferfish turned up the following day, helped us put it together and took me through a slightly mind bending set of information about how to use the thing. He brought us some donuts though, so that made it a lot easier to deal with.

Although the brief I was given was to come up with something we could use as part of our upcoming appearance at the 2011 Association of the British Pharmaceutical Industry Annual Conference, the inner geek took over and we quickly decided the first project would be a massive eyeball.

To get an image onto the Puffersphere you start off with a panoramic image and use a polar distortion to get it into a form that the projector’s super-special Super Umami lens can then display onto the inside of the sphere. Before and after look like this:

I’ll post some more technical detail on this later – but the short version is that the top of the origin rectangle ends up as the centre point of the circle, and the bottom of the rectangle ends up as the outside of the circle.

Once you have the image it’s a simple matter to get it into a full screen WPF app, which can then be displayed on the sphere. The centre of the image ends up as the top of the sphere, and the edges converge on the bottom. This means that to get the image on the sphere rotating in the horizontal plane is as easy as applying a WPF rotate transform to the image.

For the next step, the Kinect. The process for getting this up and running on the PC, using OpenNI is well documented elsewhere, so I won’t repeat it. The OpenNI framework includes a user generator that uses the feed from the Kinect’s depth camera to detect individuals within the scene. Once that’s all in place, you can effectively convert the real-world co-ordinates of the user (given in cartesian co-ordinates) into polar coordinates, and use the angle to rotate the eye correctly.

As has been pointed out – not the most ground breaking use of a Kinect ever, but it does show how putting two pieces of technology can be combined to create something new, interesting and – although not immediately apparent – with genuine commercial applications.

For the interested, I’m keeping the code I write for this in the Earthware Github account. You can run this without having a Puffersphere, but you will need a Kinect. I’ll be putting up some more posts in the next few weeks about this and other cool and useful things we do with the sphere and Kinect.

We also took some video of the eye in action:

After we posted the video, we were very happy to see that it was picked up by Engadget. Many of the comments echoed something the more geeky among us had been thinking from the start: “we want the eye of Sauron”. And we’re nothing if not responsive to our customer’s requirements:

@jon_george1

The award winning GoLearnTo website has had a design update recently and we think it looks great – even if we do say so ourselves!

After some market research GoLearnTo decided that their website needed to be more focused on their target demographic. In addition they wanted to widen the site from 800 pixels wide to 1024 pixels wide, considering that now less than 1% of people use 800×600 displays. Yes, that’s less than 1%!

See more information about browser display statistics.

There are now a  lot more jQuery effects, such as slider panels and more aesthetic and functional photo galleries. These kind of things are great as they give more information to the user as well as being relevant for search engines. They can also add a bit of flashiness to a site which a lot of people generally like!

Check it out and see what you think!

We were recently approached by Bizspace to completely redesign (in their words!) their old, tired and basic website!

Their previous site was falling well below par on all three of the most important things that a website needs to get right…

SEO (Search engine optimisation)

Unfortunately the site was built with minimal search engine optimisation consideration in mind. There were very few pages with a serious lack of detailed, relevant content, as well as some other more serious issues such as using images for text headers. Without spending the required time and effort on SEO you are negating much else of what you do on a website – because nobody will ever find it!

Website Usabillity

Clarity is the name of the game here – not making people have to think! Unfortunately the navigation through the site was not clear and neither were the most important calls to action on each page. Always remember to keep things simple and clear and ensure the things you want people to do on each page are easy to see and understand.

Website design

Aesthetically the design was below average. I say it all the time but people will make up their mind within seconds of visiting your site on who you are, what you stand for and whether they trust you. A clear professional design is extremely important to instantly reassure their subconscious that you are worthy of their trust.

But, it’s all of them working together that’s the key!

Getting one or even a couple of these things right is a good start, but it’s the combination of all three together that we here at The Technology Studio believe is the real goal. It’s not good enough to have a fantastic looking site if nobody knows how to use it. There’s no point having  a site with search engine optimisation tuned perfectly if it looks unprofessional and shabby as people will go elsewhere. You see where I’m going here!

With our help the new Bizspace website has released to much praise in each of the areas above. The proof as always is in the pudding however! Their previous site achieved half of the visitors that the new site achieves, but it’s the site goals that are really interesting. Previously the old Bizspace site achieved an average of just 4 contact forms per week. It is now achieving an average of 40. That’s a ten fold increase!

As I am sure you will be aware from our site we have lots of friends and clients in the pharmaceutical industry and one of our best friends (who will remain nameless to protect the guilty) sent this joke through this morning.

Here’s the joke ….

The British Medical Association has weighed in on the new Prime Minister David Cameron’s health care proposals. The Allergists voted to scratch it, but the Dermatologists advised not to make any rash moves.  The Gastroenterologists had a sort of a gut feeling about it, but the Neurologists thought the Administration had a lot of nerve.  The Obstetricians felt they were all labouring under a misconception.  Ophthalmologists considered the idea short-sighted.  Pathologists yelled; "Over my dead body!" while the Paediatricians said, "Oh, Grow up!"  The Psychiatrists thought the whole idea was madness, while the Radiologists could see right through it.  The Surgeons were fed up with the cuts and decided to wash their hands of the whole thing.  The ENT specialists didn’t swallow it, and just wouldn’t hear of it.  The Pharmacologists thought it was a bitter pill to swallow, and the Plastic Surgeons said, "This puts a whole new face on the matter…."  The Podiatrists thought it was a step forward, but the Urologists were pissed off at the whole idea.  The Anaesthetists thought the whole idea was a gas, but the Cardiologists didn’t have the heart to say no.  In the end, the Proctologists won out, leaving the entire decision up to the a*******s in London.

However, if you want a serious view on the British Medical Association’s view on the government’s plans, please refer to the article on the BBC website - http://www.bbc.co.uk/news/uk-politics-12203000

Our solution to a common problem for Web Developers

At The Technology Studio we have lost count of the number of times we’ve been approached by potential clients with a brief that consists of nothing more than “we need a website – how much will it cost”! Even the better briefs we receive are often no more than a Word document listing the content the client could put on the site.

In our view this is like asking a builder to quote on an extension without telling them how may floors, rooms, bathrooms, windows or doors you need. Of course in the building trade this is used by some of the less scrupulous builders to their advantage as each additional feature that the client asks for is met with a rub of the chin, a sharp intake of breath and the response  “that’s going to cost you – you didn’t mention that when I quoted”. Whilst this might work for cowboy builders we prefer our clients to want to work with us again! For this reason we only ever provide  a quote once we have built (or been given) a full website schematic.

Of course often the client simply doesn’t know exactly what they want and extracting this information from a busy person with many other priorities can be a tricky process.

I read a good article in Smashing Magazine late last year that reviewed a number of approaches taken by web developers to extract the right info from clients  - well worth a read if you are compiling your own questionnaire. This gave me the inspiration to review the questions we ask our clients - the results of which are below:

1. What business objectives do you have for your new website? 2. How will you measure the success of your website? 3. Who are the target audience for your website? 4. What actions would you like your target audience to take on your site?

5. What other marketing activities will be supporting your website?

6. What information do you want to provide your target audience and in what format?

7. Have you got any plans for attracting your target audience to your site?

8. Who are your main competitors and what are their website addresses?

9. Are there any websites in your field that you like and specifically what do you like about them?

10. Are there any websites in your field that you dislike and specifically what do you dislike about them?

11. What content do you have that can be used on your website?

12. Have you done any keyword research?

13. Do you have any other digital presence?

In future we will add this to The Technology Studio website for any enquirers to fill in. If you would like a copy of our questionnaire contact us at info@thetechnologystudio.co.uk.

As we have previously mentioned (throughout our site) is that we know a bit about commercial property in the UK.  With NovaLoca being one of our websites and having grown from being nothing to the second biggest commercial property search engine in the UK with nearly 100,000 visitors a month in three and a half years.  We have also recently developed the NovaLoca iphone app and have other apps and projects in the pipeline.

We also like using cool new technology and so rather than “Death by Powerpoint” we decided to put a credentials presentation together using something we were recommended (Thanks Nick Merryfield) called Prezi (www.prezi.com).  While it takes significantly longer to put together the content we really like the impact when we use it.  I then noticed we might be able to embed it in our blog and so I thought I would have a go (I am not a techie at all).

See the results of our commercial property technology and website credentials in the Prezi presentation below.

If you would like to chat through any of our client stories and see if we might be able to help drive your commercial property business through technology then please get in touch.

Neil