Day 2 of 30 Day UI/UX Design Challenge: Green is My Favourite! ๐Ÿ’š

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

๐ŸŽจ Today’s design task

Another exciting morning!

Today’s project is a nutrition dashboard with a green theme. As a vegan who loves green, this task really resonates with me, even though I’m not a nutrition expert.

๐Ÿš€ My design process

  1. I started by sketching my initial ideas on paper. My experience with dashboard design as a software engineer came in handy!

  2. I researched daily nutritional needs and how they’re measured.

  3. I chose colours and typography (Nunito, Nunito Sans), inspired by designs from Google and Dribbble.

  4. Firstly, I made a menu on the left side.

  5. I found a great pie chart design (Circle Chart by Pavel) in the Figma community. <- This took a lot of time ๐Ÿ˜…

  6. I added icons using the Iconify plugin in Figma.

  7. I experimented with colours, using an accent colour for unachieved nutrition goals. (I also snuck in a photo of my cat, Teto, as the profile picture!)

  8. Finally, I settled on the colour scheme.

๐Ÿง  Challenges and solutions

  • Working with green was trickier than I expected.
  • Since I’m not big on nutrition apps (except for tracking water, B12, and D), it was a bit challenging to stay engaged.
  • My mentor, Thomas Sensei, suggested some tweaks to the background brightness and vertical alignments, which I implemented.

๐Ÿ–ผ๏ธ The final design

I’m pretty happy with day two’s result. I can’t wait to look back on this later and see how far I’ve come!

๐Ÿ’ก What I learned today

Maintaining consistency with buttons and other elements can be tricky. I think I did okay using similar colours and icon styles, but there’s definitely room for improvement.

โฐ If I had more time

  • I’d adjust the stroke width of the icons to make them more uniform.
  • I’d add some animations to make the dashboard more dynamic.

๐Ÿ’Œ 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 2 of my challenge. See you tomorrow for Day 3!

with love and light ๐Ÿซถ
Yoshie

p.s. We found this vegan chocolate pudding in Edeka yesterday.

I love the design and concept. Super cool. And the chocolate pudding is possibly the best Iโ€™ve ever had! Unfortunately, their website isnโ€™t very accessible. I might do a challenge to improve some websites so this one could be a good one ๐Ÿ˜š

Related articles

Day 19 of 30 Day UI/UX Design Challenge: Getting Tidy! ๐Ÿ“ฆ

๐ŸŽจ Todayโ€™s Design Task Todayโ€™s task was a bit overwhelming but also rewarding. Just like decluttering a home, I focused on tidying up the design and content of a cluttered homepage. Show task description ๐Ÿš€ My Design Process Content Review: I went through all the content on the homepage, marking key services (green), calls-to-action (red), and redundancies (yellow). I added notes directly onto โ€ฆ

Day 12 of 30 Day UI/UX Design Challenge: Diving into Data Design! ๐Ÿ“Šโœจ

๐ŸŽจ Today’s design task Iโ€™m back with another exciting day of my UI/UX Design Challenge. I saw a job post on Dribbble and decided to tackle some of the requirements as my challenge for today. Task: Design the dashboard page based on the provided wireframe. (The requirement has a design of โ€˜Snapshot Viewโ€™ page but I decided to do only At a Glance page for this challenge) ๐Ÿš€ My design process I โ€ฆ

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