Makemepulse wins Site of the Month October with Astrology Club, If you voted and tweeted, check out the end of the article to see if you've won a free Pro Plan.
What do zodiac signs and podcasts have in common? Spotify, of course! We united the two, to bring the Astrology Club to life.
Astrology Club is an interactive microsite, aligning the stars of podcasts, astrology and wellbeing in a playful gamified experience. The main goal of the project? To increase awareness of Spotify’s vast podcast offering in a cool and immersive way - we were there for it!
Gamification is a fantastic tool for communication and user engagement. With a personality quiz inspired execution, the project was a perfect playground for big kids like us.
Where to start?
The first question we asked ourselves was “how do we avoid the clichés of astrology design?”. We wanted something fresh, fun and different from the dark colours and moody mystical styling typically associated with astrology; we wanted to match the bright and vibrant energy of the Spotify universe.
We looked to ground the design with timeless shapes, and used a circle to anchor the key symbols of astrology from the start: the moon, the sun and the sunrise. We designed the loader early on in the process - this set the tone, both design and motion wise, for the style of animation and design we wanted to roll out across the Astrology Club.
To enhance the experience, we collaborated with super talented artist Leandro Assis, aka Lebassis. Known for bold lettering, colourful palettes, and playful illustrations, the signature of his work was totally in line with our vision. We worked with him to design the twelve signs of the zodiac, focussing on simple shapes and details that were bold and modern, yet still recognisable.
Looking to create a strong signature that defined our vision of astrological design, we created stickers to use across the microsite - solidifying a new visual approach to the field, that’s both fresh and fun. The stickers opened up further options for us to play with scroll speed, and led us to craft more dynamic navigation and layouts, to hero them across the site.
Looking to create a strong signature that defined our vision of astrological design, we created stickers to use across the microsite.
Development wise, we focussed on a classical html execution, maximising accessibility and ease of use for Spotify’s audience. The result? A seamless and striking digital journey.
A playlist for all tastes
To cater to all tastes, we designed a quiz system to pull together a podcast playlist that would best suit a user’s preferences: user inputs allow us to personalise both the playlist and the membership card.
Answering questions can be a drag sometimes, so we were laser focussed on creating a smooth and relaxing, yet efficient user journey
Each question posed is linked to a key element of the membership card, for example, the first question allows us to define the icons that will be present in the watermark of the card, as well as defining the type of podcast that the user likes most. There’s a multitude of possibilities and combinations available!
At the end of the experience you can of course listen to the playlist suggested for you, but we invite curious minds to explore the other zodiac sign playlists too!
How to join the club
Being part of a club sounds fun right? Well, we created an extra special one!
The principle of the Astrology Club is very simple: we ask you to enter your astrological sign, and then we quiz you on your podcast interests and habits. Ta-da! You’re part of the club now, and you’ll receive a personalised membership card.
Answering questions can be a drag sometimes, so we were laser focussed on creating a smooth and relaxing, yet efficient user journey. We put special care into the animation of the questions, so that every detail encouraged and emphasized answer entry, whilst still respecting the astrological theme with stars, skies and shooting stars.
ANIMATED ANSWERS
It was super important for us to craft and play with the club card interactions, heroing it at the very centre of the experience. Users are invited to explore the card with multiple interaction options: by hovering over the card they can create perspective, by holding it down they can reveal the artwork on the card’s back, and by scrolling, they can activate different animations.
ANIMATED ANSWERS REVEAL CARD TRANSITION
Astrology for us is synonymous with discovery and mystery, so we wanted to nod to these details. Within the site we created a unique section, where users can find special Moon and Rising stickers, accompanied by explanations only discoverable by moving your cursor as if you were looking for a specific star in the sky. In a similar vein, we also hid an Easter egg on the homepage! Did you find it?? ^^
Finally, when we think about a club, we imagine a certain atmosphere. To shape the feeling and ambiance of the experience, we worked with music and sound design studio, Press Play On Tape. They worked to compose a soft and welcoming soundscape for the Astrology Club universe, that highlights user interactions with subtlety and elegance. You’ll feel transported to a soft cloud with these melodies!☁️
Come and join us at the Astrology Club, and find the perfect podcasts to listen to whilst stargazing this winter.
Thanks, MMP 💫
Company Info
Makemepulse is a creative production studio that partners with global brands and agencies looking to make authentic connections. We’re a team of developers and designers challenging what digital can do and how seamless it can be. Awe inspiring craft, seamless technology and a sprinkle of magic are all things we bring to the table to make digital experiences come to life.
If you voted and tweeted, we thank you. @saidul2k21, please DM us to collect your prize!