Harnessing GPS (Location Services) within mobile applications

November 15th, 2014 by Hubert Yap

In this post PC era, large numbers of people now use smartphones and/or tablets to connect to each other in realtime because, unlike PCs, smartphones and tablets are not locked down in one location. Millions of people now carry a smartphone in their pocket (or tablet in their bag), pull it out anytime, and within seconds use it to chat with their friends/families, check what is on the news, find out what is causing the current traffic jam, share a photo of what they are experiencing, etc.

Mobile Apps and Location Services

One particular feature of smartphones and tablets that takes advantage of our mobility, is Location Services. Location Services allows a smartphone/tablet application to determine the device location via wireless connection or GPS and send it back to a server. This article will cover how Location Services can be useful for users and businesses alike, challenges in retrieving the device location, and how to address those challenges.

From a user point of view, Location Services allows them to send their location and receive specific information in return. Take for example the Google Map application. By using Google Map, users can send their device location and receive information about their whereabouts. This feature is particularly useful when we are travelling to a place we have never visited before. Generally people use Location Services to receive information that may only be relevant when they are at a specific location (i.e. nearby restaurants, local weather, nearby traffic congestion, movies in nearby cinema, friends who are nearby, etc).

From a business point of view, Location Services can be used to promote discoverability. An app can be configured to send specific information when a user is in a particular area. For example, if a business has a specific product catalogue for each city, their app can show the correct product catalogue to each user by retrieving the users’ location beforehand. Location Services can also be used to determine where business or consumer activities took place. This data has a wide range of uses.

All benefits come with drawbacks. For Location Services, one of the major concerns is battery life. If an app runs down the battery life of your device, you will limit your use of the app. That’s obviously not an option if the app is being used to carry out your job.

Wireless and GPS can only give a rough estimation of where the user is located. Therefore an app sometimes need to retrieve the users location 2-3 times in order to achieve better location precision. The longer we want the app to keep retrieving user location, the more battery power it will consume. This is one reason why a map application drains a lot of battery power. A typical map application needs to constantly retrieve the user’s location because the app is most often used when the user is walking or driving. It is important to achieve a balance between the battery power consumed and the location precision required. For example, if the app only needs to find which city the user is currently in, it can simply define a location precision of about 5 kilometres. Doing so will reduce the amount of battery power consumed compared to a location precision of a few hundred metres.

Another challenge that affects battery life is whether the app uses wireless, GPS, or a combination of both. GPS is more precise and faster when it comes to retrieving user location and is therefore a more recommended approach if your app needs to constantly updates the location. However, GPS is not suitable to retrieve user location when the user is inside a building due to the signal attenuation caused by construction materials. In such case, the app can only retrieve user location via the wireless network, assuming the user device is connected to one.

If the application needs to be able to retrieve user location in both indoor and outdoor, a combination of wireless and GPS is required. The app can be configured to use primarily GPS and only use wireless when GPS fails to retrieve user location, or use both at the same time and stop them if one has successfully received the location. The former will consume less battery power when the device is outdoor but there will be performance overhead when the device is indoors because the app will wait until GPS fails to retrieve user location before using wireless. On the other hand, the latter consumes more battery power on both indoor and outdoor but has better performance indoors.

Building an app that takes advantage of Location Services can give mutual benefits to both users and businesses. In summary, to make the best use of Location Services it is important to consider:

  1. How precise the retrieved user location needs to be,
  2. How often the app should retrieve user location,
  3. Where the user will mostly use the app: indoors, outdoors, or both.

Some examples of apps we have built for our clients which use Location Services are:

facebooktwittergoogle_plusredditpinterestlinkedinmailby feather

Google Tag Manager: What is it and why do I need it?

September 23rd, 2014 by Trevor Robinson

Google Tag Manager (‘GTM’) is a free tag managing solution that enables website owners and marketing teams to have more control over the manner in which web traffic and visitor actions are measured throughout their websites, and allows consolidation of tracking across Google Analytics, Adwords, Remarketing, together with 3rd Party Vendors such as ClickTail. A tag is a snippet of code which can be used to measure website traffic and help analyse and identify your website visitors and their on-site behaviourial patterns. Tagging, when implemented well can yield powerful data to gauge the overall performance of your website and marketing efforts.

