PROJECT
Mudd Nick Foundation Web and Mobile Re-Design  

Mudd Nick Foundations is a corporation that provides life enriching opportunities for children and families in the state of Oregon.
MY ROLE
I am the Lead Web Designer for this ongoing project and report to the President of Mudd Nick Foundation. 

Work closely with a team of developers that I hired to create and maintain the website. I run regular design reviews with stakeholders every quarter. 

I manage freelance writers and train web managers, contributors and editors to work with the Content Management System.
SUMMARY
My team created a new website for​ M​udd Nick Foundation​ that enhanced content findability by 97% in 6 months.

The corporation had an old and static website that was difficult to navigate. I wanted to design a modern looking website with great usability on a range of different devices for visitors and employees.

Outdated coding and design have a big impact on a website. Users more likely to press the back button and search elsewhere when your site takes more than a few seconds to appear. With that in mind, my team agreed the priority was to focus on improving the user interface and building a content management system.

Mudd Nick editors requested a dynamic platform to update the information on a regular basis with multi-user capability. So I designed and customized access management for the new platform.

As part of a re-design, Mudd Nick Foundation board of directors were also seeking guidance on font selections and pairings going forward.

Style guide explorations played an important role in decision making on the direction that would be rolled out across both web and print collateral for the corporation.
PAIN POINTS AND GOALS
The old design was not responsive and mostly done in pdf with missing code standards and visual styles.

I made mobile a priority for the new design and defined a style guide with a collection of pre-designed elements, typography, colors, graphics and actions for contributors to follow. 

I had to recreate the navigation system to improve the content findability and design an organized information environment to help users complete tasks quicker and easier. 

The foundation was facing an exponential increase in the amount of data and information which had to be tracked, managed and protected continuously, therefore, I designed a reliable and secure database.

Stakeholders requested a dynamic website with an easy to use content management system to keep the website current and professional. 

The new website is based on Wordpress content management system with access management capabilities to ensure that proper users have the appropriate access to the backend.
USER RESEARCH AND ANALYSIS 
The most important breakdown in user research is between qualitative and quantitative research. I wanted to understand the user's world, learn about their challenges and come up with ideas for a new website. Also I had to validate how well the new design will solve problems.

Research techniques such as user interviews and meeting with stakeholders covered the qualitative research as the best audience insights surfaced during conversations. 

Numbers measure the effectiveness of a re-design, so I practiced methods such as A/B testing, remote usability testing and mouse tracking. 

Identified patterns on how people navigate the website using Google Analytics and Google Website Optimizer. 
INFORMATION ARCHITECTURE
CARD SORTING SESSIONS
Card sorting is a great way to become familiar with information architecture and user-centered design. It is also a great way of getting stakeholders involved in the process of designing a new website. 

I worked remotely on this project, and by using the right tools, and keeping the right flow, I managed to run a few card sorting sessions with my client. The main goal was to improve the labeling, clustering, and organizing the information and create a sustainable navigation system for the new site. 

The process of organizing content is fraught with questions. So from the beginning I made it clear that we should have a whiteboard dedicated to all the queries and suggestions. At the end of each session, I took photos and archived my discoveries. 
MUDD NICK FOUNDATION
STYLE GUIDE
COLOR PSYCHOLOGY 
Dark pink represents playfulness and joy. I wanted users to feel the joy and excitement of children by donating for a good cause. This color constitute compassion, nurturing, love and hope. It reminds audiences of the early childhood memories. 

I combined dark pink with blue which added strength and sophistication. Blue symbolizes trust, which was essential for donors and sponsors.

I wanted them to donate money with 100% reassurance using the website.
USABILITY TESTING
REMOTE TESTING
I use Morae for our remote usability testing sessions. Users are a selective of donors, staff and board members. I gave each user a few tasks with instructions to complete while observing them live.

The goal was to identify problems with the design. I have run many testing sessions so far, and the Mudd Nick Foundation website keeps evolving.

In addition to remote testing, I talk to the event attendees to get their ideas on how to improve their web experience.  
MOBILE DESIGN
FINDINGS 
At the very beginning of this project, I had many meetings with the stakeholders. Discussed the primary goals and recorded every single piece of feedback that I received from end users. If specifications are not clearly documented then it is likely to be forgotten and neglected. 

I spent more time up front to plan the whole re-design and trained the stakeholders on a few primary matters to avoid impossible requests. 

I hired developers to help me with the backend so I could spend more time on user experience and visual design. Performed QA and made updates directly in the code once the development was complete.

Re-designing a website lead to a short term drop in rankings before bouncing back up above its original position, so it was an important part of the stockholder training to manage expectations accordingly. 

I learned how critical it is to have a comprehensive list of pre and post re-design activities documented. With so many changes in the process, it is easy to miss a step and forget about primary rules and objectives.

This is not a final design, Mudd Nick Foundation keeps changing and evolving. I ask this question over and over again, how can I improve it?

I will appreciate your feedback, so please check out the website and share your feedback with me. 
DESIGN

OTHER PROJECTS