Day 7 of 30 Day UI/UX Design Challenge: Modernising an Outdoor Pool Website! ๐ŸŠ๐Ÿปโ€โ™€๏ธ

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

๐ŸŽจ Today’s design task

Thanks to our hungry cat Teto ๐Ÿˆโ€โฌ›, I had an early start today. After creating a poster this morning (detailed at the end), I tackled today’s challenge in the evening. After yesterday’s struggles, I was eager to dive in, knowing it could only go up from here!

Here is the original website:

๐Ÿš€ My design process

  1. Gathered existing images from the current homepage

  2. Identified essential nav bar and homepage elements

  3. Researched other swimming websites for inspiration

  4. Sketched a lo-fi design

  5. Transferred the lo-fi design to Figma

  6. Selected colours and typography

  7. Designed header and navigation menu

  8. Created a hero section with a featured photo

  9. Developed an image carousel component

  10. Designed an information section (with a pool-shaped image layout). I struggled with price section using green initially.

  11. Built a ticket section outlining purchase steps (I tried to make a form but decided not to include)

  12. Crafted a footer (originally planned dark, but time constraints led to a white design)

  13. Final touches: colour adjustments and alignment fixes

๐Ÿง  Challenges and solutions

  • Incorporating red without overpowering the design
  • Time management (Today it took 3 hours for design, usually 2.5 hours plus 30 minutes for blogging)
  • Mentor feedback:
    • Red dot before title might imply being closed; and green for “open”
    • Improve contrast in right ticket area
    • Fix vertical alignment in left ticket area
    • Refine footer icon (currently looks spiky)

๐Ÿ–ผ๏ธ The final design

I’m pleased with the overall result, though the ticket purchase section could use some refinement.

๐Ÿ’ก What I learned today

Investing time in a simple lo-fi design smoothed the design process.

โฐ If I had more time

  • Remove the logo background colour and make the letter white for a darker footer design
  • Implement mentor’s suggestions

๐Ÿ’Œ Any thoughts?

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

Thanks for following Day 7 of my challenge. See you tomorrow for Day 8!

With love and light ๐Ÿซถ๐Ÿป
Yoshie

P.S. I completed a poster for the Open Call by https://verlagegegenrechts.de/ today. Learning to use the iPad and Procreate (a gift from my partner for this opportunity) was challenging but rewarding. As a child, I gave up drawing thinking I lacked talent. I still donโ€™t think I have a special talent but now I know that it’s about learning and growing. I hope my painting conveys the beauty of inclusiveness, compassion, kindness, and love ๐Ÿ’•

Related articles

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 โ€ฆ

Day 28 of 30 Day UI/UX Design Challenge: Landing Page for Cat Poopy Tracker! ๐Ÿพ

๐ŸŽจ Today’s Design Task Today’s task was a lot of fun, especially since I got to play around with animations in Figma! Task Overview: Poopy Tracker App Landing Page with Animated Features Design a landing page for the Poopy Tracker mobile app using Figma, featuring an animated transition for the key features section. Hero Section: Create a hero section explaining the app’s purpose โ€ฆ

Day 3 of 30 Day UI/UX Design Challenge: First Lo-Fi Web Page Design! ๐Ÿ˜ฎ

๐ŸŽจ Today’s design task Despite feeling a bit tired from a late night, I was excited about today’s task: creating a wireframe for a medieval artist’s portfolio website. It’s a two-day project, but my partner helped me break it down into manageable steps. As a fan of medieval art (thanks to playing Pentiment), I was thrilled to work on this. The task: Create a lo-fi design โ€ฆ