Internal font-size increase and decrease "shorthand"

  • Idea
  • Updated 1 year ago
  • Implemented
Archived

This conversation was archived and is no longer visible to community members.

There are certain situations where I'd like to have some text in the same field that is slightly smaller or larger than the other. An example would be a grid column entry where both a number and the percentage that number represents are listed - the percentage is a valuable number to show the user, but it is not as important as the actual number, and I want to make it clear that it should be displayed at a diminished size. Another example (also in the grid) would be where one column contains values that are even more important than the values in most of the other columns and so I want to make it clear that it should be displayed at a larger size. Example:



What I'd like to see is some kind of "shorthand" option, like asterisk for bold and underscore for italic, that would increase or decrease the font-size of the surrounded text by a specified number of "steps" of the font size list.

For example, something like the escape slash used for newline followed by a positive or negative number to indicate the steps. So <strong>text</strong> would increase the font size by one step and <strong>\-2text\-2 would decrease it by two steps.

Or maybe use slash+circumflex to go up one step:
<strong>\^text\^</strong>
And slash+v to go down one step:
<strong>\vtext\v</strong>
with multiple circumflexes/v's to go up or down more than one step:
Up Two:
<strong>\^^text\^^</strong>
Down Three
<strong>\vvvtext\vvv</strong>

To start the internal string with a circumflex or a v, insert a slash to escape:
Increase Font-Size of the word "very":
<strong>\vv\very\vv</strong>

:-j(enni)

Jenni Merrifield

  • 85 Posts
  • 10 Likes
  • interested in hearing what you think.

Posted 4 years ago

  • 6

Win7Guru

  • 142 Posts
  • 7 Likes
Recently I was making a Tweetdeck mockup, where I needed the Application title to be bigger than the version number. +2

Giacomo 'Peldi' Guilizzoni, Official Rep

  • 2122 Posts
  • 153 Likes
Hi Jenni. Thanks for the idea. Let me think about it. It's more complex than what I'm comfortable with, but I understand that it might save a bunch of time. Let me add it to the list and think about it, ok?

Jenni Merrifield

  • 85 Posts
  • 10 Likes
I just noticed that this suggestion is marked as "Under Consideration" - yay!

I'm wondering what format you're considering to implement it? I saw another idea somewhere that was about adding text colour internally that suggested sizing using {size=#} which would also be a reasonable solution although it would require more typing.

If you did go in that direction I'd suggest that the syntax work as as step increment/decrement - {size=2} or {size=+2} to go up two steps from the base size and {size=-2} to go down two steps from the base size.

This is not only useful in that if you change the base font size of the particular control at a later time the affected strings will still be a bit bigger or smaller, but it also eliminates the chance that someone will specify a font size that isn't actually "allowed" by Balsamiq (i.e. {size=15} when Balsamiq's font sizes skip from 14 to 16).

And something that would apply regardless of which version you used: Given the fixed set of font size "steps" in the application, the displayed font size should never go below the minimum or maximum step size, even if the current base plus the specified increment or decrement would nominally push the size beyond that point.

Giacomo 'Peldi' Guilizzoni, Official Rep

  • 2122 Posts
  • 153 Likes
Hi Jenni, for some pointless programming reasons, {size=15} is easy to do, the {size=+2} is much harder. It seems to me that the latter would be MUCH more useful though...is there a point in supporting the absolute version if we can't support the relative?

Jenni Merrifield

  • 85 Posts
  • 10 Likes
Not sure how I missed the above comment back when you made it.

To answer your question, I think that if there was just no way to support the relative it would still be useful to support the absolute. Not as user friendly, since the font size wouldn't scale if you changed the "default" size and you'd have to go in and do a manual adjustment, but it would still be useful.

I'm going to assume it's the +/- that is the bugbear here. If so, what if there were two size-affecting macros, one for up and one for down, instead of just one?

So, instead of {size=+2} for increase by 2 and {size=-2} to decrease by 2, use {up=2} (for example) to increase by 2 steps and {down=2} to decrease by 2 steps.

I'm not sure that "up" and "down" are the best terms to use, but you should get the idea. The only other ideas I have are to use "inc" and "dec" or to prefix either of those term sets with either "size-" or "font-" first - e.g., "font-up"/"font-down" or "size-inc"/"size-dec"

halshura

  • 16 Posts
  • 0 Likes
+1 Just found I needed this feature too. Much more convenient. {size=+2} is smart, though {size=10} is good enough too.

Dave

  • 33 Posts
  • 3 Likes
Did this idea every get developed?

I don't see any evidence that it did. I have found at least one other message that includes {size:14}some text{size}, but I think that was meant to be an example of how tags could be done in Balsamiq.

In answer to your question from 10 months ago, YES, implementing absolute sizes without also implementing relative sizes would very, very helpful!

If you're still accepting input for this particular request, perhaps you could use "size" for absolute sizes and "resize" for relative sizes:

1) Absolute — {size:16}size tag{size}

2) Relative — {resize:+2}this is bigger{resize}

3) Relative — {resize:-1}Slightly smaller{resize}

Michael Angeles, Official Rep

  • 2183 Posts
  • 93 Likes
Sorry to say that inline absolute and relative font size changes have not yet been implemented.

Nadeem Bakhsh

  • 3 Posts
  • 0 Likes
Any update on this one yet? Various sizes in texts is extremely important in the usability of any page. We have to do this manually as it is, would be great if balsamiq provided it as a inline feature.

Matthieu GARDE

  • 1 Post
  • 0 Likes
Hi
Thanks for this great soft
But... any update ? I need this feature too !

Roxanne Fanny Corriveau

  • 1 Post
  • 0 Likes
I find this very important to do!

Larry

  • 17 Posts
  • 1 Like
I think it would be great if we could use something like {size:18}Hello World{size} to control font sizes in certain UI elements (particularly in tables).

For Example:
{size:18}[*My First Fixed-width Template*]{size}\r{color:#888888}Please do not modify this template until Jeremy has reviewed it{color}


Output:


This reply was created from a merged topic originally titled
Font Sizes Using {size}.

andipandi

  • 17 Posts
  • 2 Likes
It would simplify my mockups a lot if I could use sizing, rather than a billion little text boxes.

Eugen Sokolov

  • 1 Post
  • 0 Likes
{font size="-2"} text {/font} please...

This reply was created from a merged topic originally titled
Changing fontsize in text.

Larry

  • 17 Posts
  • 1 Like
Eugen,

That syntax would be inconsistent with what has already been established. For example, we're already using {color:#888888}Lorem ipsum...{color} to change color. So we would want to use either {size:18}Lorem ipsum...{size} or {font-size:18}Lorem ipsum...{font-size}

Florian Brauer, EMPLOYEE

  • 356 Posts
  • 22 Likes
Hello everybody,

Absolute size is now implemented in the new version we shipped today.
Check out the release notes here:
http://blogs.balsamiq.com/product/201...

For downloading the new Desktop version please click here:
http://www.balsamiq.com/download

Enjoy!

Dave

  • 33 Posts
  • 3 Likes
Thank you. Where's the tip jar?

Jenni Merrifield

  • 85 Posts
  • 10 Likes
Hallelujah! You guys are, as always, awesome. :-)