Posts Tagged ‘Web design’

by Johnathan Zsittnik

The notion of browser-based Web designs has gained considerable momentum over the past year. I sat down with Chris Armstrong to discuss the many benefits of starting in the browser that have many Web designers rethinking their workflow.

Chris Armstrong of TypecastJZ: What are the problems you see with the traditional Web design workflow?

CA: The traditional Web design workflow tends to give too much priority to flat comps like those done in Photoshop. It assumes that a flat comp can communicate the right design effectively but it doesn’t show you the whole picture. Applications like Photoshop and Fireworks are great for ideation and exploration, but we really need to test those ideas and work within the realistic constraints of the browser. You can get something that looks good but it’s only when you prototype that those awkward questions like, “What happens when that H1 goes onto two lines?” are asked.

JZ: What projects have you worked on where these problems were particularly apparent?

CA: I recall one project where we delivered pixel perfect comps, but when the client saw the prototype, he wasn’t happy that they weren’t as tight as the comp. Our developer was doing a great job, but he had 101 things to think about and the subtle typographic details that really hold the design together got lost in translation. It was a
lot of work to go back and add that finesse afterward. That project led us to determine we needed to get the typographic foundation right at the beginning and build from there so that we always have a basic level of quality. –And the designer needs to be the person who does this.

JZ: How does designing in the browser address these issues?

CA: Designing in the browser makes it easier to test your design decisions against different types of content, and see how a site is going to adapt to different device sizes. Because it’s composed of HTML and CSS – the raw materials of the Web – you know that if you can get it to work well here, it’s likely to work in the wild. Designing in the browser also forces you to consider the edge cases, and cater for them to avoid nasty surprises – things like the font not rendering well in a Windows environment.

JZ: How has this approach impacted the way you work with your clients?

CA: It allows us to work more closely with our clients to evolve their content. Showing them how a design renders in the browser helps us have the right conversations early in the process. It helps the client understand the constraints of the medium and give more informed feedback.

JZ: Do you still see a role for Photoshop and other drawing applications in the design workflow?

Absolutely. Applications like Photoshop and Fireworks are great for sketching and ideation. Designers are so comfortable with them; they’re like using pen and paper. But we need to spend less time ideating and more time testing and iterating those ideas against real content, within the realistic constraints of the browser environment.

JZ: What led to you developing your own application (Typecast) for designing in the browser?

CA: We got tired of waiting for someone else to do it.

JZ: You’re just about ready to debut Typecast to a broader audience. What’s next for the application?

CA: At the moment we’re focusing on getting the basics right – setting hierarchy, color, contrast. But, in the future we want to do all we can to make it easy to create a complete set of elements, to create good vertical rhythm and help with things like swapping between pixels and ems, and introduce effects. The goal is to provide the tools you need to provide a complete design system for your site.

JZ: Do you have a favorite typeface or one in particular that you’ve been using frequently as of late?

CA: I’m loving Avenir. I just love the elegance of it.

Typecast is a tool for designing in the browser with Web fonts and real content. It includes many of the most popular typeface families from our Web Fonts service and is currently in private beta. Apply for an early look at Typecast on

Johnathan Zsittnik
Johnathan Zsittnik is the eCommerce Marketing Manager at Monotype Imaging. Johnathan holds both a bachelor’s degree in marketing and a master’s degree in business administration from Bentley University.

by Johnathan Zsittnik

Design is at a critical inflection point as a practice, thought process and force for change. “Pivot,” this year’s AIGA Design Conference, in Phoenix (October 13–16) will explore the shifts prompting this change – and help prepare its more than 1,500 attendees for the complexities of the future.

Three intensive days of inspiring speakers, practical workshops and in-depth discussions, will provide perspective on the changing design industry and actionable insights on how to increase value to clients and how to improve business prospects. Monotype Imaging is proud to be part of what should be an extraordinary experience.

We will be one of the major sponsors of Command X: Season 3, a design reality show featuring seven up-and-coming designers, all under the age of 26, who step into the spotlight and have the chance to break into the industry in front of peers, heroes and potential employers. Throughout the conference, contestants will take on a series of design challenges to complete and present on the main stage within 24 hours. The Linotype® Originals OpenType Library (valued at $12,000) will be one of the main prizes.

Allan Haley, director of words and letters at Monotype Imaging will deliver a presentation titled Bach, Fonts and Rock ‘n’ Roll on Friday afternoon.

Typography is often inspired by great music – from Bach to Springsteen and scores of musicians in between. Both typography and music can be classical, improvisational, raucous, lyrical, offbeat, soothing or loud. They also share some basic concepts: counterpoint, rhythm, syncopation, dissonance and harmony. Haley’s presentation will pair the work of Charlie Parker, Green Day, Mozart, Buddy Guy and more, with award-winning typography their music could have inspired. Great typography that has roots in music will be analyzed, scrutinized and decoded. Attendees will learn why, and how, music can be the perfect catalyst for creating typography that sings with magnetism and verve.

Later that evening, Haley will also deliver his Type Quiz. This year’s quiz will have all new questions – and it will be even more fun and rewarding than ever before. There will be more prizes and a series of questions for those that don’t care that five-point type was once called “pearl.” And, if you know your typographic stuff, winning the varsity section will score you the grand prize of the complete Linotype® Originals OpenType Library of more than 1,700 fonts and “Typophile of the Year” bragging rights. In addition, over 60 other cool prizes – from t-shirts to books, to type pillows, to complete typeface families – will be given out to just about anyone who knows Bodoni from second-base.

On Saturday morning, Eli Wilkie and Carl Crossgrove, of Monotype Imaging, will lead the Building Brand in the Digital Age: Web Font Services workshop.

Technology brings collective challenges of building, maintaining, growing and delivering a unified customer experience. A task made increasingly more complex and demanding by real-time advances and multi-channel interactions. Building and maintaining brand awareness has never been more difficult and complex.

This workshop will show attendees how to deliver richer communications with Web typography using Web fonts, including how to select fonts and manage layout across different platforms and browsers.

Johnathan Zsittnik
Johnathan Zsittnik is the eCommerce Marketing Manager at Monotype Imaging. Johnathan holds both a bachelor’s degree in marketing and a master’s degree in business administration from Bentley University.

Great type makes sites stand out