Join Justin Putney for an in-depth discussion in this video Adding a headline, part of UX Design Tools: Balsamiq Mockups.
In this chapter, we're going to start working with text. In this video, we're going to add a headline to our existing mockup. To add the new headline, I'm going to hit the forward slash key to access the Quick Add field, and I'm just going to type in, headline. And you can see there's a Title, slash Headline, slash Big Title. That's exactly what I want, so I'm going to hit return. And there's my title. And, I think I'll just move it over generally where I want it, and double-click to edit it.
And I'm going to change the text to read, Headline. In this case, it knows it's suppose to be a single line, so even if I don't hit Cmd+Return, I just hit Return, it will figure it out and apply that text. So, that's a nice little feature. So now, I'd like to add a line beneath the headline, that goes across horizontally and sort of separates it from the body copy. So, I'm going to hit the forward slash key again to go to the Quick Add. And when I was preparing this course, when I typed in line, I actually didn't get what I wanted in this list here.
But Balsamiq has since updated it, so it's even smarter. What I want is the horizontal rule, separator line here. So, it appears in the list when I type line. That's pretty smart because there's a whole bunch of other things that could apply here, so I'm just using the arrow key to navigate down to that, and I'm just going to hit Return. And it's added a horizontal rule to the upper left here. And I'm just going to position it next to the headline, and then I'm going to grab the right-hand side of it and drag it out, so that it spans the remaining width.
So, now we've got a headline in place. Let's take a look at adding some placeholder text to go underneath the headline.
- Adding, aligning, and layering elements
- Adding and formatting placeholder text
- Building symbols
- Adding new control types using Mockups To Go
- Creating links and hot areas
- Making wireframes for tablets and smartphones
- Exporting mockups for review