Advice on balancing text?

Harry Klippton

Not Interested
This question is for you guys with actual graphic design backgrounds since I'm just a hack.

What's a good strategy for balancing texts in a graphic design?

For instance, if I've got "tone" and "feedback," I'd want the letters to be the same height, but with "feedback" being twice as long, the weight (not sure if that's the right way to describe this) will be off. I also don't want to distort the fonts by stretching the word length, so I've been keeping the ratio locked as I adjust things.

I've been able to fudge this in the past, but I'm working on a layout for a pedal that has over 20 text labels, and I want it to be consistent.
 
It doesn't matter with block letters due to their block nature because all characters are the same height, width, and thickness due to their block nature. With more stylized fonts, there can be a noticeable height difference between say a lowercase "e" and the top of the stem of an "f"
 
If you're intent on keeping the footprint of each text label the same despite the difference in length of word, you're looking at basically abbreviating or finding a synonym that fills the allotted space. It tends to look unnatural if you start distorting each to fill the same space horizontally/vertically. "Block" fonts are not necessarily the same width. For that, you're looking for a monospace typeface (e.g., courier).

This will give you a bit of information of typography basics. It sounds like you're attempting to balance the ascender/descender between the different labels. I would suggest finding a type that is designed to already provides those characteristics rather than trying to make a font do that with manipulation. You'll most likely be looking at a sans or slab serif type. By sticking with all caps, you'll force things to be more uniform than if you use title case. Try searching for fonts that fall under the 'headline' category. With headline fonts, the objective is to present information in a clear, legible way at bigger sizes. Typefaces used for body text are designed for readability in a paragraph structure. This involves making differentiation between the characters rather than creating uniformity and filling all available space.

EDIT: @finebyfine will definitely have good perspective here.
 
Last edited:
If you're intent on keeping the footprint of each text label the same despite the difference in length of word, you're looking at basically abbreviating. It tends to look unnatural if you start distorting each to fill the same space horizontally/vertically. "Block" fonts are not necessarily the same width. For that, you're looking for a monospace typeface (e.g., courier).

This will give you a bit of information of typography basics. It sounds like you're attempting to balance the ascender/descender between the different labels. I would suggest finding a type that is designed to already provides those characteristics rather than trying to make a font do that with manipulation. You'll most likely be looking at a sans or slab serif type. By sticking with all caps, you'll force things to be more uniform than if you use title case. Try searching for fonts that fall under the 'headline' category. With headline fonts, the objective is to present information in a clear, legible way at bigger sizes. Typefaces used for body text are designed for readability in a paragraph structure. This involves making differentiation between the characters rather than creating uniformity and filling all available space.

EDIT: @finebyfine will definitely have good perspective here.
Thanks. That link has the kind of info I'm looking for. And I'm definitely waiting to hear from @finebyfine
 
Sure thing. Let me know if you have any other questions and I can try to provide more specific answers. I just tried to give a basic overview with my above post.
I'm not trying to keep the footprint of each text label the same, just trying to figure out how to balance them without resorting to abbreviating, using only capital letters, etc. and wondering if there are tricks of the trade I can apply
 
Okay. Yeah, you need to look for a typeface that already those attributes instead of manipulating the text to get the best results. Do you have example(s) that show what you're trying to do? There are plenty of options out there—it'd be helpful to have an exemplar to give suggestions.
 
Not sure if I understand entirely but one thing I like to do in inkscape, there are centering and alignment tools, or you could create a scrap layer and make straight guide lines to keep labels in Balance with each other and centered on controls then delete or hide the scrap layer... does that help?
 
You can make the "Feedback" word a smaller point size and Regular font (remove the bold) then all the rest, and then convert the word into a vectored image (convert to shape) and then you could just resize it by moving the corner handles on the image until it looks approximately correct.

I may have missed where you told us what software you are using.
 
Thanks. That link has the kind of info I'm looking for. And I'm definitely waiting to hear from @finebyfine

This question is one I wrestle with a lot in enclosure designs, and as I've been thinking of a response I'm realizing that this is one of the bigger design challenges that makes this hobby so fun for me.

The higher level issue here is that pedal enclosures are a type of user interface that many graphic designers and UI designers do not work with often unless they work in product design: a purely physical one.

Digital interfaces use a variety of visual language shortcuts for elements that are easy to take for granted and don't necessarily translate across media. Consider that underlined text on a webpage will probably mean a hyperlink and on a printed page will be a stress emphasis of the written text. While these are both emphasized from the text surrounding it, they are for different reasons and functions that shape a user's expectation in encountering them. If we wanted to replicate the printed stress emphasis on a webpage, an underline is typically the last thing we reach for for exactly this reason. What gets tricky here is that both printed and web content achieve balance in different ways (through types of visual language) than physical things do, or can do. On a pedal with control labels that are, lets assume, hierarchically on the same level (eg, we can separate jack labels design-wise from knob labels), introducing text size variations can feel like we're messing with that even footing and making the "feedback" control seem less important than the "tone" control. Because, we are, if that's the only defining characteristic of that hierarchical level.

But even without making other design choices, text size isn't the only thing that defines this common footing. They're also defined by placement of simply being near a knob. No other text usually surrounds a knob than the label of what it does, so they're instantly tied together. Same sized knobs can, and usually always do, make text of different character lengths appear to take up the same amount space - because it's not just the text that defines the "control" space in the first place.

There's a lot of ways to try to maintain consistency in control spaces. Some work better than others, and these can be self defeating easily as we realize consistency is defined by many plates spinning at once. Take for instance the idea of using a super narrow font to define the upper boundary in width. At a certain point size this is probably visual interesting, and a reasonable decision based on other factors. I've done it in pedals I think. But at smaller point sizes narrow text - especially lowercase - is really fucking difficult to read compared to regular width set at the same size. There's a reason narrow type was made for newspaper headlines: they're so large! When the text becomes harder to read easily, we're breaking a consistency that we probably don't think about often: effortless, or uniform effort, readability. Things that are harder to read are usually supposed to be less important because we don't need to be reading them all the time (or someone may not want us to, see: fine print).

My usual answer for this is pretty boring because it's a safe choice: just making the text sizes smaller. Most people, even with impaired vision, can read point sizes a lot smaller than we'd assume, and do it on a daily basis. I just printed out uppercase and lowercase text set from 3-8pt in Helvetica Now Micro, which granted is made for smaller point sizes, to check how low I personally can go - and I can comfortably read 5pt lowercase text from 3 feet away from without straining, and my vision is the worst now that it's been in my life. At 6 inches away I only had to strain to read lowercase 3pt. Uppercase I could read 3-8pt without straining even slightly from both distances. If I wasn't trying to wrap this up I'd have gone ahead and printed off 1 and 2 pt just for the fun of it. YMMV obviously, and just because I can read those sizes comfortably doesn't mean I'm saying go ahead and use 4pt text. But it's an easy enough way to let you keep text sizes the same for each label without impacting readability a ton, although I really don't see anything wrong with varying labels a point size or two to keep the widths closer. I usually give labels a character spacing of 10-75 at smaller sizes for breathing room and that strikes me as cohesive.
 
There's a reason narrow type was made for newspaper headlines: they're so large!
To contextualize what I said above, I wasn't thinking about a condensed-style headline fonts typical of print-only newspapers (although that is definitely a valid point), but rather some within the more modern trend of text portability and readability. E.g., newer geometric typefaces and some of the crossover humanist typefaces.
 
To contextualize what I said above, I wasn't thinking about a condensed-style headline fonts typical of print-only newspapers (although that is definitely a valid point), but rather some within the more modern trend of text portability and readability. E.g., newer geometric typefaces and some of the crossover humanist typefaces.
Oh sorry I didn’t read your reply fully before mine and wasn’t referencing your comments! I was going off of how earthquaker devices uses super condensed text. Agree with what youre saying here 100%%.
 
Oh sorry I didn’t read your reply fully before mine and wasn’t referencing your comments! I was going off of how earthquaker devices uses super condensed text. Agree with what youre saying here 100%%.

I think you bring up a really important point here and above. Pedals exist in an interesting design space. They are functional items that are supposed to be functional pieces of equipment. However, design choices are impacted by how it needs to be presented in (primarily digital) marketing and photography. Trying to make something functional and attractive in the physical space while also working in a modern digital space is a difficult line to toe. I think you bring up a good example of this with the EQD designs. They're using bold condensed geometric font for their control labels. They read well on a computer screen or as a mockup photo, but they blur into a mess of negative space when viewed looking down at them. It illustrates that something that may work in the digital arena really falls short in the physical space. Also, doesn't it seem like there are a lot of kerning issues with their control labels?
 
(@benny_profane I just had the chance to read your first reply and while not at work and agree with everything you said there, and had I read it more carefully before my reply I would have changed some of my wording on condensed type to be clearer I was criticizing the use of much more condensed type)

They are functional items that are supposed to be functional pieces of equipment. However, design choices are impacted by how it needs to be presented in (primarily digital) marketing and photography. Trying to make something functional and attractive in the physical space while also working in a modern digital space is a difficult line to toe. I think you bring up a good example of this with the EQD designs.

This is exactly where my mind was starting to go by the time I finally hit send on my first reply and had to get back to my job lol!

It also reminds me one quick thing on my original reply that I wish I had mentioned: the benefit of printing out designs throughout the revision process. I'll print designs out basically every time I get to a "Yeah, that's looking pretty good" stage because the second I see it on paper I see something I didn't on screen or appreciate something I didn't.

The inevitable design trade-offs that come with being aware of how marketing a product works are not decisions I envy! Of course usability is good but there's nothing to use if no one's buying it. We're pretty lucky in the hobbyist space to not have to take those into consideration unless we decide to.

Also, doesn't it seem like there are a lot of kerning issues with their control labels?
For someone who was willing to sit for an hour writing essentially an essay about pedal typography earlier today, I have a surprisingly bad eye for kerning unless it is obtusely poor. I took Bringhurst to heart early, in large part because it meant I could get away with less work, from Elements of Typographic Style:
1639782692829.png
Going back to some photos of their pedals I see what you're talking about, but can't articulate to myself it more exactly than it just looks off in some places. There were at least two pedals I noticed they didn't use common ligatures on (both with the word Diffuse if I'm remembering right) which kind of surprised me but I wouldn't be surprised if there are production reasons behind that somewhere in the line that I'm ignorant of.
 
