Cidade Reclama

Cidade Reclama was a project of the advertising agency I worked for in 2012, Princi Web. The proposal was to develop a public service using Google Maps API and aimed to experiment with new technologies of that time, such as HTML5 and CSS3. The project was initiated by Rodolfo Pereira, who presented the idea to me and invited me to participate as a Designer and Front-end developer. Despite being a great challenge at the time, I promptly accepted the opportunity because I knew it would be a great chance to put my design knowledge into practice and learn new CSS3 concepts.

The project aimed to create a portal for reporting infrastructure problems in cities, such as potholes, lack of public lighting, overgrown areas, among others. The idea was to make the complaint publishing process easy through a simplified process in just three steps.

Later, we developed a mobile version of the site in order to submit it to the W3C Brazil mobile contest.

The visual identity was created by Marcela Picheco, who sent me a brand manual to start designing the service interface.

Considering that the project had an urban character, I decided to incorporate visual elements in the interface that referred to the streets, such as asphalt and construction stripes that are common in cities. The idea was to create a visual identity that was easily associated with the environment in which the complaints were being made.

In addition, the interface would be clean and objective in all stages, always with a prominent call-to-action for the main functionality of each screen. I was gradually learning one of the principles of functionalist design - form follows function.

For the mobile version, I adopted a relatively new trend at the time, the flat design, still with the goal of creating a clean interface that highlighted the main objective of each stage of the process.

Despite having little experience with Design at the time, I was very pleased with the final result. Even today, I am still impressed with how I was able to apply some concepts that were still unknown to me at that time.

Both for the desktop and mobile versions of the website, the most modern standards of the time were used, such as HTML5 Boilerplate and the Modernizr library, which helped in creating polyfills for browsers that did not yet support the use of new HTML5 and CSS3 elements.

The success of the service was confirmed by its publication in newspapers of the time, including on television, and the mobile project was selected as a case study by W3C Brazil. We were invited to present it at the 2012 Web Conference, where I had the opportunity to give a talk to a technology audience at the age of just 16 🤩