Whilst GTM was introduced by Google in 2012, it is really only recently that marketers and webmasters have started to take advantage of what it can offer. Once the single code snippet for GTM is added to your website, all of your tags can then be managed from GTM’s admin panel.

The Benefits of GTM

  • Efficiency – One of the most beneficial aspects of the Google Tag Manager from a website owner or marketers standpoint is efficiency.  Now that you can add, edit and test website tags directly through the GTM user interface, you will save both time and money as you won’t need to contact your developer each time a tag needs to be edited or added.
  • Enhanced tag management - As mentioned earlier, multiple website tags can really complicate the tag management process (especially if they are from different platforms or vendors). GTM allows you to view, edit and add tags through the GTM interface quickly and easily all from the one platform.
  • Event listeners - Tracking user interaction such as clicks, PDF downloads and form submissions is excitingly simple to accomplish with Google Tag Manager. Event listeners eliminate the need to manually tag each user interaction that you would like to track. Through the GTM admin panel you can target links or buttons by attributes that are already contained in the link such as an id, class or URL.
  • Testing and debugging – It’s always been good practice to ensure that your tags are firing (working) before they are published on the web. GTM comes with a built-in debugging window where you can test any tag changes on your website before they are published on your website.

While GTM empowers website owners and marketers with greater control and flexibility, development teams are also positively affected as they are able to focus on the more complex and technically demanding tasks.

We recommend watching the GTM introductory video created by Google which may give you a better visual understanding as to what the tag manager is and how it can help your business.

We have recently implemented the Google Tag Manager for the Contact Point website, and can confirm that there is a learning curve to understand how to use GTM. However, it will be worth the investment if the data it provides is analysed, and the insights gained from the analysis drive changes to the structure and functionality of your website. Changes made to your website as a result of your insights can then be very quickly monitored for the impact they are having on your metrics.

We particularly see that the GTM will be beneficial for eCommerce websites as it will allow webmasters to analyse behaviours such as:

  1. Sharing of product information in social media
  2. Clicking through to subscribe to your newsletter from a particular page
  3. Accessing online chat
  4. Customer Reviews emanating from follow up email
  5. Adding an item to your wish list
  6. Ascribing behaviours to the logged in user ID

Please get in touch with us for more information on Google’s Tag Manager or for any assistance with initial implementation.

facebooktwittergoogle_plusredditpinterestlinkedinmailby feather

The impact of mobile browsing and mobile apps on website design trends

July 22nd, 2014 by Vincent Lai

With one in every five people in the world now holding a smartphone and one in seventeen owning a tablet, it’s easy to understand why website design has become immersed in catering for a wide range of device screens, and in fact why current digital design trends are being heavily influenced by the prevalence of mobile browsing. The mobile revolution brought with it the concept of the mobile app: the pocket sized utility that can do so much more than a website can, with access to the GPS, camera and other phone capabilities including the iPhone’s accelerometer and touch screen interactions. We now have apps for mapping, cooking, education, and entertainment. We even have apps that can control mini quadcopters that fly through the sky at your whim.

So how has mobile technology influenced digital design?

If you use your phone to view the Facebook website, in the top left or top right corner you will now see a very familiar icon, the menu button. Not long ago 3 horizontal lines meant nothing to most people, but now it is synonymous with opening up a navigation menu. Collapsing horizontal and vertical menus up into a single icon is a intelligent way to give visitors access to many pages, but take up the least amount of screen real estate. Many of our responsive website designs utilise this familiar icon, including inner pages of the Contact Point website when viewed on a smaller screen.
menu_icon

Another interesting design trend you might notice lately is the appearance of bold iconography. Many buttons, links, images and even logos, are now being simplified down to basic geometry, and cleverly illustrated symbols. Apart from being aesthetically pleasing, the main reason for this trend is simply to make life easier for mobile device browsing. Touch screen devices require pressing, swiping and other ‘gestures’ with your fingers to interact with the website or app. Using fingers is much less accurate than using a mouse and pointer. Large and simple icons and buttons are now ruling the way we browse because they are simply easier to press with a finger. They also grab our attention on the screen, no matter what size the screen.