For someone who was willing to sit for an hour writing essentially an essay about pedal typography earlier today, I have a surprisingly bad eye for kerning unless it is obtusely poor. I took Bringhurst to heart early, in large part because it meant I could get away with less work, from Elements of Typographic Style:
View attachment 20012
Going back to some photos of their pedals I see what you're talking about, but can't articulate to myself it more exactly than it just looks off in some places. There were at least two pedals I noticed they didn't use common ligatures on (both with the word Diffuse if I'm remembering right) which kind of surprised me but I wouldn't be surprised if there are production reasons behind that somewhere in the line that I'm ignorant of.
Yeah, I don't know what's off exactly, but there is something there that is not sitting right. I wonder if it is a product of the manufacturing process. In any case, something seems off with the labeling.
 
Sometimes you can look at something too long. Don't overthink things. As far as typeface is concerned keep it simple. Too many guys go for overly elaborate faces which obscure legibility. And trying to keep all of the words the same size for a neat design can sometimes make the pedal harder to use on the fly. Why are you putting type on the pedal? To communicate the purpose of each knob. Good ergonomic practise (yes, the typesetting on a pedal is part of ergonomics!) would be to make the labelling clear and succinct.

I've had this debate with myself over my overdrive pedals. I generally prefer four-knob ODs, so need to have Gain, Level/Volume, Bass and Treble knobs. I worked out names for all of these functions which have exactly four letters: Gain, Loud, Bass, Treb. But I would rather use the words Volume and Treble for clarity and consistency. It looks silly to abbreviate some and not others.

In general I would recommend using all caps, but for Gain, Volume, Bass, Treble the shape of the words in lower case actually aids legibility because the word is not simply a block with all letters the same height. Bass and Treble for example are more easily distinguished from each other if written with a capital for the first letter and lower case after, even if you forget your glasses at the gig.

I would never recommend using different kerning or point size for various descriptors on a pedal. That's just confusing and poor typography. Compressing or expanding fonts is equally confusing and ugly. My advice is just accept that some words are longer than others.

Or you can do as I do and never get around to labelling anything.
 
Back
Top