When the Adobe Muse CC team wanted a showcase for Typekit integration in the new release, Dani Beaumont, the principal product manager, turned to designer Aaron Lawrence with unbounded creative direction. As Aaron remembers it, Dani said, “Here are all the Typekit fonts, do whatever you want, have fun, use them, play with them, showcase them.”
It was a dream brief for the designer/type lover.
He knew immediately that he wanted to create a chapter for each font style: “I started laying out what was going to be about three months of work based on the font chapters. I didn’t want to rush it, I just wanted things to progress naturally.”
Then he got a second email from Dani
This time their conversation went something like this, “If you can get this done in three weeks, we’ll promote it when we promote the 2015 release of Adobe Muse.” Aaron, not one to shrink from a challenge, said yes, and began mapping out what had been a three-month-long project into one that would require three weeks of “every night and weekends” to meet his new deadline.
Fortunately, Dani had created a single project incorporating two of Aaron’s favorite topics.
But let’s back up for a moment…
Aaron came to the attention of the Adobe Muse team a couple of years ago when he submitted his personal site for consideration as an Adobe Muse Site of the Day. Since then, he’s been a Muse team favorite for his passion, his easy-going nature, his creative instinct, and his adroitness and appreciation of Adobe Muse:
“It’s an awesome tool. It gives me all the power and capability to do the work I want to do without having to translate it over to someone else. I think the first time I saw it, and what it could do, I was hooked. For four months, every weekend and all my free time was out the window; I just wanted to lock myself up and learn it.”
And that’s why, after asking him to design and build Sessions with Typography, Dani asked him if he could possibly build it faster…. she was certain he’d be using Adobe Muse.
And he was.
Play. It’s one of the reasons Aaron finds Adobe Muse so innovative… “When in the history of web design have designers had the opportunity to play? If you look at web design, you write code. And it takes time to write it. And it takes time to change things. But Muse gives power to designers to do whatever they want. And to do it fast. And to not have to worry about writing the code.”
That’s exactly how he began building Sessions with Typography. He played. With a basic plan, an unrelenting focus on the fonts, and Adobe Muse: “Never once did I pull out a sketch and really figure it out first, I just opened up Muse and started playing with design and with the click of a button, I could see what that would look like on the web.”
“All design is communication. If it doesn’t need to communicate, then it’s art. We need to play in both worlds.”
Aaron envisioned a site with a minimal navigation. One that people could explore. Without needing to know precisely where it began and ended. Then he set about incorporating what would ultimately be 42 fonts from Typekit, in 62 weights and 5 font styles, into an engaging, informational, easy-to-browse tour of typography, type rules, Typekit, and Adobe Muse.
What began with questions that helped him design the site’s overall framework—What are fonts? What are their differentiators?—continued with a systematic approach to each of the site’s five chapters—What’s the UI for each section? What’s the content? What am I saying? What’s the best way to position it? And how can I educate people while keeping things interesting?
Serif
“Initially, I didn’t even know where I was going; I just started putting down shapes and type. One of the aspects of working with typography is that you actually have to say something to showcase it. You have to write, in order to communicate.” Aaron ended up regurgitating everything he’d learned about typography in college. Then broke (most of) those rules—while maintaining the integrity of hierarchy and style.
Script
When he began this section, Aaron was thinking primarily about mobile: “When I looked back at the previous (Serif) chapter I realized how fat and wide it was and I thought ‘Wow, this is going to be a lot of work for mobile.'” So he set about creating the opposite of that visual style. So with color, and scroll effects and script, he conveyed the message to use script as a ornamentally (as one would a swoosh, a line, or a flourish) to add flair to design.
Slab Serif
This concept developed naturally from the use of slab faces for headlines—a sort of spotlight highlighting the content. Each strip had a unique design and font and message (that communicated visually and verbally how best to use them), and each column informed the approach and the content for the one that came next.
Themed
“Themed fonts are each really distinct and different; you can go nuts with them because there are so many styles.” That acknowledgement dominated Aaron’s concept for the section: Creating the word THEME from a group of discordant letters, he hoped to convey that it was possible for this cacophony of typefaces to coexist. To add visual fuel, he added scroll effects so the rules would burst apart into a maelstrom of letters and words.
San Serif
This one was the easiest and, for Aaron, an avid chess player, the most obvious.
“It’s not having the right font, it’s how you use it.”
The “disclaimer” that closes Sessions with Typography is a reminder that the number of fonts and design elements (strokes, overlays, weights) could make a site slow-to-load (Aaron said it was one of their biggest concerns during the site build). It’s a cautionary tale that he’ll keep in mind as he continues work on the site. Because Sessions with Typography isn’t done.
It won’t be fully complete until October, when the Adobe Muse team will unveil the final version at Adobe MAX. Until then, Aaron will be working on it, delving further into some of his typesetting techniques, demonstrating how he created some of his font styles, and, of course, showing-off the fonts, features, and functionality of Typekit and Adobe Muse.