Day 5 of 30 Day UI/UX Design Challenge: Meditation app with Psyduck! 🐥

Posted
Tags
UI/UX 30 Day UI/UX Design Challenge
Share

🎨 Today’s design task

Today was probably my most challenging task yet — designing a mobile meditation app featuring Psyduck! As a former web developer, mobile apps are new territory for me, but combining meditation with one of my favourite Pokémon made it exciting.

🚀 My design process

  1. Thoroughly analysed the task requirements

  2. Sketched initial ideas on my iPad using Freedom app

  3. Researched meditation and music app layouts, as well as Psyduck’s various expressions

  4. Drew and painted Psyduck on Procreate (time-consuming but enjoyable!)

  5. Chose colours and typography

  6. Created a lo-fi design before adding colours

  7. Incorporated a breathing animation from Figma community

  8. Added Psyduck’s encouraging messages during meditation

  9. Fine-tuned font sizes and colours

🧠 Challenges and solutions

  • Struggled with mobile app layout — extensive research was necessary
  • Limited personal experience with mobile apps made it challenging to gauge design completeness
  • My mentor’s feedback:
    • Lighten the play bar’s grey section (implemented)
    • Differentiate active icons from inactive ones
    • Improve contrast between light blue breathing animation and yellow background
    • Improve the UX of the volume buttons — maybe just one button?

🖼️ The final design

For my first mobile app design, I’m pleased with the result while acknowledging room for improvement.

💡 What I learned today

  • Working with yellow and blue colour scheme was challenging
  • Gained confidence in using smaller font sizes appropriate for mobile apps
  • Realised I currently prefer web design, but I’m open to exploring mobile app design further

⏰ If I had more time

  • Animate Psyduck’s expression change and add a heart icon in the alert section
  • Implement mentor’s suggested adjustments

💌 Any thoughts?

What projects are you working on? I’d love to hear your thoughts on my design or any advice! My mastodon link and email are below.

Thanks for following Day 5 of my challenge. See you on Day 6!

With love and light 🫶🏻
Yoshie

P.S. After a day of beach volleyball and swimming at Freibad, I was reminded of the importance of staying hydrated, taking breaks, and balancing screen time with physical activity. Let’s all remember to take care of ourselves! 💚

Related articles

Day 26 of 30-Day UI/UX Design Challenge: Creating My Custom Blog Design! 👩🏻‍🎨

🎨 Today’s Design Task I’ve been using a template for my blog, but my partner suggested I design my own—and he’d handle the coding! I was super excited to dive in and create something uniquely mine 🤩 🚀 My Design Process Inspiration Gathering: I explored various blogging websites to gather inspiration. Initial Sketches: I sketched out my ideas on my iPad. Lo-fi Mockup: I created a lo-fi …

Day 15 of 30-Day UI/UX Design Challenge: Mobile App Lo-fi Design! ✍🏻

🎨 Today’s design task Today’s project was so much fun because it allowed me to think about my baby, Teto 🐈‍⬛❤️ 🚀 My design process Brainstormed key features for the app: Started with a brainstorming session to identify essential features. Defined the primary user persona: Essentially, I used myself as the primary user persona. Listed potential data points to track: Created a list of data …

Improving Accessibility on Mission Control’s Website! ✨

👩🏻‍🔬 Accessibility Insights from My Review While reviewing Mission Control’s website, I identified 13 accessibility and UI/UX issues on the homepage. Out of these, 7 required coding fixes, but I could address 6 through design changes. Let’s dive into how I solved them! ✅ How I Improved Accessibility and UX Colour Contrast: Green/Yellow Buttons: The original green and yellow buttons didn’t provide …