In addition, apps have brought with them a range of standard icons that are used to achieve the same sorts of tasks across any website or app. The ‘settings’ icon is a good example of this. The image below shows the settings icon on Android, Windows and Apple devices. The commonality of the icons is obvious.
SettingIcons

Parallax scrolling, which I have posted about before, is also intermingling with mobile behaviours such as the appearance of new content at the bottom of the screen, triggered by swiping upwards to reveal more content. The ‘more content’ is only brought down from the web server when you “ask” for it via your touch gesture, making the initial content load faster, and also making the content feel more interactive. This behaviour is now appearing more in websites, including shopping cart sites containing many products per category.

The introduction of high definition ‘retina’ displays on mobile devices is also changing the way we are creating an displaying images in websites. An image that looks perfectly good on your regular PC monitor now looks a little fuzzy on such high definition screens. We are now regularly creating two versions of buttons and icons for display – one for high definition and one for regular screens.

These 5 design trends boil down to User Experience or UX (also known as User interface design or UI). The most successful apps have a potent combination of utility and user interface design. There’s no point in having a great product if it’s hard to use. By being simple yet bold, your users are more likely to pay attention and stay around for your message.

Has your use of mobile devices changed the way you expect a website to operate?

facebooktwittergoogle_plusredditpinterestlinkedinmailby feather

Will we soon be able to view iOS (Apple) apps on Android devices?

June 4th, 2014 by Hubert Yap

And another question… will Windows mobile devices soon be capable of running Android apps?

According to report by ABIresearch, Android and AOSP (Android Open Source Project, used by Amazon and Nokia) dominates the mobile market share by 44% and 13% respectively. iOS has around 10% and Windows at 3%, while the other 30% belongs to basic mobile phones that is, phones predominantly used just to make phone calls.

ABI Research Q1 2014 report

If you belong to the 57% Android and AOSP user group, you have probably found yourself wondering whether a certain iOS app will soon be available to Android. Six PhD students from Columbia University decided to do something about this issue, and have created a software solution called ‘Cider’.

Cider allows your Android device to run both iOS and Android apps natively. It is still a prototype and doesn’t yet support device features such as camera or Bluetooth. Therefore if your iOS app specifically required those features, Cider will not be able to run it in your Android device at the moment. The six PhD students: Jeremy Andrus, Alexander Van’t Hof, Naser AlDuaij, Christoffer Dall, Nicolas Viennot, and Jason Nieh, are continuing their R&D efforts and I look forward to Cider being made publicly available, and providing a lot more features, hopefully in the near future!

From an app development point of view, Cider has the potential to reduce app development cost. By allowing Android devices to run iOS apps natively, app developers may no longer need to build separate applications for iOS and Android.

It is already possible to reduce app development cost by utilizing a component called “web view” that exists in iOS, Android, and the Windows platform to run virtually the same web application across multiple platforms (see the most recently released Contact Point Client Area app). However, using the web view method means that your app is running a website within it, and therefore if you don’t have internet connectivity, your app will not function, nor will it have native components (buttons, sliders) that you usually see in each platform. Using the web view method also reduces the app performance.

Once Cider is able to perfectly run iOS apps natively on Android devices, Android users will have the option to choose between 1,157,769* apps in iOS App Store in addition to 1,469,630* apps available in Google Playstore. With rumours that Microsoft are considering bringing Android apps to the Windows platform, one day the mobile app development world might be heading towards a future where a single app will be able to run natively on the 3 different platforms.

* Data as at 16th May, 2014

facebooktwittergoogle_plusredditpinterestlinkedinmailby feather

SEO for Beginners: Inbound Links and Online Directories

April 29th, 2014 by Trevor Robinson

Beginner’s guide to inbound links

Not so long ago SEOs (Search Engine Optimisers) were able to exploit Google’s PageRank-based algorithm. The PageRank based algorithm would count the number and quality of backlinks to a webpage which would indicate a webpage’s authority and determine search engine rankings based on backlink anchor text.

