Maryland Reentry
Role in Project: UX/UI Design
Time Constraints: 6 weeks
Industry: Non-profit
THE BRIEF
Project Summary:
Maryland Reentry Center is a non-profit organization that assists individuals who are returning to their communities after being incarcerated. They are requesting a website refresh to modernize their site and make it easier for people to donate and become sponsors. They also want to be able to share their events with the community. The website redesign should reflect the organization's mission, values, and color preferences of blue, yellow, and gray.
Target Audience:
The website is primarily targeted toward people who are interested in supporting Maryland Reentry Center's cause, including potential donors, sponsors, and individuals seeking support services. It should also be accessible to individuals who may be unfamiliar with the organization and its services.
Deliverables:
-
A modern and engaging website design that reflects Maryland Reentry Center's mission, values, and color preferences.
-
A user-friendly website that is easy to navigate and optimized for search engines.
-
Integration with a payment gateway to enable secure online donations.
-
Integration with social media platforms to increase visibility and reach for the organization's events and services.
-
A content management system that enables easy updates and maintenance for the website.
THE ANALYSIS
Before
Objectives:
-
Improve the website's visual design to create a modern, engaging, and user-friendly experience for visitors.
-
Embed the ability for people to donate and become sponsors directly on the website, and make it easy for users to find and use.
-
Increase visibility for the organization's events and services, and make it easy for users to stay up-to-date on the latest news and information.
-
Ensure that the website reflects the organization's mission and values and that it is accessible to all users.
Pain Points:
-
Maryland Reentry Center had an outdated website design that was not visually appealing or user-friendly, making it difficult for visitors to navigate and find the information they needed. The site had a confusing or cluttered navigation structure, with important pages buried deep in the site, making it difficult for visitors to find what they were looking for.
-
The old site lacked necessary features, such as an online donation system or event management, which limited the ability of the organization to reach its goals. It was not optimized for mobile devices, making it difficult for visitors to access the site on their smartphones or tablets.
-
Content management issues plagued the old site, making it difficult for the organization to update the site with new information or make changes to existing content. Additionally, the old site was slow to load, which negatively impacted the user experience and caused visitors to leave the site before finding what they needed.
-
Inconsistent branding was also a problem with the old site, with different colors, fonts, and images used throughout the site, which created confusion and made the site feel unprofessional.
THE PERSONAS
The Wire Frame
To demonstrate the requested functionality in the revamp of the Maryland Reentry site, I developed several low-fidelity wireframes.
These wireframes illustrate how the proposed layout can provide a clean, navigable, and user-friendly experience.
The wireframes showcase the essential features and structure of the site, allowing stakeholders to envision how the new design will meet the needs of its users.
What THEY HAD TO SAY
Nakia did a good job getting to know the organization; creating our branding, websites and increasing our social media outreach and engagement.
-Maryland Reentry Center
The Mood...
The mood board for the redesign of Maryland Reentry captures a modern, clean, and professional aesthetic. Bold blue hues convey stability, trustworthiness, and dependability, while bright yellows add a cheerful and uplifting feel. The use of grey provides a neutral and calming background for the design elements to stand out.
The imagery on the mood board showcases diverse individuals, representing the agency's mission to provide support and resources to those who have been incarcerated and are reintegrating back into society. The typography is simple, easy to read, and conveys a sense of approachability and friendliness.
The design elements include a mixture of clean lines and curves, conveying a sense of structure and fluidity. The use of negative space enhances the overall sense of simplicity and modernity.
Overall, the mood board communicates a fresh, professional and welcoming new look for Maryland Reentry's website that will connect with its target audience and effectively communicate the organization's message.
THE STYLE GUIDE
Colors play a critical role in the visual design of the Maryland Reentry Center website. The primary colors of the redesign are blue, yellow, and white. These colors were chosen to convey a sense of professionalism, positivity, and hope.
Color Palette:
The Maryland Reentry Center website underwent a major update, and color played a critical role in the redesign. To create a modern and visually appealing website, a color palette of blue, yellow, and white was chosen.
Blue is used as the primary color and represents trust, reliability, and professionalism. It is used for headings, text, and other design elements that need to be prominent on the page.
Yellow is an accent color that represents hope, optimism, and positivity. It is used to draw attention to important elements on the page, such as calls to action and links.
white is used as a neutral color to balance out the brighter colors on the site and create a sense of stability and sophistication. It is used for backgrounds and other design elements that need to recede into the background.
Together, these colors create a modern and cohesive visual identity that reflects the values of the Maryland Reentry Center. By using a consistent color palette throughout the website, users will be able to easily navigate the site and focus on the most important information. The use of blue, yellow, and grey will create a welcoming and professional environment that helps users feel at ease and trust the services provided by the center.
Typography:
For the redesign of The Maryland Reentry Non-Profit website, Garamond is a wise choice for the main font. Garamond is a classic serif font that has been used for centuries, known for its elegance and readability. Its thin strokes and high contrast between thick and thin lines give it a refined and professional look that would be appropriate for the nonprofit's serious mission.
Montserrat, on the other hand, is a sans-serif font that would work well as a secondary font choice for the website. Montserrat is a modern, geometric sans-serif font that has a clean and straightforward design, making it easy to read on screens. Its sharp edges and geometric shapes create a sense of modernity, which could be used to complement Garamond's classic feel.
Using these two fonts in conjunction could help to create a visual hierarchy on the website, with Garamond used for headings and Montserrat used for body text. This would create a harmonious design that balances both the classic and modern styles, which would be appropriate for a nonprofit focused on helping individuals transition back into society.
Aa
MONTSERRAT
Aa
Garamond
Disclaimer:
Disclaimer: Please note that once projects are completed, clients have the ability to adjust, modify, and refresh the original designs conducted by Third Anchor Design Studio. While we strive to provide our clients with designs that meet their expectations, we understand that changes may need to be made after the project is completed. Therefore, if you notice any differences between the original design and the live link, please refer to this disclaimer and understand that the client has made modifications to the original design. Thank you for your understanding.