Day 9 of 30 Day UI/UX Design Challenge: Website Refresh for My Partner! 😘

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

🎨 Today’s design task

Another exciting morning! After a hot day yesterday, I was grateful for the cool morning breeze today 🌬️

Today’s task: Redesign this website: medienbaecker.com.
Here is how it looks now 🥨

🚀 My design process

  1. Study the website: I started by understanding what needs to be on the homepage.

  2. Inspiration: I looked up some inspirations. There were so many cool ideas that it was hard to decide which ones to incorporate.

  3. Sketching: I sketched my ideas on my iPad.

  4. Color and typography: I was unsure whether to go for a colourful design or stick with a monotone, as many software engineer portfolios are monotone. I decided to start with a monotone and would consider a colourful version if I had time.

  5. Gathering resources: I got some pictures and links from the website.

  6. Adding GIFs: I decided to include GIFs, so I recorded my screen going through two websites and made them into GIFs using Adobe Express. This took more time than expected because of quality issues, but I managed to get it right by trimming the video to about 15 seconds.

  7. Icons: I got some icons using the Iconify plugin in Figma.

  8. Personal touch: I chose my favourite photo of him 🫶🏻

  9. Colour experiment: I experimented with using yellow/orange in some areas.

  10. Final touches: I added more cards without pictures or GIFs.

🧠 Challenges and solutions

  • Time constraints: Completing the entire page within three hours was tough. It was a good decision to skip the “nice-to-have” features.
  • Prototyping: I didn’t have time to add prototypes.
  • Feedback: My partner’s feedback included:
    • Use a beautiful shadow plugin.
    • Stick to one icon style (stroke, filled, emoji).
    • Consider different stroke colours for the projects.
    • Nested border-radius - inner element should have less radius

🖼️ The final design

I’m pretty happy with the result. It’s still exciting to see light and dark modes working!

💡 What I learned today

I need to be more careful with consistency in radius and icons.

⏰ If I had more time

  • I’d adjust the design based on my partner’s feedback.
  • I’d add animations (hover effects and dark/light toggle switch).
  • I’d create a colourful version of the web page.

💌 Any thoughts?

What are you working on these days? I’d love to hear your thoughts on my design or any advice you might have!

Thanks for following along on Day 9 of my challenge. See you tomorrow for Day 10!

With love and light 🫶🏻

Yoshie

P.S. Yesterday, my partner and I had a small bet about the spelling of “eyebrow.” I lost because my partner got it right while I thought it was “eyeblow” 🫠
I was pretty sure that I’ve seen the spelling “eyeblow” many times in Japan and when we googled it, some Japanese results came up 😂 Since I lost the bet, I had to redesign my partner’s website, which turned out to be pretty fun!

Yesterday’s Teto 🐾

Related articles

Day 29 of 30 Day UI/UX Design Challenge: Redesigning the Registration Process for Seedlang 🌱

🎨 Today’s Design Task Today, I focused on redesigning the registration process for Seedlang, a language-learning app. The current design isn’t very accessible, so my goal was to make it smoother, more engaging, and user-friendly! 🖼️ The Final Design This task took me the entire day, and I felt a bit slow at times, but I’m reminding myself to be patient. I used Cari and …

Day 20 of 30 Day UI/UX Design Challenge: Smart Animation! 🪂

🎨 Today’s Design Task Today’s task was something I knew I’d have to tackle eventually, so I’m glad I took it on! See task description 🚀 My Design Process Understanding the Task: I carefully read the task to ensure I knew exactly what was required. Lo-Fi Design: I started by creating a lo-fi design of the navigation bar and hero section, adding a path for a paraglider silhouette. AI Assistance: I …

Day 1 of 30 Day UI/UX Design Challenge: The Journey Begins!

🎨 Today’s design task I woke up super excited today — a feeling I haven’t had in a while! My partner gave me an amazing project to work on. Detective Conan Escape Room Booking Page: Design a visually engaging and user-friendly page for the “Beika Street Escapes” website. A company offering Detective Conan-themed escape rooms Target Audience Detective Conan fans aged 15-45 …