![unicef.jpg](https://static.wixstatic.com/media/54a19c_f6acc060d8bf4f78abb0d0693755d5f9~mv2_d_3196_3200_s_4_2.jpg/v1/fill/w_490,h_491,al_c,q_80,usm_0.66_1.00_0.01,enc_avif,quality_auto/54a19c_f6acc060d8bf4f78abb0d0693755d5f9~mv2_d_3196_3200_s_4_2.jpg)
I Am Responsible
Illustration + User Interface Design
Despite 13 national laws and 17 more pending in congress, violence against children is still prevalent in the Philippines.
Through data gathered by UNICEF Philippines, we created a website that educates and creates conversation about child abuse. After all, a cause is only as strong as the people who stand with it.
*This is unpublished speculative work done for UNICEF Philippines.
![logosunicef.png](https://static.wixstatic.com/media/54a19c_2900e38d115a4a77975fd9491b000a0f~mv2.png/v1/fill/w_180,h_26,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/logosunicef.png)
Project Background
Taking Accountability
UNICEF Philippine's "I Am Responsible" is a campaign rooted on changing the culture of passivity towards violence against children into active participation.
Sparked by the troubling statistics from the national study on violence, the website's main objective is to increase advocates through awareness by presenting these numbers in a digestible, actionable manner.
Coming into the project, the logo, look, & art direction have already been set. All assets except the website's are not mine.
![](https://static.wixstatic.com/media/54a19c_421a37e7baa74931a0b7dcb197f8cace~mv2_d_1500_1257_s_2.png/v1/fill/w_488,h_409,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/54a19c_421a37e7baa74931a0b7dcb197f8cace~mv2_d_1500_1257_s_2.png)
![](https://static.wixstatic.com/media/54a19c_dd3c68746167481f9853a330ce19e8eb~mv2_d_3196_3200_s_4_2.png/v1/fill/w_392,h_392,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/54a19c_dd3c68746167481f9853a330ce19e8eb~mv2_d_3196_3200_s_4_2.png)
Design Challenge
Relying on Data
There was debate in the beginning on how to approach the tonality of the website. In the end, the team forewent an emotional route and, at the risk of sounding trite, just let the data speak for itself.
The website was built in a very utilitarian way, wherein the aesthetic & usability were designed around how best to present the data.
The art direction & illustration style followed the physical pamphlets tied with the campaign.
Illustration by: Tristan Yuvienco
User Experience
Prototyping
The UX design skews the data, user journey, and interface to its specific audience.
Key points:
○ We identified our four main users: the kids, their parents, teachers, and the average individual.
○ On the right: the wireframe mockup - a parallax website that engages the users to interact with the elements, to complement the data and copy-heavy content.
![UXUnicef.png](https://static.wixstatic.com/media/54a19c_06b7b5826c1e476498512a3d928a4198~mv2_d_2546_1408_s_2.png/v1/fill/w_506,h_280,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/UXUnicef.png)
Scroll down to see the website.
![](https://static.wixstatic.com/media/54a19c_bb146885cc194b7997e9ea761d81efb4~mv2.png/v1/fill/w_980,h_399,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/54a19c_bb146885cc194b7997e9ea761d81efb4~mv2.png)
Here's how it works:
![](https://static.wixstatic.com/media/54a19c_ce95ebcf5bdd4193819b4f6d1ae5e7fa~mv2_d_2000_1323_s_2.png/v1/fill/w_1450,h_959,q_90/54a19c_ce95ebcf5bdd4193819b4f6d1ae5e7fa~mv2_d_2000_1323_s_2.png)
![](https://static.wixstatic.com/media/54a19c_cbc8711cd4a24d9c9bb81dc78ae7397e~mv2_d_2000_1323_s_2.png/v1/fill/w_1450,h_959,q_90/54a19c_cbc8711cd4a24d9c9bb81dc78ae7397e~mv2_d_2000_1323_s_2.png)
![](https://static.wixstatic.com/media/54a19c_124fd404625b49b1bc6ffeeb253e0a26~mv2_d_2000_1323_s_2.png/v1/fill/w_1450,h_959,q_90/54a19c_124fd404625b49b1bc6ffeeb253e0a26~mv2_d_2000_1323_s_2.png)
![](https://static.wixstatic.com/media/54a19c_020e389594d44306a7e030a94e396ef2~mv2_d_2000_1323_s_2.png/v1/fill/w_1450,h_959,q_90/54a19c_020e389594d44306a7e030a94e396ef2~mv2_d_2000_1323_s_2.png)
![](https://static.wixstatic.com/media/54a19c_78c3f0cbbc184d0598a6671715f7365b~mv2_d_1500_1370_s_2.png/v1/fill/w_490,h_448,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/54a19c_78c3f0cbbc184d0598a6671715f7365b~mv2_d_1500_1370_s_2.png)
Although the project didn't push through, it was a good exercise on data organization and visualization.
Up to now, Filipinos have yet to realize how pervasive violence against children is. People limit its meaning to the more brutal and newsworthy, not realizing that there is a more vicious form being perpetrated everyday: physical and verbal abuse inside our communities, by parents & peers. Donate to the cause, here.
Music from case study video by Alan Gogoll.
Executive Creative Director: Joey Tiempo
Associate Creative Director:
Ryan Caidic & Cj De Silva-Ong
UX Designer: Mark Baul
UI Designer & Illustrator: Mariel Empit
Copywriter: Nick Nakpil
Front-end Developer: Dianne Madamba
Digital Producer: Paul Carrera
Project List:
+ I Am Responsible