Measuring the speed of resource loading with JavaScript and HTML5

This is a follow up article to Measuring site performance with JavaScript on mobile, I suggest you read it before you continue. In the previous article I talked about the Navigation Timing spec, here I will talk about the Performance Timeline and Resource Timing specs and how they work in IE10, the first browser to implement them. I created a page that shows some of the data available and a library that generates a HAR that you can later analyse.

Continue reading

Creating A Custom HTML5 Form Validation

In his blog post on HTML5 forms and IE10 Mobile, Andrea explained HTML5 forms and what is new in Internet Exporer 10 Mobile, so you should now have some understanding of HTML5 form validation. To summarize, HTML5 eases the pain of writing extra logic to validate users’ form inputs, letting you create usable forms with a little or no scripting.

In this tutorial, I will show you a practical example of creating a custom validated form  with CSS3, web fonts, and a bit of JavaScript (or not).
Continue reading

Measuring site performance with JavaScript on mobile

There is a lot of talk around responsive Web design being too slow or too resource intensive and that other methodologies can achieve better performance. I don’t want to go into the details of which approach is better because I think different scenarios require different solutions. What is certainly true in all cases is that a Web site or app that loads faster is better than one that is slow. Companies like Google, Gomez and Akamai have all published papers and survey results showing how speed affects user perception of a service from your desktop computer and even more on a mobile device (KISSmetrics has also drawn a nice infographic for the lazy ones). This is the first article and another one will follow shortly. Continue reading

HTML5 forms (and IE10 (Mobile))

One of the many improvements introduced by HTML5 is around forms, users hate filling forms and developers hate validating the data submitted. HTML5 makes these tasks a lot simpler.
In this article I will not talk about what HTML5 added, but I will rather focus on what is new in IE10 mobile, i.e. the browser that comes with Windows Phone 8. At the end of the article I have collected a few useful links that cover HTML5 forms at large and provide more examples and complete support tables. All the code examples are meant to be cross-browser, unless specified. Continue reading

Nfc Interactor + NDEF Library for Windows Phone 8

As one of the world’s first Windows Phone 8 applications, Nfc Interactor is now available for download in the Windows Phone Store.

This is an incredibly useful tool for developers, as it allows you to experiment with NFC on your phone, without the need to write your own code right away.

Nfc Tool for Developers

Nfc Interactor can read and parse NFC tag contents. Even better is that you can use it to easily create and write your own tags. This allows you to for example test how your WP8 app reacts to LaunchApp tags, or if it works to launch your app through your own custom URI scheme, probably even with parameters that are written to the tag. More details in my article: How to Launch Apps via Proximity APIs (NFC).

Nfc Interactor also supports peer-to-peer communication for sending messages to another device (using the standardized SNEP protocol). As you can define any kind of NDEF message in the editor, you can test how the other phone will react to incoming messages; or – in case your app is listening to incoming proximity messages – you can test how your app will react; both to planned messages, as well as if your app stays stable if it receives unexpected messages via NFC.

Open Source Nfc Code for Developers

In some scenarios, you will need to have more control over the actual NFC message contents than the Windows Proximity APIs will provide to you. Reading, understanding and implementing the complex NDEF message specifications of the NFC Forum will cost you many hours or even days of precious work time.

To make your life easier and get your new NFC apps quicker to the market, I’ve released the heart of Nfc Interactor as an open source component: the NDEF Library for Proximity APIs.

The library is collection of C# classes that works both for Windows 8 as well as for Windows Phone 8 apps. You can use it to create NDEF messages containing one or more NDEF records, as well as for reading and parsing messages you got from peers or a tag.

Using the library will for example enable you to write a cross-platform LaunchApp tag, which contains multiple records: a Windows LaunchApp record for Windows (Phone) 8, a cutom record type (external RTD) for Symbian, plus an Android Application Record for Google Android. I’ve published more details about how to get this to work at the Microsoft TechNet Wiki.

Getting Started

With NFC now being an important part of both Windows Phone 8 as well as Windows 8, you can write exciting new apps, as well as integrate NFC into your existing apps to expand your customer base or to add unique new features.

The article How to Acquire and Publish Content from / to NFC Tags and Proximity Peers contains a short and concise overview of the Proximity APIs and how to put them into use.

NFC on the Windows 8 Platform

The Proximity APIs enable you to create NFC apps for the Windows 8 platform. Designed to be easy to use and streamlined for the most common use cases, the APIs allow integrating powerful features into your apps in a very short time.

