Finding Balance Between Fun, Joy, and Seriousness

Posted
Tags
UI/UX
Share

Designing the Sanat Ensemble website was both a rewarding and challenging experience. The task was to capture the vibrant energy of the 70s whilst honouring Turkish people and other communities who fought for equal rights. I also wanted the design to reflect the joy and lively spirit of their music and performances. Here’s a breakdown of the key struggles I encountered and how I overcame them!

1. Striking the Right Balance in the 70s Theme

When I first started gathering ideas, I explored classic 70s design themes. However, much of what I found leaned heavily towards the stereotypical “hippie” aesthetic—groovy patterns, mushrooms, and bright, swirling colours. While these visuals were playful, they didn’t quite fit with the deeper message of Sanat Ensemble’s work in social justice and equal rights.

➡️ Solution:
I struck a balance by combining fun, bold colours with a clean white background and dark text. This approach allowed the website to maintain the joyful spirit of the 70s whilst respecting the gravity of their cause. The colour scheme injected a fun, musical vibe, while the minimal background kept the focus on their message.

colourful background with a white rectangle on the top of it with a headline, text and a button

2. Letting Go of the Megaphone Illustration

At one point, I was set on using a megaphone as the main illustration for the site, thinking it would represent the idea of raising voices and standing up for rights. However, it just didn’t fit visually with the rest of the design and began to feel out of place.

3 examples of my old design with using a megaphone

➡️ Solution: I realised I needed to simplify the design, so I let go of the megaphone idea. Instead, I embraced the 70s-themed colours and explored other patterns, which led to a musical-inspired illustration just before the footer. Adding colourful backgrounds also made the design feel more dynamic and cohesive, keeping the spirit of the website lively and engaging.

the sanat ensemble website's footer with a colourful wavy line before the footer

3. Handling the “No Upcoming Events” Situation

One of the trickier aspects was figuring out how to manage the “Termine” (Events) section when no performances were scheduled. I didn’t want visitors to feel disengaged or disappointed if there were no upcoming events listed.

➡️ Solution: I put myself in the shoes of a fan eager to attend a performance. Instead of leaving the section empty or just a few events, I added a message with links to their social media, encouraging users to stay connected for updates. The client later decided to add a newsletter sign-up link.

my design of termine section without any upcoming events with a message and social media links
my design of termine section with 2 upcoming events with a message and social media links

4. Optimising the Article Menu for Mobile

For the desktop version of the article page, I took inspiration from Google Docs and Microsoft Word, where users can see the titles on the left-hand side. However, when I attempted to adapt this layout for mobile, it didn’t work well at all.

Geschichte page on desktop

➡️ Solution: My partner stepped in with a great suggestion, showing me how other websites handle mobile design for similar layouts. This insight helped me modify the article menu so it worked smoothly on smaller screens, maintaining an enjoyable navigation experience without feeling cluttered.

Geschichte page on desktop

5. Ensuring Consistency in the Person Popup

Another challenge I faced was with the person popups on the team page. Initially, the portfolio images in the modal were smaller than those on the main page, which disrupted the visual flow.

my design of team page and one person's popup open

➡️ Solution: I resized the images to make them bigger than those on the team page, creating a smoother and more consistent experience for users. I also added a small hover animation, which I think adds a fun, playful touch to the interaction! 😚

The team page of The Sanat Ensemble's website and one person's popup open

Final Thoughts

Designing the Sanat Ensemble website was a journey of balancing fun, joy, and serious messaging. From the 70s-inspired colours to the energetic yet thoughtful layouts, every design choice was made with the goal of bringing their story to life in an engaging and visually exciting way.

This project reinforced the importance of letting joy and energy shine through in design, especially when it involves music and performance. It also reminded me that I’m still on a path of learning and growth in my field. I’m grateful to my partner for trusting me in working on this project with him 🙏🏻 🥰

As a foreigner living in Germany, I personally resonated with this project. It made me even more grateful for the equal rights I have today, thanks to those who stood up for them. One of my goals is to continue improving my German so that when I go watch one of their performances, I can fully understand and enjoy the experience! 🎶

Related articles

Day 13 of 30 Day UI/UX Design Challenge: Mobile site redesign for Juni! 🥤✨

🎨 Today’s design task Hi, everyone! Today’s challenge is redesigning a mobile website! I’ve been following Jay Shetty and his wife Radhi for a while now, and when I noticed their Juni website could use a little polish, I couldn’t wait to dive in and make it shine! The current mobile site: 🚀 My design process Initial Review: I looked at the Juni website on my mobile and listed …

Making the Fermenstation Website Accessible 🥢

👩🏻‍🔬 Accessibility Testing Insights During my review of the Fermenstation website, I identified 10 accessibility and UI/UX issues. While 3 required coding changes, I addressed 7 through design improvements. Here’s how I solved them: ✅ How I Solved Accessibility and UX Issues 1. Low Colour Contrast: The contrast on buttons, text, and links (e.g., “READ MORE” under NEWS) was too low. …

Day 10 of 30 Day UI/UX Design Challenge: Icon Design! ➰

🎨 Today’s design task Last night, I discussed my task for today with my partner. I’m grateful for his input, as he’s always thinking about how I can upskill as a designer. 🥹❤️ Today’s task: It’s a 2-day series focused on icon design! 🚀 My design process Understanding the task: I started by reading the task requirements. Research: To understand how to make consistent icons, I …