Client: AIGA Role: UI Designer Tools: Adobe Illustrator, Adobe Photoshop, Sketch, InVision, Principle Duration: 4 weeks

The AIGA Chicago Mentorship Program is a place where creatives from diverse disciplines gather to share insights, experiences and resources. It’s a great place to make new connections, exchange inspiration and even collaborate on a project or two.

Our task was to develop a platform that enables mentors and mentees to effectively communicate, interact and maximize their engagement with the AIGA Mentorship Program.

Persona

Competitor Analysis

competitors .jpg — **TAKEAWAYS**
Generous use of negative space reduces clutter and makes the screens look sleek and modern.
Vibrant colors convey a friendly, motivating and inviting aesthetic and feel.
Sans Serif Typography conveys the contemporary feel and increases readability.

Design Principles

COMMUNITY CENTERED

Users need ways to maintain their interest in the program to stay engaged.
The design should instill a good sense of community to keep users invested during their mentorship.

DESIGN THAT STANDS OUT

Users need to trust the quality of the platform.
The aesthetic quality of the designs should be at a level that designers can respect and trust.

CLEAR COMMUNICATION

Users need to feel that the platform clearly communicates information.
The platform should facilitate good communication and clearly relay the information that users need.

Moodboards and Styletiles

Branding

Brand Name and Logo Design

After deep research and multiple ideas I decided to name the project Knack. Knack, a talent or cleaver trait, represents talented and gifted individuals.

I introduced circles that are connected in letter K, representing a universe or a network. The circles are differently colored, and each color represents a different person. This means that Knack is a network of people that come from different backgrounds and interact together. Introducing bright, complementary colors, I wanted to achieve motivating and friendly feel.

High Fidelity Mockup - Version 1

Designing for designers was a challenge. We needed to create a design that would be cutting edge since our audience is very knowledgeable and has sophisticated taste. Therefore I decided to go with an offset design direction to promote a modern and dynamic look and feel.

I wanted to achieve a friendly and motivating environment by impementing photography that shows friendly people interacting and using non-stocky imagery. I introduced green, red and yellow color into my design, to achieve a motivating and fresh look. Green is a primary color and associate to freshness, energy, and growth. As a secondary color I used red. The red color is enthusiastic and draws the attention of the users and make them take action. Yellow color gives a vibe of joy and optimism. For better user experience, cards are evenly laid out and make a clear separation between sections. Generous use of white space help users to easily navigate through the website. Additionally, white space achieves a clean and professional look and feel.

High Fidelity Mockups - Version 2

I realized a colorful logo was challenging to pair with colorful backgrounds; therefore I decided to introduce a white background on the header. This helped the logo to stand out. Cards on the first version looked outdated, so I decided to introduce white space and to make them bigger to achieve a modern look. Chapter Cards on “Meet the Mentor” page were not intuitive and looked outdated too. Therefore, I introduced white cards with colored headers. Additionally, creating longer and sleeker cards, I achieved a modern look. The feedback I received from my creative directors and teammates matched my opinion.

Hi Fidelity Mockups - Final Version

Prototype

Marketing Website

mweb kanck cs.png — The marketing website I created for Knack carried over visual elements from the website version to advertise and communicate the Knack brand.
**Prototype**