Had the pleasure to work with one of the greatest team, AFH, on their public website update.

Who is Artists For Humanity?

AFH is a non-profit organization that provides under-resourced teens the keys to self-sufficiency through paid employment in art and design.

Art and design includes projects such as branding, animation, 3D design, photography, video production etc.


This was a project that took several months and I worked on a team with 4 other people.
My role was the website design and develop on WordPress.
Before heading to the website design, my team and I did research, testing, sketches etc. Follow the process below:


In order to discover AFH and needs and problems regarding the website my team did these studies:
- Meetings to learn ‘Needs and Problems’ and documentation of those
- ‘Analysis of the Current Website’ in order to learn values and needs
- ‘Persona Study’ to define audience and learn the patterns
- ‘Information Architecture’ studies and workshop
- ‘User Journey Map’ to discover users’ flow
- ’What AFH provides for different personas’ in order to show the capabilities of AFH to its audience clearly
- Studying ‘Analytics Data’ to get insights regarding the audience.

Needs and Problems

Current website does not have:
A clear navigation
It has a lot of information which makes it overwhelming and hard to follow
It is not responsive

Persona Study

Primary users are:
a. teens
b. clients
c. donors

Secondary users are:
a. Supporters
b. Parents
c. Young Adults


Teens are the whole reason why the AFH exists. Artists For Humanity (AFH)’s mission is to provide under-resourced urban youth with the keys to self-sufficiency through paid employment in art and design. AFH is built on the philosophy that engagement in the creative process is a powerful force for social change, and that creative entrepreneurship is a productive and life-changing opportunity for young people. Bridging economic, racial, and social divisions, AFH enriches urban communities by introducing young people's creativity to diverse businesses.



Client are the people or organizations that need creative services or spaces to organize their events.
This is a study for the creative service`s client.
Name: Elaine
Age: 38
Profession: Vice President of Property Services
Description: hires vendors for creative services relative to an apartment complex on by company, lives in suburbs, interests in community connection
Wants and Needs: lobby renovation, needs art to attract new younger tenants, interested in community connection
Importance The clients provide the jobs which are the foundation of our business model - as it is in the making of art and design solutions that the teens learn persistence, confidence, and a range of art, design and 21st century skills, building their capacity to collaborate, present, become exposed to workforce development (different career opportunities), and have access to the business world and people that they otherwise may not - this is the impact. Without the jobs for the teens to work on it would not be our business model.
Motivation and Needs to Reach AFH (Website)
Clients for the services would like to see the range and quality and competitiveness of works that AFH does
Clients offer and inquire about hiring our services, and learn about the impact
AFH motivation for the Website
We want the clients to contact to set up a tour/meeting so we can showcase what we can offer and get hired!


Name: Ann Smith
Age: 30-90
Profession: Educated Professional
Description: urban,suburban, from any state
Wants and Needs: caring about young people, and love art.
Importance More easily to build a relationship with individuals
Motivation and Needs to Reach AFH (Website)
Individual donors go through the website to make an online donation
Visit the website to formulate how to support AFH
Donors want to read the stories at AFH to see the impact of AFH on the teens
AFH motivation for the Website
AFH really cares, authentic, care people’s needs, job,mentor, find a voice, part of a group

Information architecture


My role was to create the wireframe in Adobe XD

UI Design

Graphic Design team of the organization shared the branding id with us and all the necccessary informations.

My role was to create the landing page design and present it to the client.
For this part, I created a Keynote presentation.

This was a long process due to many ideas that I had presented to my client. Some of which are presented on this prototype made in Adobe XD:
Together with the creative team and the board of directors, we decided to go with this design:

This website is being developed on WordPress.
The link to the website will be published soon, as the work is still in progress.

Thank you!