How do you design a versatile visual language, so that it appeals to a very diverse mix of people?


Ottawa Civic Tech started around the summer of 2016, aiming to curate a community with people from government, non-profit, private sectors, tech companies, and civic communities. It is a Meetup with people from diverse demographics and professional backgrounds, all brought together by the goal of using technology to improve the way civic lives are lived. By the beginning of 2017, the group had grown enough that it needed a visual identity that people can recognize and own.


Co-design/Learning

I started the project with researching different visual styles with mood boards, and clarifying the vision with the group organizers.

The organizers wanted to continue growing the presence of all levels of government, private technology sector, and civic community. Thus, the visual language needs to be able to appeal to all of these segments. With that in mind, I created a few concepts to test.

moodboard
Community feedback

Through in-person meet-up sessions and online Slack channel, I kept the community engaged and take in their thoughts and feedbacks. From testing the three concepts, I learned:

  1. The iconic shape of concept 1 was appealing, but doesn't think the imagery of the group should be tied to local government (City of Ottawa logo)
  2. The sub-groups of people perceived concept 2 very differently. People reported liking the colors, but some felt the 8-bit too 'techy'.
  3. The peace tower in concept 3 as a central motif is too kitschy and overused; doesn't pass the bar to be a meaningful and authentic symbol for the group
  4. A member suggested using the Ottawa area's heart shaped outline as a motif. After some more research, it does seem to have more affinity with community building initiatives
Community feedback

Solution: I used the colors in concept 2, and replaced the 8-bit style with a sensible sans-serif typeface. This is to avoid sending the wrong potential message of 'tech elitism’.


Design concept: An open and colorful dialogue

Brand: After discussing various concepts with the group and the plans for this organization, we decided that we liked the idea of promoting the group with openness, diversity, and pragmatism. In the spirit of this ethos, this brand is open source on GitHub for any other member in the group to iterate upon.

CT Ottawa Logo in action

Logo: The logo is simply text-based, because the concept is relatively new in the targeted spaces. The logo appears as if it’s being typed out on a computer screen with the caret; this is much like the Ottawa Civic Tech group: a digital conversation in progress. More, the color line can reshape into anything to fit the context, just like this group is full of potential for many things.

CT Ottawa Colors

Vibrant colors: The vibrant colors stand for the diverse group of people in Civic Tech. The color palette is also useful for tagging different categories (i.e. type of project, set of skills, etc) if there is a need for it in the future.

CT Ottawa Typeface

Type choice: Given the group’s robust online presence, I chose a sans-serif type family (Proxima Nova) that stands well in the digital space, for its geometric yet fluid contours.

Sample logo placement

(an example of the logo used with Ottawa area shape in social media banners)


A Little Love from the Community


Why I wanted to do this

I’m a big fan of Meetups, because I believe in cross pollination, and using my tech skills for good. This group does exactly that. Ottawa being a government town, but also “Silicon Valley North”, I thought there was an opportunity for creating an interesting community here. This is but just the start of this community, and I hope to see more open and honest dialogues in it.