Citynomadi HTML5 application

Hello!

For some time, we have been developing HTML5 applications in the side of our native apps. These applications are directed for the users who haven’t got time or need to install programs to their mobile devices. With this new application, we are striving to bring our service a bit closer to the user and make it even handier. Of course, the best benefit for our service you can still get from our native applications. However the aim of HTML5 applications isn’t to replace the native ones, but create a new way of utilization in different situations.

Now we are introducing the first version of HTML5 based application that is optimized for as many mobile browsers as possible. So far we have tested the application on iOS, Android and Windows Phone 8 devices. Through testing we have managed to remove various platform-specific problems, and we don’t see any reason why the technology wouldn’t work on other platforms as well.  Naturally, we need lots of feedback on how our application has functioned on each platform.

For the first version, we have minimized the number of features and we have basically built the application so that the existing routes would show up correctly. In the future we will also add some extra features as devices get faster and more robust.

Route searching

First, we will go through how the route search function works. The user interface quite simple and it pretty much resembles the one used in Citynomadi.com. In the future, there will definitely be some improvements to the UI, as we continue to eliminate the problems caused by small screens.

In the text field you can write any keyword that pops into your head, for example a name of city. Our database contains the place-names for the location coordinates of the route. You also might find some routes even by typing a name of a district. However, the database doesn’t know everything, but at least the city names are included.

You can also different kind of searches, e.g. according to the popularity of the route. By switching on the “Show routes near me” switch, the application retrieves all the routes located within one kilometer radius.

Try the route search on m.citynomadi.com or scan the QR-codes provided below.

search

Map view

We have strived to simplify the map view, so that there’ll be enough space even on a small screen. Compared to the Citynomadi.com map view, we have sifted out some features, but in the future those features will be also brought to the HTML5 application, given that they will work properly in all devices.

Our HTML5 application will not automatically start figuring out your current location. To allow the app to use your current location, you will have to press the button that looks like a crosshair on the top-left side of the screen. After that, your browser should ask you if it’s OK to use your current location. The button that looks like a knot returns you back to the route searching. At the bottom of the screen you’ll find Layer and Map menus, which are familiar from our other Web-UI’s. By clicking a Layer button you’ll get a list of all POIs on the route and by clicking a Map button you change the background map. Routes may have a different number of available background maps, this dependable on the route creator’s preference.

After pressing the Location icon, our dog logo-icon  (citynomadi_black) pops on the screen and points out your current location. For route creator it’s possible to change this icon, so don’t panic if you see some other kind of an icon – everything’s probably alright! We call this icon “Spotty”.

mobileview

When you click the point of interest (POI), a speech bubble will pop up above it. From the bubble you can read the title of the POI. When you click the speech bubble, you can read information stored to a POI. POIs can contain text, pictures and videos. From a POI view, You can also open the Google maps, if you need any further navigational aid to find this particular POI.

mobileview_poiauki

Adding the app to iPhone’s / iPad’s Home screen

Safari browser allows you to add a “bookmark” on iPhone’s / iPad’s home screen by using the “Share” button. By using the “Add to the home screen” functionality you can access the route search or any route directly from the home screen of your device. Remember, that this is only a link to the application, so it won’t work in offline mode yet. We are developing new features that allow user to save data to the device. This way, after loading the route data to the device, routes would also be available offline.

ioskuvakkeet

QR-codes

HTML5 application offers you completely new way to take advantage of Citynomadi services through the QR-codes. Here’s a few examples.

Code 1.

Opens the Route search view:

qrtosearch

Code 2.

Opens the route directly:

qrtotamperetop

Code 3.

Opens the Route search view with a keyword “Helsinki”:

qrforkeyrodhelsinki

Code 4.

Opens the search to the client’s wall. In this case the client is Southeast135°:

qrsearchtokaakkowall

Summary

HTML5 application is available on m.citynomadi.com. If you have some questions about using the QR-codes, please contact us: https://citynomadi.com/fi/yhteystiedot. We’d be glad to answer your questions about the HTML5 app and its possible ways of usage.

Also, send us some feedback! The mobile environment is very heterogeneous in terms of operating systems and software platforms. Because of that, we will never have enough time to take everything in consideration, nor do we have enough resources to test all features thoroughly. All kind of feedback is much appreciated, whether it is about making the routes or the about the apps.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s