Case study: Mandela partners landing page
A Visual Design Sprint Project
Food. We all have the right to clean, healthy food. This is the belief of a little non-profit in Oakland CA. They are nourishing low-income communities with locally farmed produce and giving the rest of the world… hope.
Choosing a site
There are plenty of non-profit companies that need help designing their websites or apps, but don’t have the financial means to pay someone to design it for them. These organizations can post on catchafire.org and designers can pay it forward and help them out. I am a User Experience Design Student and as I was browsing the catchafire site for my next project, my eyes stopped at Mandela Partners. Probably first, because of the image of produce, but I decided to design a website for them, because of their mission statement.
Mandela Partners is a non-profit organization that works in partnership with local residents, family farmers, and community-based businesses to improve health, create wealth, and build assets through cooperative food enterprises in low-income communities.
Visual Design Challenge
At the time that I was starting my project, I did not find a live website associated with the organization. The information I had to design off of, was their mission and their logo:
I decided to design a site with the colors above; olive green, dark yellow, and almost black. From there, I asked myself over and over, throughout the design process, this sentence, “If I were a user of this site, what do I NEED, what do I WANT, and what would surprise me?”.
When a potential user firsts lands on the site, it needs to be obvious what Mandela Partners is and what they do. Since it is also a site for families, I wanted to make it family friendly with some bright images and a “coming together” vibe. After a couple of days, my first draft came together.
Incorporating Critique
I got some great feedback and critique of this first draft from my UXD instructors and fellow students. They all seemed to like the images, but noted that they could downsize a bit and add more descriptive text next to it. Filling up a bit of the white space. The footer was unfinished and I wanted to add another section about community events. I also got some feedback to play with texture in the background and to change the white to off white
During this time, I became aware that there actually was an existing site for MandelaPartners.org. I decided to stay with my original idea and just polish it up. However, as I was browsing there live site, I watched a video that really helped me see how they are making the healthy produce available to low-income communities. This is something I really wanted to highlight immediately on the landing page. I thought it was unique that they are putting healthy, organic produce right into the corner stores (where you might not expect to find fresh food like that). Partnering with the local shops, helped them make this amazing food accessible to low-income families. Taking all of the into consideration and following through with some of my original design/thought process, my final draft came to be.
Here is a side by side view, so you can see the changes. Note that although the length of the landing page is similar on both, I fit a lot more content and detail in the final, without overcrowding the page.
Conclusion
Although there were times that I wanted to pull out my hair and throw my laptop out of the window, I learned a lot about alignment, spacing, font style, images, consistency and much more than I expected to learn from this project.
Plus! I got to bring a little more awareness to a cause that is near and dear to my heart. Next time you bite into a juicy apple, take a moment to really taste it and enjoy it!
Nora Pirsch
