Penny Juice

Thank you for the intro course! As a design student, diving into coding was constantly on my mind, but honestly, it seemed a bit scary😑 . This course was a game-changer for me – loved how simple and clear everything was.😃

I got inspired and decided to take on a rebranding project for a website I found, Penny Juice. I've put together a little presentation of the rebranding work below, focusing on elements that, I thought, would really make the design pop.

The journey started with some brainstorming, aiming to inject some life into the website with a focus on making things more engaging for users. The CSS classes were a huge help, especially the bits on hover effects – totally made use of that. I also brought in some of my motion design chops to spice up the background with GIFs (can't get enough of them 😁) that come alive when you hover over parts of the site.

What went well: 🤘

Managed to pull off the ideas I had in mind.
The step-by-step guides in the tutorials were spot on.
Got a basic interactive site up and running!

Hurdles: 👎

Had some issues with section heights; my content kept getting cut off by the section below for some reason.
Making the site look good on different screens was a bit of a struggle. Flex display and column stuff just weren't cooperating.
Keeping the font size consistent across different screen sizes was tricky.

Takeaways: 🙌

There's always room to level up. Getting more into CSS animations and layouts could really amp up the site.
Keeping track of time and organizing files is key – balancing design sketches, reference hunting, and HTML tweaking is no small feat.
Patience is a virtue – dealing with code bugs is part of the process.

Most importantly, I learned the significance of not overthinking. Successful designs are based on clear objectives and the achievement of required goals, irrespective of the style employed. Finally, remember to HAVE FUN! 😌

You can view the full website here : https://pennyjuic3.netlify.app

I would recommend viewing in on a desktop for a better view:

I would sincerely appreciate your overall thoughts and help on how to make it responsive because I struggled 😩