We love seeing all the different ways people use Typekit on their portfolio sites; these are spaces where people are putting their best faces forward, and we’re always fascinated to see which typefaces people choose to reflect their own distinct personalities.

Emily Brick website

UI designer Emily Brick takes a minimal approach to her homescreen, with an animated bulldog stealing the show at the top of the page. Header text is set in Proxima Nova Alt, and the body text is in the Light weight of Omnes. The effect of the pairing is clean, open, and friendly—with the last quality emphasized by the dog’s wagging tail.

Katie Christ website

Food stylist Katie Christ has an absolutely delicious-looking photography portfolio here. Have a snack nearby when you browse this site, because you will definitely get hungry. The monospaced Letter Gothic Std hasn’t come up often in a portfolio site, and we like the way it looks here—especially in the header, where it retains a lot of its retro-electric-typewriter aesthetic.

That’s it for this week’s sites; share sites you like in the comments!

This week, we’re feeling drawn in by the vibrant portfolios of a few creative agencies—all of whom take the opportunity on their own sites to show off skilled web design as well as some solid typographic choices.

Domani website

Domani makes a great case for itself as a creative agency with the bold images and clever animations on this delightful website. Futura PT is a perfect typeface choice to match this energy, and beneath these geometric headings, the rounded edges of Omnes pair nicely in the body text.

Makewell website

Makewell takes a more minimal approach to their portfolio page, and the result is a clean, straightforward site that tells a convincing story about their portfolio of projects. Type is carefully paired here, with Museo Sans used throughout and occasionally punctuated with a dash of Museo Slab.

Planet Propoganda website

Design is front and center at Planet Propaganda, with snapshots from their excellent portfolio on display alongside their thoughtfully composed method. The eye-catching type in the main navigation is Hellenic Wide, a digital adaptation of a metal type with roots in the late 19th century. Futura PT also appears in headers throughout the site.

That’s it for this week; share sites you like in the comments!

This week, we’re taking a break from our regular exploration of great uses of Typekit out on the web and turning our eyes closer to home. You may have missed it in last week’s excitement, but we’ve replaced the Typekit homepage with something completely new.

The original homepage first appeared way back when we made Typekit available to the public in November of 2009. Since then, web fonts have gone from fringe to mainstream, new trends and techniques in web design have surfaced, and now, with the launch of desktop font sync, Typekit is expanding from web fonts to fonts for all parts of the creative process. The old page had served us well, but the time had come to update the way that we introduce ourselves to the world.

old-and-new-homepage

Original Typekit homepage on the left and our updated Typekit homepage on the right.

Working with the talented people at Weightshift, we designed and built a new homepage to better communicate Typekit’s expanding role. We also took the opportunity to incorporate best practices and new ideas in web design that have evolved since the original homepage was designed. Here are just a few of the things we like about our new homepage:

Bigger, tangible type

type-examples

The original Typekit homepage featured a single example of web fonts on a white background. With the arrival of desktop fonts, we have an opportunity to present great type in use for all kinds of design, from the web to print to motion graphics and beyond.

To help communicate the ubiquity of type, we’ve incorporated a greater variety of examples from all sorts of mediums. We’ve also introduced more texture and depth to the page, which helps the digital type samples feel more tactile and touchable.

One page to rule them all

entire-page

Our original product walkthrough spanned multiple pages, telling a story about the features and benefits of Typekit piece-by-piece. For the new homepage, we decided to take advantage of a long-scrolling product tour pattern to tell a more cohesive story about how Typekit is unifying the use of type across mediums and tools.

Responding to context

responsive-layout

With the explosion of devices and screen-sizes that access the web, we can’t just assume that every visitor is sitting in front of a desktop computer. Responsive web design is a collection of techniques that have evolved to deal with that increasing variability, and the new Typekit homepage is our first attempt at incorporating some of those techniques to explain our product in a format more appropriate to the reader’s context.

Updating our brand

branding-old-and-new

Since our acquisition by Adobe over two years ago, we’ve been finding ways to integrate Typekit with Adobe’s other products in ways that provide benefits to our existing users without too much disruption. It’s safe to say that we wouldn’t have been able to make desktop font syncing so seamless without Adobe’s Creative Cloud platform to build upon. With more new users coming to us via the Creative Cloud, it was time for us to look more like a consistent part of the suite.

To that end, we’ve updated our logo and wordmark to better match Adobe’s other products, and we’re transitioning from our trusty old friend Omnes to Adobe’s custom branding typeface, Adobe Clean. We think this update stays true to Typekit’s heritage while making us more recognizable as a part of the Adobe family of products and services.

With our new homepage, we’ve done our best to fuse the best of what’s new with the best of our history, sometimes quite literally: the repeated background pattern is created from original Typekit logo concept sketches from Jason Santa Maria’s notebook. We’re excited about our new homepage and the direction that it points for our future. We hope it’s a site you like as well.

It’s playtime in this week’s sites we like, with games and activities for the kids we know (and our own inner children).

Schachschule screenshot

Kids who love puzzles and games might be attracted to chess early on, and with some help from the Chess School (Schachschule), kids near Zurich, Switzerland can begin to learn real strategy behind the game. The school’s website is fun to peruse, featuring crisp Omnes for the body text, Myriad and Proxima Nova Soft in headers and navigation, and Kremlin for a handwritten twist on sidebar headings.

Children's Museum of Pittsburgh screenshot

From a playground made of packing tape to the original set from Mr. Roger’s Neighborhood, the exhibits at the Children’s Museum of Pittsburgh are sure to set your imagination alight. Headings and navigation on the neatly organized site are set in Futura, which feels almost playful in this context.

Grumpy Lobster screenshot

Look no further than your iPad for a new kids’ book: Grumpy Lobster offers quick iPad downloads for a series of books by author and illustrator Jake Croft. Museo Sans Rounded is a clear, friendly choice for the website copy.

That’s it for this week; share sites you like in the comments!