Skip to main content
copperblue22
Known Participant
April 2, 2018
Question

How do I place text upon a photo?

  • April 2, 2018
  • 3 replies
  • 1601 views

Hello. I am designing my first e-learning project in Captivate for my class. I am using responsive design. I would like to use a photo and be able to type text upon it within Captivate. Think of it as a layered slide/image, the kind one could create using Photoshop.

Is this possible to do in Captivate? I realize that I could place the text upon the photo in Photoshop, but it obviously won't adjust to different platforms once I use it in my project (i..e., the text will cut off on smart phones, tablets, etc.).

This topic has been closed for replies.

3 replies

christian lee
Known Participant
April 3, 2018

Firstly welcome to the Forums good to hear you're developing. If I understand your problem you want text on top of an image? NOT a 'Text Entry Box'? Why not open your image in Power point put the text on top. Use Microsoft's 'snipping tool' and save it as a new image.

Voila. This should be a much easier way if you're new to responsive/ fluid boxes etc.

PS. if I've misread your question hope you get it answered soon.

Regards

Chris

Lilybiri
Legend
April 3, 2018

Chris, did you read the trhead completely or only the question? Lot has been explained later on, and problem is solved: it was aout using a backgroud image in a responsive project with fluid boxes.

David Burnham HBA
Inspiring
April 2, 2018

First of all are you making it Break Point or Fluid box.

For break point if you want the text to scale with the image as the image resizes then, import the Photoshop psd into Captivate and flatten the image when you import to Captivate. 

Or import Photoshop psd into Captivate with layers. The image and text will have to be positioned independent of each other dependent on the break point. It may be better to use a smart shape or text caption to add the text.

In fluid box layout you can use the flatten image as well and text is part of the image.

If you bring it in with layers then you could unlock the text layer from the fluid box but it will be image text. You may want to use a smart shape or text caption so it will "reflow" rather than being fixed image text from Photoshop. 

copperblue22
Known Participant
April 2, 2018

Thanks. I am not sure how to flatten an image. Should I have also placed the image inside of a shape? Will this automatically resize the images when they appear in different platforms?

My current images are just two circular logos, so I can't tell if an image--such as one with a longer rectangular shape--will be distorted in the format I have chosen.

David Burnham HBA
Inspiring
April 2, 2018

Placing the image as a slide background would be your best bet as you have been directed. Your image is not a picture but a shape therefore can be created in Captivate, not in Photoshop.

Lilybiri
Legend
April 2, 2018

You are talking about a responsive project. Is it with Fluid Boxes (CP2017 only) or with Breakpoint views? That difference is very important, because you cannot have layered objects in the samel location when using Fluid Boxes. My explanatino is for Fluid boxes, to have one single object: text on photo.

Moreover if you have a Text layer in Photoshop and you flatten the image when importing in Captivate you also end up with one single object. I don't understand your sentence that it wouldn't adjust to smaller screens, since the fluid box is rescaled. Same with text in fluid boxes (like in the described workflow below): it is rescaled fluidly when in a fluid box. If you do use Breakpoint Views, would propose another work flow.

A way ti gave ibkt one object could be done with this work flow:

  • Check the present size of the photo (best size is exactly the one you'll use in Primary view, for desktop) in pixels
  • Create a rectangylar shape with exactly the same size.
  • Fill the shape with the Photo
  • Double-click the shape (or use F2) to go into Text Edit mode and and type the text
  • To move the text you'll have to use the Margins and/or the alingnment options
copperblue22
Known Participant
April 2, 2018

Hello. Since I am new to Captivate, I don't know what Break Point is yet. I am currently working with fluid boxes. Here's what I did:

(1) I imported a JPG.

(2) I created a fluid box--vertical with four sections--over the image.

(3) I used text captions in the first two sections.

(4) I imported PNGs in the final two sections, which I had to resize to fit each fluid box.

I didn't even consider importing a PSD, but I guess that would give me more flexibility(?). So far, it appears to work fine when I view it in different platforms. I'm not sure that I traveled the easiest or best route here, but at least it's working. Thanks.

Lilybiri
Legend
April 2, 2018

Hmmmm.... did you use static fluid boxes? You cannot have a text container (shape or caption) layered over an image in a normal fluid box. Why not try the workaround with the image and text in one shape as I explained step by step?

As for difference between breakpoint views and fluid boxes for responsive projects, I wrote a blog post about it:

Fluid Boxes Or Breakpoint Views? - Captivate blog