Forum Discussion

laambrose's avatar
laambrose
Community Member
2 months ago

Blurry Transition Images Rise 360 Microlearning

I've been having trouble getting my transition graphics to look seamless like this example "What to Avoid Saying to Sound Confident." I created the images in PowerPoint using this tutorial but I can't get them to look seamless and the edges are always stretched/blurry. I also tried the "_NOPROCESS_" workaround and that doesn't make a difference. I've looked at several other posts on the forum and videos online but nothing seems to work. Would love advice on how they were created in the example provided above. Below are screenshots of how they look in my presentation. I can't share the microlearning presentation as it has sensitive information. 

 

  • Hello laambrose! I'm happy to help! Have you found the quality of the image changes depending on the size of the browser window? One troubleshooting step I'd also recommend importing the images into a new Rise 360 course to see if the quality changes in a new file.

     

    Keep us updated on what the outcome is with both of these steps and we can go from there!

    • laambrose's avatar
      laambrose
      Community Member

      Hi there - Unfortunately, neither option made any difference; the images are still blurry. Is there a certain slide size in PowerPoint I should use or dimensions that the image needs to be in order for it not to be blurry? Or was a different platform used to create them in the example I provided in my initial post? I'd love a step by step tutorial for how that one was created if that is available anywhere. 

    • laambrose's avatar
      laambrose
      Community Member

      I haven't found a way to export them from PowerPoint to SVG as I'm using a Mac.

  • AmyODonnell's avatar
    AmyODonnell
    Community Member

    I have a couple ideas that may help!

    1. We've created a Rise dimension cheat sheet that you can check to see if you have the transition image at the correct width and maybe pairing it with our labeled graphic hack!

    2. Basically, you add in a labeled graphic, take out all of the hotspots, and upload your image. Then you'll make the image full-width and take off the padding!

    Here's a screenshot of one I made in microlearning that is crispy with illustrations! Hope this helps!

    • laambrose's avatar
      laambrose
      Community Member

      Thanks for the tips! The dimensions sheet is helpful. I tried using those dimensions and your labeled graphic tip and neither fixed the blurry issue. The images were also massive instead of a narrow divider. 

      • JoseTansengco's avatar
        JoseTansengco
        Staff

        Hello laambrose,
        Would you be willing to share copies of the affected images here or privately through a support case for testing? I'd like to compare them with same-resolution images that don't show the blurriness issue so we can pinpoint a possible cause.