Skip links

Diverse-City

An advocacy website project informing the people to challenge the concept of lookism, a discrimination based on looks. The website contains information and some sample articles and stories as well.

FEATURED & AWARDED AT THE MULTIMEDIA ARTS FESTIVAL 2018

DESIGNER

Alyssa Maac

PROJECT TYPE

Web Design
Web Development
Graphic Design

TOOLS USED

HTML5
CSS3
Adobe Illustrator

CONTRIBUTORS

Jennifer Agarpao
Andrea Carreon
Alli Cunanan
Rochelle Mempin

01

ABOUT THE PROJECT

For our finals project in our web subject, we were grouped to create an advocacy website platform using HTML and CSS. We chose ‘Lookism’ since it is important now more than ever in globalization. Lookism is a prejudicial attitude conferred to people because of their physical appearance (Desir & Tietje, 2005). Each member of the group made their own version of the website but we used the same color, branding, typography.

02

CONCEPT AND DESIGN

For my interpretation, I used 5 colors to attempt diversity. Each colors were assigned to sections for a sense of separation. The photos used are of people from different backgrounds and culture. My design elements includes lines to show the “separation” of groups in the society. The two main typography used are ‘Playfair Display’, a serif, and ‘Montserrat’, a sans-serif. Using different fonts, showing the difference between people. For the layout, I did a broken grid to be more dynamic. By coherently working these elements together, it shows that the world will be better with diversity all the same.

03

CONTENT

When you scroll in the homepage, there are quotes to challenge perception. The very call to action tells a message. A testimonial of different persons. Starting with what people thought of them and then ending with the truth behind their looks. The articles and the stories pages have sample content to about the topic. The articles are for education and the stories are for case studies and testimonials.

04

DEVELOPMENT

The biggest challenge of this was to develop the website. We were only just introduced to CSS back then. But I’ve managed to learn through tutorials. And I also did several revisions after the project. The website is coded in HTML5 and CSS3 with some javascript plug-ins. The website is also fully responsive.

05

RECOGNITION

This project was awarded with “Certificate of Awesomeness” and exhibited at the Multimedia Arts Festival 2018 in De La Salle-College of Saint Benilde. You can visit the website by clicking the link below.

LAUNCH Website
Explore Work
Return to top of page