User Experience Designer

Cnnct. - Case study

Cnnct. - Case study for Bitmaker U/X bootcamp program - June 2016




70-80% of jobs are secured through networking and it's estimated that 40-50% of the population is introverted. For an introvert, attempting to network in-person within group settings is daunting. 

The goal of this project is to provide a platform that evens the playing field for introverts. In turn, it would provide employers and other people of interest a chance to connect with them.



Cnnct - a networking app that allows a user to connect with people they've crossed paths with at their convenience. The design revolves around the idea of users having business cards populated based on their LinkedIn account profiles. When two Cnnct users come within each other's proximity, these business cards would automatically be shared with each other.  Similar to dating apps, two users can chat with each other when they both express mutual interest in connecting.


Designing the Cnnct cards. 


The starting point for my interest in tackling this challenge began with the following book:

Quiet had a profound impact on me personally and helped me gain a deep understanding of what makes an introvert tick.  Tapping into this book, I kept the following considerations in mind through out the design of Cnnct:  

  1. Introverts seek in-depth 1:1 conversations

  2. Introverts have an aversion towards uninvited disruptions / intrusions to their thought process.

  3. Introverts value being prepared in advance of a discussion and struggle with on-the-spot small talk.

Going off these three considerations, I knew I needed to design an app that was content-driven, uncluttered and straight-to-the-point. 


user research.

To expand upon my understanding of introverts from Quiet, I set out to to conduct my own research. I collected five in-person interviews which included a mix of two introverts, two extroverts and an ambivert. The results of these interviews helped me form three personas and their respective job stories. 

The three personas can be viewed here (click each image to view):


user research. (continued)

Establishing three diverse personas provided me with a scope of what was needed to appeal to extrovert and ambivert individuals in addition to introverts. Looping back to the original challenge, in order to improve the networking prospects for introverts, I knew the pool of Cnnct users must expand to include non-introverted persons.

The resulting job stories from all three personas are summarized below. 


design research.

Professional, modern and clear; the design I set out to build needed to convey all three. To achieve this, I went with the following decisions in relation to establishing a style tile:


A colour palette consisting of shades of purple, grey and white. While most networking applications today use blue as their primary colour to convey communication and safety, my choice to go with purple takes the calmness of blue and combines it with the passion of red to convey ambition. In addition to purple, the inclusion of grey brings with it a notion of formality. 


To achieve the modern look, I opted to focus on the use of two sans serif fonts. Bangla MN as the bolder font and Heiti SC as the lighter font to provide contrast.


Taking a note on the importance of affordances from The Design of Everyday Things, I wanted to tie in affordances based on networking norms into the design. I landed on two key affordances:

  1. The use of business cards as the canvas for each user's profile. These cards would be flippable, providing more background information on each user. Designing a network app brings with it the risk of it transforming from a professional platform into another dating medium. With the flippable design, I intentionally placed a user's profile image on the reverse side of the card. The two-step process to viewing a user's image is intended to create a deterrence to the behaviour of browsing for profile images.

  2. Using handshakes as means of expressing interest between users that want to connect.

Resulting Style Tile



Having established a style tile, the process of laying out the user's flow was done in Balsamiq and laid down the blueprint for 4 weeks of sprints to wireframe, user test, mock up and hi-fi design the app. 


iteration and user testing. 

During the sprints, the assets that saw the most iteration were the cards. The cards needed to convey the following information:

  1. Only the first name of a user and profile image as an option - to maintain their privacy 

  2. What their seeking to connect with others. This provides Introverts with the material needed to establish a topic of discussion.

  3. A snapshot of their personality, experience, education and skills

The cards evolved based on feedback received through instructors and user testing. This included attending UserTestingTO and having attendees test out an Invision mock up. The evolution of the cards can be summarized into the following three major versions, with V3 being the final state. 


closing remarks.

I hope this glimpse into my design process of the Cnnct cards has peaked your interest in giving the demo a whirl, if you haven't already. You can access the demo by clicking on the following button: