Pick the Right Fonts for the Job: 16 Free, UX-Friendly Fonts for Adobe XD
Fonts play a crucial role in the success of your product’s design. While choosing the right typeface may seem like an afterthought, making the right decision can shape the look and feel of your app or website, while having a major impact on the readability and legibility of your copy. While picking the right font can be a daunting job for a user experience (UX) designer, Adobe Typekit is striving to make it easier.
UX designers who use the all-in-one design and prototyping tools found in Adobe XD can download the free UX Font Pack. The 16 fonts have been handpicked from Typekit because of their ability to effectively and beautifully achieve typographic goals in eye-catching, easily readable fashion, even when screen space is limited. Tim Brown is Adobe Typekit’s head of typography, and we asked him to share his best advice for using these fonts to their greatest advantage in your UX design, along with tips for always choosing the right type for the job.
What makes Typekit’s UX Font Pack useful for UX designers?
Much of the UI [user interface] and UX work that people end up interacting with — the experiences that designers must craft — takes place on small screens. With that limited real estate, certain typographic jobs become very important, especially eye-catching headings, clear text, and compact information. We made sure that the UX Font Pack contains fonts that do each of these jobs well.
What makes a font ‘UX/UI-friendly,’ anyway?
I would describe UX-friendly typefaces as those that contribute to an experience that helps people accomplish a goal. Because many tasks require navigating through a series of screens over time, it’s important to maintain branding in a limited amount of space throughout that experience, and expressive display faces like Sarina and Montserrat do that well.
Every experience requires a little reading (or more than a little), so typefaces like Acumin are vital. It’s also important to present choices and next steps to users in a straightforward way, so the clarity baked into typefaces like Fira Sans is extremely valuable. And remember that UX happens on devices of all sizes. Often the same user has an experience that spans multiple devices. Some of the typefaces in this pack, like Acumin and Roboto, come from big families that offer additional variations that help with flexible typesetting. The variations included in the pack offer a taste of the broader family.
How do you pick the right font for your project?
First and foremost, find typefaces that do the text jobs your experience needs done. Next, determine the most appropriate type for you. The fonts in this pack aren’t a ready-made solution for every product — rather, they’re an example of the kinds of typefaces that will help every user experience succeed. The Typekit library is full of options that can help you find good typefaces that are unique to your brand.
Tim Brown, Adobe Typekit’s head of typography.
What are your top tips for using fonts effectively in Adobe XD?
Adobe XD’s major strengths are enabling collaboration and making design systematic. Using fonts effectively in XD means establishing rules about your palette of typefaces, and about how and when to employ different typographic styles. Err on the side of consistency.
What do you hope Adobe XD users can achieve with this UX Font Pack?
Adobe XD users are some of the smartest, most forward-thinking designers working today. They realize that crafting user experiences means communicating — with extreme clarity — many small, critical details in flexible designs. That communication requires a tool that shows compositions in many layouts simultaneously, while enabling everyone on the team to ask questions and hone the design’s intent.
To find even more fonts to use in your UX designs, check out Typekit’s Welcome Pack, curated by our team and features Adobe’s 25 most popular and useful fonts. For more UX insights sent straight to your inbox, sign up for Adobe’s experience design newsletter.