At the NFC Congress in Hagenberg, Austria, we’ve just presented the first overview of those APIs during our Developer Workshop that was opening the conference.

Windows 8 Platform NFC Development Slides

To get an overview of the new Proximity APIs, the technical presentation will introduce you to possible use cases along with a few code snippets that will help you with getting started.

The slightly shortened version of the technical part of the session from the congress is now online for your viewing and downloading pleasure at Slideshare and includes the following contents:

  • Subscribe to proximity messages
  • Publish messages to peers and tags (WindowsUri and NDEF records)
  • Parse & create NDEF messages (including Smart Posters)
  • Launching apps on own and peer devices
  • Registering for custom URI schemes and protocols
  • LaunchApp tags to directly start the app
  • Peer to peer: quick data exchange and long term connections with Wi-Fi Direct / Bluetooth
  • Establishing peer to peer socket communications simply by tapping two devices
  • User Experience recommendations for peer to peer apps

NDEF Library for Proximity APIs

The Proximity APIs make it easy to work with URIs, but lack ready made classes for directly handling NDEF records and messages. The NDEF Library for Proximity APIs extends the framework in those areas and allows you to create standard compliant NDEF tags, as well as reading and parsing data out of the raw byte arrays you get from Proximity APIs.

Currently, the library supports Smart Posters, URI and Text records – with more record types planned to be added in the future. The classes are released under open source license (LGPL, as they’re based on the Qt Mobility Connectivity module), allowing you to directly integrate them into your own project.

Instead of having to read through pages of technical specs and handling the bits and bytes of the records manually, it’ll only take you a minute to integrate the library into your project and start working with NDEF records.

You can download the library at ndef.codeplex.com and get more information at nfcinteractor.com.

Nfc Interactor for Windows Phone 8

Also at the conference, I’ve announced that Nfc Interactor will be available for Windows Phone 8!

The powerful app is currently available for Symbian and the Nokia N9 and allows you to analyze low level information about NFC tag contents, as well as writing your own tags with a flexible and dynamic composer interface.

The first live demo was shown at the conference, more information will be available online in the near future at nfcinteractor.com!

In-application Purchase API for Series 40 explained

Hi All

If you are thinking about monetizing your Series 40 application but reluctant go through those numerous In-application Purchase API’s boring guides, take IAP application template and use it in your project with minimal adaptation.

Save your time, focus on your project and leave IAP routine for me!

That is the main goal of the IAP application template project. Please try it and let me know how I can improve it.

Easing your digital life :)
Igor

 

YouTube player with draggable playback controls in Java ME

I was always wondering, if streaming a YouTube video would work on Nokia Devices with Java ME. I was pleased to find out that it did! And it did, very well, over a 3G connection on the stunning screen of Nokia PureView 808.

The idea is pretty simple. All you need is a Canvas with a YouTube logo, a Video Window for displaying the stream and playback controls for starting, stopping fast forwarding or rewinding the video. The cursor is draggable so that it offers the same user experience as the standard YouTube player.

This wiki article, explains how.

 

Series 40: SVG resources localization

Hi All

30.07 I started porting FifteenPuzzle game project to Series 40 platform and today 10.08 that work is completed. Having promised to complete the project in 5 days I observe the golden rule of project management in action : multiply your project estimation three – two times before passing the estimations to your customer :)

But nevertheless… Meanwhile I have explored Scalable Graphics in Series 40 for possibility of applications localization and created a wiki article.   FifteenPuzzle game project now contains SVG main menu and text in SVG document is translated to English , Finnish and Russian. The whole the application features list is the following:
1) main menu SVG
2) device language detecting and supporting automatically
3) SVG text localization
4) supports screen sizes:
240 x 400 Asha 31X
320 x 240 Asha 30X
240 x 320 Asha 20X
128 x 160 Asha 1XX
5) Disables SVG automatically on low-range devices (Asha 1XX)

Check it out

Cheers!
Igor

 

 

game development for Series 40

Hi

30.07 FifteenPuzzle game project porting to Series 40 platform started. I follow step-by-step tutorial Rapid game development for S40 with NetBeans Visual Designer and Game Builder just to check the article. If i find error in the article I update the article as well

I hope to complete FifteenPuzzle game project porting this week. 5 days for game development include resource creation — it is possible. I found Series 40 platform APIs are quite easy and logical. And that should be expected considering Java ME long history, strong community and technology leaders supporting.

Try yourself!

Cheers
Igor