AKQA collaborated with The Ministry of Hajj and Umrah to create the new Nusuk app for pilgrimage in Saudi Arabia.

The concept of light informed the UI and UX redesign, which resulted in an ecosystem that helped users navigate their entire journey across the app. The idea behind this originated from how light, referred to as Noor, is described in connection with divine guidance, in the Quran. It’s also one of Allah's attributes, as per his name, Al Noor, which means The Light or The Illuminator. To accurately capture this, specific verses from the Quran were used as a reference point, such as:

يَهْدِى بِهِ ٱللَّهُ مَنِ ٱتَّبَعَ رِضْوَٰنَهُۥ سُبُلَ ٱلسَّلَـٰمِ وَيُخْرِجُهُم مِّنَ ٱلظُّلُمَـٰتِ إِلَى ٱلنُّورِ بِإِذْنِهِۦ وَيَهْدِيهِمْ إِلَىٰ صِرَٰطٍۢ مُّسْتَقِيمٍۢ

“Through which Allah guides those who seek His pleasure to the ways of peace, brings them out of darkness and into light by His will, and guides them to the straight path” (Surah Al-Ma’idah 5:16)

My role in the project was design and animation for the permits, Qibla compass, and splash screen.

The permits allow users to apply and book for Umrah and Noble Rawdah at the holy sites. I helped conceptualise the design of the permits, derived from the intricate Islamic patterns on the gates of Masjid Al Haram in Makkah and Masjid Al Nabawi in Madinah. My approach for animating the permits used soft natural light rays combined with glow and shine, continuously illuminating the pattern and QR code, serving as a spiritual entry into performing the two rituals. 

At the heart of Islam lies the Kaaba, revered as the House of Allah, which is at the centre of Masjid Al Haram in Makkah and is the pilgrimage’s most important destination. The Qibla compass helps users find the direction of prayer towards the Kaaba. When the compass is aligned with the Kaaba, it illuminates the screen with light.

I created the Qibla compass background, inspired by elements of the Kiswa, the fabric that covers the Kaaba. For lighting and texturing, I took material references from silk fabric and foil printing. I combined this with a cloth simulation animation, highlighting the Quranic calligraphy as the fabric gently waved. This elevated the compass beyond functioning solely as a directional guide by enhancing the spiritual connection with the five daily prayers. 

When users open the app, the splash screen introduces them to the world of Nusuk. I designed and animated the splash screen, which used a soft light passing by, smoothly revealing the logo from darkness. As a result, users are connected with the essence of guidance and spirituality before they even begin to book, apply, and travel for their Umrah or Hajj pilgrimage. 

Earlier explorations of the permits involved a flatter approach, in which the light rays would illuminate the pattern, QR code, and border, causing the gold foil texture across these elements to glow and glint. I also investigated how this would work subtly with additional UI elements, such as an active tab at the bottom of the permits. Eventually, this direction was not taken forward since more suitable solutions were discovered further in the process. 

For the initial versions of the splash screen, I delved into different ways light can animate to reveal the Nusuk logo. This included using a single light source that rotated in different directions, angles, heights, and speeds. These techniques revealed the logo’s outline and surface, which expressed a sense of spirituality and sacredness, laying the foundation for the visual language. However, this specific approach was not developed further, as it felt abrupt and static. In turn, it sparked ideas to refine the animation and lighting to be more gradual, natural, and smooth, as seen in the final version. 

I also did R&D for the gradient backgrounds, which informed the look and feel of the final ones in the app. The idea for this came from light leaks and how they organically move. I focused on creating variation by brightening and dimming light in different areas, with changing densities and forms.