BERRYSOUP

Re-designed a website that showcases desktop wallpapers

BerrySoup is a personal non-profit project I took on, providing free to download desktop and mobile wallpaper versions of my digital art. This project started out as a hobby and something to stimulate creativity, but now it's a project I hold close to my heart.

PRODUCT TYPE

Website

ROLE

UI Design, Front-end, Visual identity

TOOLS

HTML, CSS, Javascript, Figma, Procreate

TIMEFRAME

June 2022 – May 2025

Process overview:

Web visitors would run into accesibility issues, while the overall website doesnt properly reflect BerrySoups values and personality

The problem:

The main problems found in this version from user feedback would be:

  • No zoom in feature

  • difficult to find and click the download button

  • Wallpapers could be streamlined

  • Overall design and style is lacking, doesn’t display BerrySoup’s personality through the website properly

⭐ The first step in this task is to re-map and sketch out new wireframes to address these concerns.

Project planning:

To have a better guide on how to start and what exactly I wanted to work on, I started out with a couple sketches and a rough user flow diagram.

I started to draft ideas for the re-design

Playing around:

With the feedback provided, I made a quick wireframe to visualize an approach to solving these usability issues. This would include the zoom-in feature, clearer download buttons, and matching that BerrySoup style and design within the site.

Medium fidelity wireframe:

I chose to keep the same branding assets such as the logo and colour scheme of light blue. To this, however, I added a warm brown shade for accents and buttons, and included a pattern in the background to add some texture.

While putting together the website and the intial design I had in mind, there were alot of shortcomings I didnt realize and limitations within the web builder I had decided to use.

Some mentions:

  • The zoom-in feature didnt exactly work the way I planned since squarespace had a similar feature avaliable. Because of this, the plan shifted as I no longer needed an icon as previously mapped out.

  • I opted for a download button rather than icon due to issues within the web builder

  • Added a new light yellow colour to the palette as an accent colour for CTA’s

  • Re-organized the homepage since it felt way too cluttered once I actually started to implement it

  • Reduced the amount of CTA’s on the homepage

  • Removed the mustard yellow colour, felt out of place in the palette

Ran into some unexpected shortcomings and changes

The challenge:

The outcome of those changes:

Results:

The previous usability issues have now been resolved, while the overall user experience had been drastically improved from the original version in 2022.

I’d say that my main key takeaways from this re-design project would be:

Design Is Never Truly Final.

  • One of the biggest lessons I learned is to never assume that your high-fidelity wireframe draft is 100% complete. Unexpected challenges will always arise, and being adaptable and ready to solve problems on the go is crucial.

Design Is Full of Choices.

  • There are often many valid ways to approach a design, which can make it difficult to decide which direction to take.

What helped me was focusing on three key factors:

  • Cross-platform consistency

  • Intuitiveness of the user experience

  • Contribution to or potential harm to the overall structure of the product

Design with Purpose

  • It's essential to always keep in mind who and what you're designing for. Your design decisions should align with the brand identity and the visual concept of the client, organization, or project. Staying true to that vision ensures a cohesive and meaningful user experience.

Reflecting on the final iteration, I would say it 100% reflects the brand concept now compared to before.

Mock-ups:

Video Demo:

Here’s a quick demo of the 2025 re-designed BerrySoup account which features all the wallpaper art and visuals that I’ve created.

Thanks for watching!

Still here? Check out my other projects 👀

Keep reading

CARLETON VOLLEYBALL

Designed and built Carleton Volleyball Club website

Led UI Design and Front-End development for Carleton Volleyball Club website to streamline registration and organize drop-ins.

CANADA AGRICULTURE AND FOOD MUSEUM

Built a fun, educational game for children at the museum

Created an educational game to engage visitors and children to interact with museum activities through a scavenger hunt.