![]() There are multiple ways to do this in code, but from a wireframing perspective, you just need to show how the text will wrap and the hierarchy in the wireframes. What your text should do is adapt to the screen size and be larger on the mobile device and wrap in a way without you, the user, needing to scroll right and left. When you are designing for both mobile and desktop (known as responsive design), it is important to keep text size and length for different screens in mind. The copywriter will write around that amount and the developer will code that element to just show that many characters and it will be easier to place other elements on the screen. ![]() So if you like the size of the paragraph showing in your wireframes, you can tell both the copywriter and the developer that this space is limited to 336 characters. See that little number on the top right of the box? That's the number of characters outlined in blue in the text control. So you have the general placement of the copy, but you can help out your fellow teammates, such as writers and developers, by telling them exactly how much room they have to work with.Ī cool little trick in Balsamiq is to use the character count on the text UI control. □ It's a modified form of Latin used since the beginning of publishing text on paper and is meant as placeholder text that is expected to be replaced by the actual copy.Īt this point in time, if you haven't already, it's time to start getting the UX writer and copywriter involved in creating the content for the website or app. It is referred to as "lorem ipsum" text, and no, do not try and read it and figure out the words. You've probably seen this kind of text a lot. How much copy do you want to put in that place? How long is the headline going to be? The page title? How about that informational paragraph? If you are using Balsamiq, you can use the text blocks as shown above, but this is also a good time to start thinking about text length. Iterate version 1Īfter getting multiple ideas out and doing some other design activities, it is time to go digital with your wireframes. In this early stage, you just want to show the placement and hierarchy of the text elements. When you are brainstorming ideas and sketching out rough concepts, you'll represent text as blocks or squiggles. Here are some handy tips to help you plan ahead and write for humans. Preparing for text content takes a lot more work than most people expect with a project. ![]() It can be just text blocks, but it’d be better to start thinking about real text, at least in its length and size. Adding text to your wireframes is important. ![]()
0 Comments
Leave a Reply. |