We created Qibla Finder, a progressive web app which uses a phone’s compass and GPS to accurately find Mecca, then the phone’s camera and augmented reality to quickly point users in the right direction from anywhere in the world.

To make it accessible to all, our idea was to design Qibla Finder so that it would only use the data and features any device was capable of, an important feature in countries with hardware and data constraints. The goal was to have the app live open and free on the web, work on a wide range of devices, and exist in multiple languages. We wanted to use complex technology, such as augmented reality, to create a simple and intuitive user experience.

Although the resulting user experience is simple, the technology needed to create it was complex. Qibla Finder uses the GPS and compass in a mobile phone, along with the time of day and an accelerometer, calibrated against the curvature of the Earth using the Haversine Formula to create a simple, clear blue line in augmented reality, which points to the Qibla in Mecca from anywhere in the world.

With cutting-edge browser APIs, we were able to bring the functionality of native apps to the web. The app is responsive, progressive, and works seamlessly on a huge range of devices, platforms, and broadband connections.

To help as many people as possible, we made Qibla Finder available in 16 languages. The project was briefed, concepted and created in just four and a half months. It was released during the holy period of Ramadan in June of 2017 and is still used in 206 countries.

- We saw 4 million unique users during Ramadan, of which 1.8 million returned to the site, creating 45% return rate.

- Over 500,000 average monthly users continue to use the site today, long after Ramadan. All organic, with no paid media running.

- We have monthly visits from 206 countries globally.

- +300K Social mentions across FB, Twitter, Instagram and growing.

The target audience was Muslims around the world who needed to accurately find the direction of the Qibla in Mecca for prayer. It was important that our solution would be accessible by anyone, anywhere.

Because of this, Qibla Finder was designed to work on a broad range of devices, from low-powered entry-level mobiles to the latest sensor-packed devices, and all kinds of tablets and desktops in between. Our approach was to build a truly progressive web app that could detect device capabilities and create the best experience for any platform. We wanted the user interface to be intuitive, modern and beautiful to help create a valuable and meaningful experience with our brand.

Every year during Ramadan, there are over 60 million search queries for “direction to Qibla”. People pray more often during Ramadan and to do this, they need to be able to accurately find the Qibla, the direction to Mecca. While many mobile apps are available, they’re largely inaccurate, difficult to use and must be downloaded or purchased.

Since the beginning, Google’s goal has been to develop services that improve the lives of as many people as possible. Our objective was to enable Muslims around the world to find the direction to Mecca from anywhere in the world quickly, easily, for free, and without the need to download an app. Our hope was that we could help users discover a new Google product that would continue to be useful long after Ramadan.