HELP by AMG
UX Research, UI Design
Type
Team project
2 members
Tool
Figma
Canva
Google Workspace
Duration
6 weeks
MY ROLE
Team Leader
UX researcher
UI designer

HELP by AMG works to help at-risk and homeless youth, providing them with essential everyday items and providing them with a bridge to other services and opportunities to improve their lives and well-being.
My team and I redesigned the HELP by AMG website to help the organization achieve its goal of attracting more volunteers and donors.
Introduction
The goal of this study is to conduct an in-depth study of the header and footer of "helpbyamg.org/" to develop strategic improvements that will attract more volunteers to this organization and attract more donors to support this organization.
By optimizing the site's header and footer, we hope to improve the site's attractiveness, functionality, and user experience, thereby increasing volunteer and donor participation and contributions.
Objective

-
This user study aimed to understand volunteers' and donors' impressions, motivations, and expectations, and suggestions for the header and footer sections of a nonprofit organization's website.
-
Through three interviews with participants, we obtained information about users' perceptions of website design and functionality and their motivations for volunteering and donating.
User Interviews Key Findings
Impressions and expectations:
-
The interviewees generally gave positive comments on the interface design of the websites of the non-profit organizations they mentioned and thought it was concise and easy to browse and understand.
-
They believe that a non-profit organization's website should focus on potential clients and provide important support and resources.
Motivation:
-
The motivations of interviewees for volunteering and making donations are mainly to help others and give back to society.
-
At the same time, the interviewees specifically mentioned promoting social justice and supporting the development of specific fields, such as youth education, community development, and environmental protection.
Header and Footer Expectations:
-
Interviewees expect header and footer sections to provide important information and navigational features that increase the usability and appeal of the site.
-
They want headers and footers to include links to things like contact, social media, donations, and financial reports.
Interview Results
-
For teachers, I designed the sign-in and grouping functions, so that they can easily understand the attendance of students and make reasonable grouping arrangements as needed.
-
In addition, teachers can also check the students' seats and names through the bracelet, effectively avoiding mispronouncing students' names.
For Teacher














Consider brand consistency:
-
The navigation bar buttons use the dark blue color of the "HELP by AMG" logo, which emphasizes the importance of the button while retaining the original style.
Emphasize core content:
-
In the header, add the site's title next to the logo to more clearly display the site's name.
-
Add a "Home" button to the navigation bar so users can easily return to the home page.
-
Use the dark blue buttons to highlight core content such as "Volunteer" and "Donate".
Optimized footer layout:
-
Remove public document files and re-layout the "Get in touch" section to better match the overall page style.
Emphasize site description:
-
Highlight the description of "HELP by AMG" at the bottom of the page, using a darker color and larger font size to reinforce its importance.
-
-
Reduce Cognitive Load:
-
Follow the Gestalt principles to ensure that the design of the website is simple and intuitive, and provide consistent navigation and button styles to reduce the cognitive load of users when browsing and using the website.
Design Learned
Consider brand consistency:
-
The navigation bar buttons use the dark blue color of the "HELP by AMG" logo, which emphasizes the importance of the button while retaining the original style.
Emphasize core content:
-
In the header, add the site's title next to the logo to more clearly display the site's name.
-
Add a "Home" button to the navigation bar so users can easily return to the home page.
-
Use the dark blue buttons to highlight core content such as "Volunteer" and "Donate".
Optimized footer layout:
-
Remove public document files and re-layout the "Get in touch" section to better match the overall page style.
Emphasize site description:
-
Highlight the description of "HELP by AMG" at the bottom of the page, using a darker color and larger font size to reinforce its importance.
-
-
Reduce Cognitive Load:
-
Follow the Gestalt principles to ensure that the design of the website is simple and intuitive, and provide consistent navigation and button styles to reduce the cognitive load of users when browsing and using the website.
Design Learned
-
In order to meet the above design challenges, I designed the wristband navigation function to help students quickly find the target classroom and avoid the embarrassment of getting lost.
-
Secondly, the wristband is used to sign in on the table, which is convenient for students to record their attendance, and at the same time provides the function of viewing course information to ensure that students enter the correct classroom.
-
Finally, students can receive important messages to students such as "I am here" through the wristband.
For Students

Get in Touch
