Trying to guess when and how much to try to adjust the text area in RP is irritating and often unsuccessful in resolving the issue. I see it in Preview and in Published prototypes. I see it in all font faces and sizes⌠I see it in all breakpoints, though not always the same widget on every breakpoint.
I understand that the browsers will render the fonts slightly differently as does the Adaptive view and they impact the issue I am seeing. Given that, what are tips to help control the issue?!
Iâve got a very picky Creative Director who will not be able to have a constructive conversation about a layout when the font does something like this. It will completely derail into âfix the prototypeâ. Not to mention, I donât like to show to clients when it looks this sloppy.
Most of my demos are done Win 10 PC running Chrome. The above example is using the defaults from the Axure paragraph widget.
Axure doesnât allow you to specify character spacing. (Maybe Axure 9 does? I donât know.) But you can do so using some javascript. This example OnPageLoad sets the character spacing of every text container whose name starts with âtextâ to -0.2px, which seems closer to how Axure displays it in design mode.
This continues to be a frustration in Axure 9 and a reason why it is hard for Axure to be taken seriously as a design tool. At the very least, Is there ANY browser that reliably renders text identically to how it appears in Axure?
I really donât need it to be a design tool (as in Visual Design) because Iâm almost always in low-fidelity wires (relative to brand and visual language). I do need it to not flub up the text display when generating the prototype because I and focused on the information and task flow design. I need it to show the data/information/copy and demonstrate the functionality. When the copy is over-running the module boundaries or button or whatever, it derails the conversation about what & how because people are distracted by the âmessyâ.
Hi guys! In Axure RP 9 there are two features for text that should help to achieve a consistent look and feel across browsers. One is line spacing, which was also available in RP 8, and one is character spacing, which is new in RP 9. If these are both undefined/set to auto, then this leaves the spacing up to the browser and can result in inconsistent rendering. If you define both of these then this should lock things down and keep text from shifting all over the place in different browsers. Hopefully that helps!
