Project pet peeve
World's largest complaint board
About PPP
PPP is built to be world's largest complaint board. It was built with the intent to be a fun, and simple place where people can share what drives them crazy. My role in the project was design intern.
Persona's
Branding
Why Yellow?
Choosing the colours for the ppp brand was difficult in a fun way. Pet peeves usually cause people to get mad, or frustrated and when you look up colours that make people feel angry the most common one was red or black. With having a brand that is about something so negative like pet peeves, we wanted to make it as positive and fun as possible. Yellow induces warmth, brightness, energy and attention.
Colour Palette Ideas
Final Colour Palette
Fonts
Deciding on the font for ppp was kind of a longer process than I expected but it taught me a lot about the importance of fonts. One of the biggest struggles was finding a font that had a lot of variety to it (bolds, italics etc.) We knew we wanted something simple that was playful but also somewhat formal as well. When I started to look through them I focused on what all the numbers and letters of each font family looked like, than categorized them into fonts with more variations and fonts with less. We ended up deciding on Libre Franklin which a sans serif font that had lots of varieties to it and worked perfectly in the contexts we needed it too.
Language & Tone
The language and tone for ppp was a very important part of our branding process. We didn't want the idea of ppp to come off to negative which is why we settled on yellow as the primary colour. We came across the same problem when developing the language and tone for the platform. We didn't want it to come across as too angry and whiny we wanted it to have some comedic aspect to it as well. Using hyperboles helped add a comedic aspect to it as well as focusing on having a tone thats genuine and not too formal but also a bit witty and playful as well.
Logo
Deciding on the logo was a very fun process for me. With the name being Project Pet Peeve we knew we wanted to do something with the three P's. We wanted something that would be really simple but eye catching. We ended up with just a simple circle in our brand colours with three P's in Bauman's font with a 10 px radius on the ends to give it a more friendly feel.
Wireframes
Low-High Fidelity Wireframes
Here is the time line that took place with developing the web format of project pet peeve. Starting with with the low fidelity and ending with the almost finished product. Each step we realized what was missing and what wasn't working.
Low-High Fidelity Wireframes
Here is the time line that took place with developing the mobile format of project pet peeve. Starting with with the low fidelity and ending with the almost finished product. Dealing with a smaller screen definitely made it different then designing the web one. The navigation ended up being the biggest factor that influenced a lot of the decisions we made.
Final Product
Socials
Instagram Posts
