I've just started using Rise and I have some questions. Is there place that tells me the image dimensions (ie: Image and Text, Image size for the accordion, etc.). My client thinks the font is too small in the image description, so I was going to overlay it on the image, but it keeps cutting it off and I'll be here all day trying to figure out the image size.
I'm facing the same issue. My file (see sample image for rise) when added as a full length image gets cut off at the bottom and top. If I choose to add it as a centred image, it gets too small to view. Any suggestions?
@Arathi, the 2-column grid gallery images need to be square. I believe if you add white space to the sides of your portrait images, they will show correctly.
I am struggling with the image quality in Rise under the Course settings. I frequently use airline logo's as the cover photo and it seems any logo size I select appears distorted as the cover photo when the course is previewed. Any suggestions? I have added a logo below as an example of what I'm struggling.
Both of the logo files you attached are relatively small. You'll want to use the largest image sizes you have available so the logo will not lose quality if the course displays full screen.
Also, the best aspect ratio for the cover photo is 3:1. So for example, you could use an image that is 3000 pixels wide x1000 pixels tall.
Okay some of the responses in here don't make sense. You can't just speak of images in 16x9 and 1x1 those are video lingo. What are the dimensions or resolutions that we should be look for in each of the instances. Saying High res doesn't make sense. So when we are using the 2 columns persay. There is the on screen and then zoom image. What are the two dimensions? Reason i'm asking is that yep it is a square but is it 500x500 and then zoom is that simply coded to width parameter? Or is it 1600x1600 and the 2 column is cropping.
I guess my question might not be the specific resolutions, but letting us know how those are coded might help us in understanding what might be cropped and not. EG: the image response of make it a square that makes sense to have the hieght be the total and white on sides. But then if you have 3 column, the images are small and how will the zoom look.
I can go on and on, just asking and trying to save myself time as opposed to testing our every single sizing to see how they react. But if i have to do that just let me know. :-)
Hi there, Doug! We focus more on the aspect ratios than the dimensions because of the potential for that same image to be viewed on many screen sizes.
To keep it simple, use the bigger dimensions! When you zoom in Rise 360, the image will expand either to its original size, or until the browser window is full. When you use those high res images, they'll look great in the lesson and zoomed.
If you're having specific issues with image quality during zoom, however, let us know!
Nope, nope, nope. We all know Rise is responsive, and I think a lot of us don't care. I hate how the 2-column image grid crops my images in the lesson, and they only look "normal" upon zooming. I too have to add white space around my original image to make it square. That just makes the space between the image and the caption wider, and it doesn't look great.
Sorry, I don't mean to sound rude. But I get emails when people respond to these posts, and so many of us have issues with how Rise resizes images. It's just frustrating.
And what about a five image gallery? I can't seem to make it work with images all the same size? I can get three (smaller) and two (bigger) images using the 3 grid and 2 grid.
Tell me more about what you want to achieve with 5 images. There may be something else I can suggest! For example, you can design the 5-image layout on a PowerPoint slide, save the entire slide as one large image file, then upload it to an Image Full Width block.
Hi Alyssa: That is a good suggestion, but with the image treated as one, zooming would not be incorporated. Of course if there is no need, then that would be a def work-around in this case!
Both of the logo files you attached are relatively small. You'll want to use the largest image sizes you have available so the logo will not lose quality if the course displays full screen.
Also, the best aspect ratio for the cover photo is 3:1. So for example, you could use an image that is 3000 pixels wide x1000 pixels tall.
I love knowing the 3:1 trick for the cover photo - thank you!
The cropping tool helps a lot but in order to address the issue that a lot of folks indicated on this thread I'd love to see a Focal Point tool that allows you to drag the image in the frame to identify what should always be at the center of the image frame.
I am a very new user to Articulate and just had this situation. I did have to google how to add white space around an image and it worked like a charm. Thank you, Annie!
Tom - I found your tips on the blocks and the settings/media supported super interesting. This solves some questions I've had lately. By any change would you have a more recent version of this doc we could possibly utilise? Thanks so much
@heather: thanks for jumping in...just a few thoughts
There are some image blocks that are designed to respond to the device and will crop the image. For example, the blocks with text and image are designed to keep the text as the key focal point, which then crops the background image. If you use one of the square image blocks, it crops to the center square. And some images blocks are designed to scale the image.
It sounds like you may be experiencing some wonkiness. If the images you insert aren't responding the way designed for that block, contact our support team and they can look at it.
If you want to share what image you're inserting and the result, start a new thread (so this old one doesn't run on forever) and ping me and we can look at it. We can see if it's working as it should or not and then offer some help from there.
Screenshots are problematic in terms of what resolution it was grabbed at and then how it's scaled when responding to the device. There is always going to be some image degradation if you insert a screenshot into a lower resolution container. To avoid any compression Rise does to optimize the image you
Just add _NOPROCESS_ to the name of your image file.
In terms of dimensions, the images will either crop (to respond to the screen) or scale. There's no perfect dimension. Here's what I recommend when working with images:
Use the highest quality image you can
work with a consistent aspect ratio. I usually use 16:9 and for the square blocks, 1:1. The cover image, I use 3:1(which is like three squares). The core content in the vicinity of the middle square won't get cropped out regardless of the device.
Tom: Thanks, man. Your insights and assistance are so useful! This was good to think about as well, "Screenshots are problematic in terms of what resolution it was grabbed at and then how it's scaled when responding to the device." We all use screenshots to some degree or another as a last resort. What consistently pops up for me is the way Rise handles (or does not handle) zooms. I still do not understand the best practice for inserting the image size/rez, for optimum zoom effect.
85 Replies
hi All,
I'm facing the same issue. My file (see sample image for rise) when added as a full length image gets cut off at the bottom and top. If I choose to add it as a centred image, it gets too small to view. Any suggestions?
@Arathi, the 2-column grid gallery images need to be square. I believe if you add white space to the sides of your portrait images, they will show correctly.
Here's a quick help when working with images:
Of course you can crop the image in other tools, but I usually have PowerPoint open when working with Rise.
I am struggling with the image quality in Rise under the Course settings. I frequently use airline logo's as the cover photo and it seems any logo size I select appears distorted as the cover photo when the course is previewed. Any suggestions? I have added a logo below as an example of what I'm struggling.
Hi Jennifer!
Both of the logo files you attached are relatively small. You'll want to use the largest image sizes you have available so the logo will not lose quality if the course displays full screen.
Also, the best aspect ratio for the cover photo is 3:1. So for example, you could use an image that is 3000 pixels wide x1000 pixels tall.
Okay some of the responses in here don't make sense. You can't just speak of images in 16x9 and 1x1 those are video lingo. What are the dimensions or resolutions that we should be look for in each of the instances. Saying High res doesn't make sense. So when we are using the 2 columns persay. There is the on screen and then zoom image. What are the two dimensions? Reason i'm asking is that yep it is a square but is it 500x500 and then zoom is that simply coded to width parameter? Or is it 1600x1600 and the 2 column is cropping.
I guess my question might not be the specific resolutions, but letting us know how those are coded might help us in understanding what might be cropped and not. EG: the image response of make it a square that makes sense to have the hieght be the total and white on sides. But then if you have 3 column, the images are small and how will the zoom look.
I can go on and on, just asking and trying to save myself time as opposed to testing our every single sizing to see how they react. But if i have to do that just let me know. :-)
Hi there, Doug! We focus more on the aspect ratios than the dimensions because of the potential for that same image to be viewed on many screen sizes.
To keep it simple, use the bigger dimensions! When you zoom in Rise 360, the image will expand either to its original size, or until the browser window is full. When you use those high res images, they'll look great in the lesson and zoomed.
If you're having specific issues with image quality during zoom, however, let us know!
Nope, nope, nope. We all know Rise is responsive, and I think a lot of us don't care. I hate how the 2-column image grid crops my images in the lesson, and they only look "normal" upon zooming. I too have to add white space around my original image to make it square. That just makes the space between the image and the caption wider, and it doesn't look great.
Sorry, I don't mean to sound rude. But I get emails when people respond to these posts, and so many of us have issues with how Rise resizes images. It's just frustrating.
And what about a five image gallery? I can't seem to make it work with images all the same size? I can get three (smaller) and two (bigger) images using the 3 grid and 2 grid.
Hi Susan!
Tell me more about what you want to achieve with 5 images. There may be something else I can suggest! For example, you can design the 5-image layout on a PowerPoint slide, save the entire slide as one large image file, then upload it to an Image Full Width block.
Hi Alyssa: That is a good suggestion, but with the image treated as one, zooming would not be incorporated. Of course if there is no need, then that would be a def work-around in this case!
Hi folks! We just released a really cool feature to help with cropping your images. Find out more here.
Let me know how that works for you!
I love knowing the 3:1 trick for the cover photo - thank you!
The cropping tool helps a lot but in order to address the issue that a lot of folks indicated on this thread I'd love to see a Focal Point tool that allows you to drag the image in the frame to identify what should always be at the center of the image frame.
Something like this:
Tom, your tips document is fantastic! :)
Brian, did you ever create one and are willing to share? There's still a lot of 'guesswork' in image size and getting what you want.
I am a very new user to Articulate and just had this situation. I did have to google how to add white space around an image and it worked like a charm. Thank you, Annie!
its not working
Hi Krishna! Please tell me more about what's not working. If you can also include a screenshot of the issue, that'd be even better!
Tom - I found your tips on the blocks and the settings/media supported super interesting. This solves some questions I've had lately. By any change would you have a more recent version of this doc we could possibly utilise? Thanks so much
I can see this was over 4 years ago. I'm having the same problems now. Some issues I'm having:
Would you be able to share specific dimensions for what works on your image information pages. I can resize an image if I know what to resize to.
@heather: thanks for jumping in...just a few thoughts
There are some image blocks that are designed to respond to the device and will crop the image. For example, the blocks with text and image are designed to keep the text as the key focal point, which then crops the background image. If you use one of the square image blocks, it crops to the center square. And some images blocks are designed to scale the image.
It sounds like you may be experiencing some wonkiness. If the images you insert aren't responding the way designed for that block, contact our support team and they can look at it.
If you want to share what image you're inserting and the result, start a new thread (so this old one doesn't run on forever) and ping me and we can look at it. We can see if it's working as it should or not and then offer some help from there.
Screenshots are problematic in terms of what resolution it was grabbed at and then how it's scaled when responding to the device. There is always going to be some image degradation if you insert a screenshot into a lower resolution container. To avoid any compression Rise does to optimize the image you
In terms of dimensions, the images will either crop (to respond to the screen) or scale. There's no perfect dimension. Here's what I recommend when working with images:
Hope that helps.
Tom: Thanks, man. Your insights and assistance are so useful! This was good to think about as well, "Screenshots are problematic in terms of what resolution it was grabbed at and then how it's scaled when responding to the device." We all use screenshots to some degree or another as a last resort. What consistently pops up for me is the way Rise handles (or does not handle) zooms. I still do not understand the best practice for inserting the image size/rez, for optimum zoom effect.
I'm finding the images in my process block are all different sizes - some very large, some too small. How do I achieve a consistent size?
Hi Lisa! Sorry to hear that the images in your process block have different sizes.
Do all the original images (prior to uploading in Rise) have the same dimensions?
I'd also like to share a support article with you that may be helpful regarding Best Practices for Images Videos and Audio in Rise Courses.