SEOs began to manipulate Google’s algorithm by submitting a client website to as many online directories as possible and acquiring backlinks, through mass produced and largely useless or uninformative, but keyword rich, articles and press releases. In addition, website owners were being enticed into participating in Link Farms in response to guaranteed page 1 ranks. An example of a link farm is a scheme involving including code in the home page of your website which dynamically selects another website to link to from a pool of participants.

Amid growing frustration about exploitative SEO techniques, evident flaws in the algorithm and ‘spammy’ websites appearing in the search engine results pages, Google introduced updates to their ranking algorithm in a bid to stamp out black hat SEO tactics. The first update was nicknamed ‘Panda’ in 2011. Panda reportedly affected around 12% of searches and was aimed at preventing websites with poor quality content from holding high positions in the search engine results pages.

In 2012 ‘Penguin’ was introduced.  Penguin targeted websites engaging in black hat link building tactics such as paid links, link networks or ‘link farms’ and ‘spammy’ directories. As a result, a large number of black hat associated websites’ rankings plummeted in the Google SERPs.

To ensure you don’t incur Penguin related penalties from Google, stay away from paid links, dubious article directory links, low quality press releases, low quality online directories and link exchange networks.

Gaining backlinks in 2014

As it has always been, the best and safest strategy with respect to gaining backlinks to your website is to produce unique, quality content. Focus on creating valuable, captivating content that people want to link to and share through their social media channels, email marketing and website content. We find that links to your website from related, high authority sites (e.g. those with a high Google PageRank) are the most useful for your search engine ranks.

Effective content marketing techniques may include the creation of video and infographic content, regular blogging and hosting webinars and/or online events.

Implementing a social media strategy is a very important component of every content marketing strategy, especially if you are just starting out and/or don’t have a large following. Sharing your content frequently through social media can enhance the opportunity to gain inbound links, build the image and reputation of your brand and increase traffic to your website.

Should I still submit my website to online directories?

Submitting your website to reputable, authoritative online directories (Hotfrog  and True Local are two examples) is still great for search engine ranks. Overall, directories are not as important today as they once were in terms of link value, however submitting your website to a reputable online directory will still benefit your website by increasing website traffic and boosting exposure for your brand. It has also been speculated that listings in trusted directories can enhance your website’s performance in local search results.

facebooktwittergoogle_plusredditpinterestlinkedinmailby feather

Parallax Scrolling Websites: What are they and why are they useful?

January 29th, 2014 by Vincent Lai

Parallax Design is set to be one of the biggest trends in web development in 2014. But what is it exactly? And why should we bother? Long story short, its all about impact.

You may not know exactly what “parallax scrolling” means, but if you have been surfing around the web lately, chances are you have experienced it, and it has probably made an impression on you whether positive or negative. The term “parallax scrolling” refers to the technique used in websites where elements on the page move and shift at different rates, giving a sense of depth and interactivity to the page itself. It can be used in many different ways, and can bring a different approach to presenting your website.

Product Innovation and Communication Websites are the most likely candidates for using the Parallax Design technique.

Let’s say you are putting together a product, something that is new in the industry, or revolutionises an existing product.  You will want to show this product off, give the customers and clients something that they can visualise and drool over a little. Until recently, a detailed image gallery or annoyingly expensive short video were your only options.  A couple of images supplied too little information, and an extensive video sometimes felt too arduous. Organisations have recently used the new Parallax technique in very creative ways, to bring their products to life.

