Responses by Firebelly

Background: TDC.org tells a story. It fortifies the Type Directors Club’s (TDC) position as a leading authority on all things type and injects the brand with fresh vitality, while celebrating the community and driving increased membership sign-ups and renewals. Our target audience: current TDC members as well as young designers and type neophytes that represent the industry’s future.

Highlights: Type type type. Unlikely type pairings embody the TDC’s approachable eccentricity, while Heldane Text—a fresh take on Renaissance-style typefaces—speak to its legacy. Rounding things out is Space Grotesk, a friendly, open-source sans serif that captures the TDC’s commitment to its growing community. We also put the fun in fundamentals: white space, hierarchy and healthy balance between imagery and type, with plenty of moments of surprise and delight packed in.

Challenges: The funky grid on the individual competition template. The point was to achieve a fresh “randomization” effect for each entry while creating an overall balanced mosaic. We used masonry.js to automatically position content along the grid, then built functionality to allow TDC content managers to adjust size and alignment. Then, we inserted a few hidden elements throughout the grid to create a healthy amount of space between pieces of content. Knowing it’d be a beast, we started prototyping this feature early on. It took some tweaking, but ultimately, it’s one of the more satisfying experiences on the site.

Favorite details: The interactive text boxes sprinkled throughout trigger a range of related imagery on hover state, pulling from the site’s content buckets and introducing an element of surprise each time. We selected the words, identified existing related posts and tagged them appropriately, then styled the words to pull an image from a random related post. As the site grows, the pool of related images will become more varied and interesting. We also love how The Member of The Month feature page and About page turned out—a strong sense of brand voice while elevating the individuals that have made the TDC what it is today.

Navigational structure: To help folks immediately understand and connect with the TDC as an established leader in its space, we organized the navigation according to the organization’s core values: Recognizing Excellence, Supporting Growth and Building Community—the three pillars forming the foundation of who they are and what they do.