Website for NPO Quebrar o Silêncio

QUEBRAR O SILÊNCIO - in English “Breaking the silence” - is the first Portuguese Non Profit Organization dedicated to help boys and men overcome sexual abuse trauma.

The association started on January 2017 and on their first week they received close to 50 contacts for help. Only 14 months after that, a few men already have a new life after receiving support.

Context

Ângelo Fernandes is a very good friend who happens to be one of the most courageous people I ever met.

As the association was planned to launch, a website was needed to publish their communication.

I was given the opportunity to contribute to the project by helping to build their website.

Challenges

The website would be built using WordPress and I had only one experience with the platform, a few years ago.

I know very little about PHP, the language WordPress is written on.

The deadline was tight and I needed to articulate with Ângelo's availability for continuous feedback and approval on every stage of the work.

Process

First we listed the key contents. I inserted each one in cut paper pieces and gave it to them, so they could prioritize the identified elements. This image was the first arrangement.

wireframe

After that I drew a homepage wireframe and as they matured ideias, the elements were rearranged.

wireframe

Next task was to find a theme and as fewer external widgets as possible, that worked well together to deliver the content needs.

Turns out WordPress came a long way since I first tryed it, and it was easier than I though it would be, to creat the child theme and to find decent widgets to work with.

When the structure was stable and approved, I designed a very simple UI, with a fixed width layout, as requested.

screenshot

Ângelo was pleased with everything except the colour scheme. But instead of iterating, Ângelo asked to do it himself. As he is a graphic artist, I prepared a CSS override where I grouped the similar graphic elements, so he could try different tones until he was happy.

In this case, Ângelo belongs to the target audience. So more than building the website with a client, I built it with a user. And my user turned out a good UI designer :-)

Final product

screenshot

As in all other frameworks, as soon as you finish your first project, you're ready to start over and do it better. And we'll do that in the future.