In the Saucony website (http://community.saucony.com/kinvara3/) they use parallax design to show the construction and science of how their shoes are crafted and constructed. As you scroll down the page, the shoe moves and rotates, adding parts and informing the user of the science behind each piece of the product. Added to this is the dynamically shifting background which subtlety follows the movement of the mouse. All in all, this design is very creative and an effective way to showcase their product.

In the Bagigia website (http://www.bagigia.com/), the creators of the leather bag have used the parallax technique to give viewers a 360 degree view of their unique design. This method allows them to show off their special product, and explain the thought process behind the design. It leaves nothing hidden, so that the customer has a better grasp of what it truly looks like, instead of a couple of still photographs against a stagnant white backdrop.

The other use, as mentioned above, is for communication websites. In my previous blog post, I discussed the use of full bleed images for higher visual impact. This technique coupled with Parallax design can take the impact of your website to new levels, and help you outshine your competitors. The best application of this is for websites that exist purely to impart your company information, where you don’t need more complex functionality or design elements.

A communication website that has used Parallax to very well is http://unfold.no/.  They have cleverly used the layering effect combined with a looping scroll to create what feels like an endless website.

For Contact Point we have created a Parallax micro-website for our design portfolio (http://www.contactpoint.com.au/CreativeDesignPortfolio/) which showcases some of our work. We have incorporated the dynamic page scrolling links and a layered approach to our imagery whilst using horizontal image scrollers to present our work.

Next time you are contemplating refreshing your website, consider the Parallax technique and whether it can enhance your website visitor’s experience.  I’d love to help create the design!

facebooktwittergoogle_plusredditpinterestlinkedinmailby feather

Social is now Normal Media

January 21st, 2014 by Heather Maloney

An article written by Brian Solis just over a year ago described social media being the new normal. I’ve been banging on about social media for a few years now, but in the last 6 months or so, I’ve noticed a change in Australia… people (media and the general public, young and old) now include social media in their conversations as a matter of fact, rather than as if it’s the latest cool thing, or as if to say “we’re on it too, but we don’t know how to use it”.

There are definitely areas, and segments, where social media proliferates more than others. We’re seeing it feature heavily in:

commerce – research for products and services, reviews, recommendations, complaints
promoting causes – both in the not for profit sector, and grass roots causes such as in response to tragedies
news - both personal updates about life, as well as discussion about historical events as they happen
events - promotion of events and then during events the audience / attendees engage in deeper involvement in live events, TV and radio programs using social media tools
education and innovation – information sharing and collaboration / discussion around specific topics
leisure / games – my mother who is 30+ years older than me recently relented and signed up for Facebook in order to participate in the online game, Candy Crush, with her sisters and she now shares more on Facebook than I do.

An interesting example has occurred recently in the estate where I live. The estate has a body corporate with a moderated online forum. The moderation takes days sometimes to allow posts on the forum to appear after submission… and if there’s any concern about the content of the posts (i.e. they don’t say the “right” types of things) then the posts may not make it, or be delayed for weeks. So residents have taken matters into their own hands, and setup a group on Facebook where they discuss issues. It’s of course not moderated, and therefore posts are instant and engagement is arguably deeper.

I know some of you are still sceptical about social media. No matter what your business is, you need to be thinking about where and how you can get engaged in the [not so] new place where the relevant conversation is happening. It has the added potential benefit of boosting your search engine optimisation.

We’ve recently added a relatively new Facebook feature to the Note Couture ecommerce website, which allows comments to be added by visitors alongside a product (in this case an illustration which you can add to personalise stationery) within the website. These comments will also simultaneously appear in their Facebook timeline, and are therefore not anonymous, giving them greater credibility. Of course, we’ve configured the Facebook Comments integration to include a thumbnail of the product into the Facebook timeline, which will encourage the commenter’s friends to click through and visit the website. To close the loop, Note Couture can moderate the comments that are added using this mechanism, to deal quickly with inappropriate content. You can see an example here: I love this illustration!

facebooktwittergoogle_plusredditpinterestlinkedinmailby feather

Your Business on the Big Screen!

November 20th, 2013 by Vincent Lai

Computer technology has come a long way over the years, and with each generation of increasing screen sizes, web designers everywhere have taken up the challenge to best take advantage and utilise this new screen real estate.
With some screen dimensions now topping out at 2560 pixels wide, it’s no wonder that the old 1024 pixel websites now look dated and unprofessional. An easy and aesthetically pleasing way to combat this issue without compromising on content is to introduce full screen or full bleed imagery.

Full bleed imagery has been used in the past by print designers, in magazines, brochures and newspapers. However, with the rising popularity of responsive websites, full bleed imagery is now being used on screens, and with great effect. Two great ways to use full bleed imagery include a full bleed background, or using a full screen width rotating banner.

The full bleed image background is useful for websites that wish to have an overarching image that sums up the feel of their whole website. With this concept, content would usually scroll back and forth over the background, leaving the image static and unmoving. To best use this style, the image must be uncluttered and have a definite theme, whether that be a panoramic photo, or a person modelling the latest product. Secondly, the image must allow for content. In some cases, if an inappropriate image is used, it will disturb the readability of the content, and you will subsequently lose users on the website. Make sure you have a defined contrast between the background and the foreground. This can be achieved in many ways; by changing the image to black and white, blurring the image, adding or decreasing the brightness of the image or even using box between the content and the background. Here’s an example of a website that uses the background element as the full bleed image: www.enudge.com.au

enudge

The second option of using full width imagery for rotating banners is more suited to corporate websites that want impact without being too flashy. The use of a full width rotating banner allows the website to showcase a variety of things as opposed to one singular theme. Whether it be your company values, or special deals that are available, a full width rotating banner never fails to grab the attention of your audience. The other advantage of using this method is that it allows the rest of your website to sit within the 1024 space without it looking old fashioned. Using a straight 1024 pixel layout will make your website look blocky, and less engaging. A wide spread image at the top draws the eye and attention of your audience, breaking the rigid structure, which then follows through, making the rest of the content easier to absorb. A good use of this style should give impact and simplicity to your website’s main message. A good idea for image selection for this purpose are images that have a wider angle, and preferably a space for a short message. Using portrait photos limits the amount of what is visible, and using something too cluttered will compete with the impact of the text you choose to place on top. Here’s an example of a website that uses the scroller as the full bleed image: toll transitions Defence Website

toll

Either way, applying large scale, full screen imagery now has a place on the internet, as screens get larger and wider. Using up that screen real estate has never been more important in sending your message to your consumers and clients.

Vincent Lai

facebooktwittergoogle_plusredditpinterestlinkedinmailby feather

Google testing in US, large banner ads at the top of search results

October 26th, 2013 by Heather Maloney

Recently Google has been seen testing the display large banner ads (images) across the top of search results in the US for just particular big brands including South West Airlines.

You can read about this further, and see an example of the banner ad in this article in The Age newspaper.

It will be interesting to see if this change is made widely accessible in the near future, and of course, whether it comes to Australia – this is the usual path of tests of new Google functionality. I expect these banner ads to have strict requirements regarding their look and feel, and to be very expensive, given that Google is being accused of going back on a promise to keep the search engine free of large, flashing ads, ever.

Would you welcome banner ads like the one shown in the top of your search results?

facebooktwittergoogle_plusredditpinterestlinkedinmailby feather

Making your Holiday Images worthy of your website

July 8th, 2013 by Vincent Lai

Holidays are great.  They’re a fantastic way to relax, explore new places, spend time with the people you love and we all want to immortalise those great moments in our holiday snaps.  However, as great as those photos are to us as individuals, how often have you looked at another person’s holiday photos and found them genuinely interesting?  More often than not it’s taken with a quick fire digital camera (or worse, your smart phone) with a cheesy generic pose in front of a cliché tourist attraction.  The colour in the photo is never great, and a surprising amount of times, you will find a non-descript passer-by doing something unseemly in the background to ruin what should have been a great memory.

An easy way to spruce up photos and give them a bit more life is to simply switch up the way you see photos.  Instead of a mundane slide show of photos that your facebook friends are most likely NOT going to scroll through one by one, take a couple of varying shots of the same moment, and put them into a collage, each moment being defined by a few different photos of the people you are with, the place you have come to visit and maybe even some candid shots of the scenery or the locals.  Play with the layout, maybe make it into a simple grid, or layer the photos on top of each other to give yourself that artsy appeal.  You don’t need fancy programs and photography skills to turn a couple of boring photos, into an art board that truly tells a story.  One of the best online tools to edit your photos is pixlr (www.pixlr.com).  It’s free to use, easy to master and can help you get the most out of your photos.  Another good tool is the all too famous Instagram.  With its myriad of image filters and effects, it’s not hard to give a boring flat image, a bit of life that it sorely needs.

So the next time you go on holiday, change the way you think about taking those happy snaps and instead of a mundane collection of photos, you can come away with something spectacular.

Here’s a couple of examples of banners created using our client’s holiday pics:

And here’s an example inside the website: www.travelinsure.net.au

facebooktwittergoogle_plusredditpinterestlinkedinmailby feather