Custom Dividers Resolution & Sizing

Question

Hi All!
I have been trying to get custom dividers to work on a course, but when following the steps in the article below I am finding that they are SUPER pixelated and low-res when I upload them to Rise.
Do any of you fine folk have any tips or tricks for me to take my next Rise Module up a notch in the design stakes?
I really appreciate all the help you can give!
&nbsp;
https://community.articulate.com/blog/tips-tricks/make-your-rise-course-look-different-with-custom-dividers/1215506

philfoss · Answer

I saw this solution on this forum- design it full width approx 1400px or so wide, save as a png or svg. Then insert it as a labeled graphic (with no markers) and it will show full size like you designed it. And if you're reusing this divider, make sure to use the 'duplicate/copy' function and even save it as a block template to reuse across lessons. Otherwise, if you keep uploading the image each time, it will show up as separate images in your SCORM which keeps adding to the overall file size.

elizabeth · Answer

Either try the NOPROCESS route as outlined in this article for .png images:&nbsp;https://access.articulate.com/support/article/Best-Practices-for-Images-Videos-and-Audio-in-Rise-Courses or save your images as SVGs. You won't be able to crop SVG images so they'll have to be right size, but they will be crisp when you import.

jmmanalili · Answer

Hi DanielBott,
Thanks for reporting this and sharing the screenshots!
I compared a labeled graphic in Edit and Preview modes and tried adjusting the image width, but I wasn’t able to reproduce the cropping you’re seeing on the right side. What image format are you using, such as SVG, PNG, or JPG?
Could you share the original image used in your labeled graphic? If the cropping also appears in Review 360, a link to the course would help us take a closer look. You’re welcome to open a support case if you’d prefer to share these privately.
Looking forward to hearing from you!&nbsp;

josetansengco · Answer

Hello EwanLaing-b692c​,
Thanks for reaching out!
Would you mind sharing a quick Peek 360 recording of how you export the divider images from PowerPoint to help us understand why they turn out pixelated when added in Rise 360? For your reference, I used this option in PowerPoint to save the divider as an image file before uploading it to a Rise 360 course.&nbsp;

If this is how you're exporting your dividers, would you mind trying the image I attached to see if it becomes pixelated if uploaded to a Rise 360 course as a divider?
&nbsp;

joriewilk · Answer

Thank you for sharing. I like the labeled graphic solution. I tried a few other options (full width image as an SVG and a custom block with a shape), but those still leave a faint line between the blocks of the same color even with 0 padding.

Using the labeled graphic makes transition seamless.