Image Positioning on Process Steps

Mar 27, 2018

Hi there,

I was wondering, is there a way to control where an image appears on Process steps? I noticed it always defaults to top, and on desktop, text below the image can be missed if the user does not scroll down. 

Related, what determines the size of the image on Process steps? When I add an image from the Content Library, there doesn't seem to be a default size.

Thanks,

Chris

7 Replies
Crystal Horn

Hi Chris!  Thanks for sharing your thoughts here.  I'll share your point about potentially missing the description text with our team.

As for image size in Rise, depending on what device you're viewing a Rise course, the size and positioning of images varies.  The content in Rise is allowed room to reflow for the best learner experience.  Check out our best practices for working with images!

SiriusXM Media

Thanks for the response Crystal. For image size, the inability to adjust or constrain image size is a bit frustrating, because the current options are essentially full screen or centered, and depending on the image resolution this can take up a ton of real estate.

Is there potential for an option in the future to have image size by percent (like how it exists in the image and text option)?

An additional question - is there a way to optimize images that contain text? No matter what resolution I bring an image with text in, the results in Rise make the text look blurry.

Ashley Terwilliger-Pollard

Hi Chris, 

Thanks for sharing some additional insights here. From what I'm understanding, it sounds like having a few more options for defining and resizing images would help with your Rise course creation? I’ll be happy to pass your thoughts on to our product team, but you can also feel free to detail them more through a feature request!

As for your images with blurry text, do you have a sample image you could share here? I'd love to take a look. 

SiriusXM Media

Hi Ashley,

Thanks for your response. I'll definitely add my suggestion as a feature request.

As for the images with blurry text, I actually just found on Friday that .svg files handle text a lot better than .jpeg/.png files within Rise. Attached are two images I tested with, along with a test course:

https://rise.articulate.com/share/GXcCwwNFNuBTzyfkHaCCz4z8zA_-aIPG

It seems that no matter how much I increase dimensions of a .jpeg/.png file, the results within Rise lead to blurry text.

Ashley Terwilliger-Pollard

Thanks, Chris, and I'm glad the SVG images worked out for you. They are a bit higher quality than the JPEG and with all Articulate tools, including Rise you'll want to use the highest quality image available. 

Also, thanks for sharing some more ideas and insight as a feature request! That really helps our team have a deeper sense of how you do your work and what other tools you need to do it even better! 

Alyssa Gomez

Hi Viateur! That's correct—the image will appear above the text in a process block, and there isn't a way to change the positioning of the image.

I've seen examples where folks use other block types in creative ways, such as the accordion, tabs, or the timeline block. Each of those block types displays the image below the text, so you may want to explore using one of those!