Blur effect?

Discuss how to use the Ren'Py engine to create visual novels and story-based games. New releases are announced in this section.
Forum rules
This is the right place for Ren'Py help. Please ask one question per thread, use a descriptive subject like 'NotFound error in option.rpy' , and include all the relevant information - especially any relevant code and traceback messages. Use the code tag to format scripts.
Message
Author
User avatar
Lumen_Astrum
Dystopian Princess
Posts: 1662
Joined: Mon Nov 08, 2010 8:01 am
Completed: Soul and Heart, Twin Faces
Projects: Soul and Heart Replay; The Court of the Two Sides (tentative title)
Organization: Lion Box Studios
Tumblr: lumenizampel
Location: Philippines
Contact:

Blur effect?

#1 Post by Lumen_Astrum » Wed May 18, 2011 3:18 am

Is it possible to make a blur effect on RenPy?

Because I've wanted something like the one below.
Photoshop-generated xD
ph.png
Unfortunately, I know ONLY how to call the thingie in the middle,
Anybody help me?

Or if this isn't possible, is there any way to make an almost similar effect?

User avatar
redcat
Regular
Posts: 189
Joined: Thu Oct 30, 2008 9:30 am
Contact:

Re: Blur effect?

#2 Post by redcat » Wed May 18, 2011 4:30 am

@Lumen_Astrum--> A built-in blur effect in Renpy would slow down the whole system because it needs high processing power. I don't think PyTom would ever consider adding that feature into Renpy.

The next best thing you could do is to make two version of the image : one normal and one blurred, and then you make transition between those images to achieve the "blur" effect.
Meowwngg...??

User avatar
mugenjohncel
Hentai Poofter
Posts: 2114
Joined: Sat Feb 04, 2006 11:13 pm
Organization: Studio Mugenjohncel
Location: Philippines
Contact:

Help is on the way!

#3 Post by mugenjohncel » Thu May 19, 2011 4:13 pm

Image

Download this and hope this will help you in achieving your desired Blur effect... :)

"POOF" (Disappears)

Edit:
Drats!... It seems I have inadvertently uploaded a massive spoiler...

What was I thinking last night?
Attachments
Blur Effect for Lumen.zip
Extract, Look, Tinker, Enjoy
(1.61 MiB) Downloaded 520 times

User avatar
Lumen_Astrum
Dystopian Princess
Posts: 1662
Joined: Mon Nov 08, 2010 8:01 am
Completed: Soul and Heart, Twin Faces
Projects: Soul and Heart Replay; The Court of the Two Sides (tentative title)
Organization: Lion Box Studios
Tumblr: lumenizampel
Location: Philippines
Contact:

Re: Blur effect?

#4 Post by Lumen_Astrum » Fri May 20, 2011 12:00 am

For some reason, when I try to run the sample, it doesn't work... :/

Code: Select all

I'm sorry, but an uncaught exception occurred.

Exception: config.narrator_menu is not a known configuration variable.

While executing init code:
 - script at line 88 of renpy-6.12.0-mainline/template/game/screens.rpy
 - python at line 89 of renpy-6.12.0-mainline/template/game/screens.rpy.

-- Full Traceback ------------------------------------------------------------

  File "C:\Documents and Settings\Loewe\Desktop\Ren'Py\renpy-6.11.2\renpy\bootstrap.py", line 270, in bootstrap
  File "C:\Documents and Settings\Loewe\Desktop\Ren'Py\renpy-6.11.2\renpy\main.py", line 255, in main
  File "C:\Documents and Settings\Loewe\Desktop\Ren'Py\renpy-6.11.2\renpy\execution.py", line 259, in run
  File "C:\Documents and Settings\Loewe\Desktop\Ren'Py\renpy-6.11.2\renpy\ast.py", line 574, in execute
  File "C:\Documents and Settings\Loewe\Desktop\Ren'Py\renpy-6.11.2\renpy\python.py", line 957, in py_exec_bytecode
  File "renpy-6.12.0-mainline/template/game/screens.rpy", line 89, in <module>
  File "C:\Documents and Settings\Loewe\Desktop\Ren'Py\renpy-6.11.2\renpy\store.py", line 78, in __setattr__
Exception: config.narrator_menu is not a known configuration variable.

While executing init code:
 - script at line 88 of renpy-6.12.0-mainline/template/game/screens.rpy
 - python at line 89 of renpy-6.12.0-mainline/template/game/screens.rpy.

Ren'Py Version: Ren'Py 6.11.2b

User avatar
Anima
Veteran
Posts: 448
Joined: Wed Nov 18, 2009 11:17 am
Completed: Loren
Projects: PS2
Location: Germany
Contact:

Re: Blur effect?

#5 Post by Anima » Fri May 20, 2011 12:02 am

Your ren'py version is probably to old.
Avatar created with this deviation by Crysa
Currently working on:
  • Winterwolves "Planet Stronghold 2" - RPG Framework: Phase III

User avatar
Aleema
Lemma-Class Veteran
Posts: 2677
Joined: Fri May 23, 2008 2:11 pm
Organization: happyB
Tumblr: happybackwards
Contact:

Re: Blur effect?

#6 Post by Aleema » Fri May 20, 2011 12:14 am

So it was basically just what redcat said: Make another image of your screen, blur it in a photo editor, and then dissolve to it when you want to blur in your game. I think, instead of a blur, you could do a black background. It achieves the same effect (focus on the highlighted graphic while dimming out the background). Just make a solid black image with, like, 50% transparency and export as a PNG. Then show that when you show your cutout. Not a blur, but it does the same thing.

User avatar
mugenjohncel
Hentai Poofter
Posts: 2114
Joined: Sat Feb 04, 2006 11:13 pm
Organization: Studio Mugenjohncel
Location: Philippines
Contact:

Re: Blur effect?

#7 Post by mugenjohncel » Fri May 20, 2011 12:22 am

Lumen_Astrum wrote:For some reason, when I try to run the sample, it doesn't work... :/
Like what Anima said... Update to the latest Renpy...

"POOF" (Disappears)

User avatar
Lumen_Astrum
Dystopian Princess
Posts: 1662
Joined: Mon Nov 08, 2010 8:01 am
Completed: Soul and Heart, Twin Faces
Projects: Soul and Heart Replay; The Court of the Two Sides (tentative title)
Organization: Lion Box Studios
Tumblr: lumenizampel
Location: Philippines
Contact:

Re: Blur effect?

#8 Post by Lumen_Astrum » Fri May 20, 2011 12:24 am

Oh, thank you. :D
The one that mugenjohncel worked out wonders too [after I updated my version of RenPy], but I'll be tinkering more for the best effect :)

User avatar
redcat
Regular
Posts: 189
Joined: Thu Oct 30, 2008 9:30 am
Contact:

Re: Help is on the way!

#9 Post by redcat » Fri May 20, 2011 12:29 am

mugenjohncel wrote: Edit:
Drats!... It seems I have inadvertently uploaded a massive spoiler...

What was I thinking last night?
@UncleMugen--> We - want - more!! We - want - More!!
:lol:
Meowwngg...??

User avatar
Alex
Lemma-Class Veteran
Posts: 2317
Joined: Fri Dec 11, 2009 5:25 pm
Contact:

Re: Blur effect?

#10 Post by Alex » Fri May 20, 2011 2:41 pm

I don't know how exactly blur made in photoshop-like programms (definitely they uses very complex formulas), but made an attempt to simulate such an effect using ATL (its not an actual blur, but looks quite unfocused). These are 3 different effects to compare.

Code: Select all

init:
    image bg = "bg.png"
        
    
    image bbgg:
        contains:
            "bg.png"
            alpha 1.0
        contains:
            "bg.png"
            alpha 0.2 xoffset -3
        contains:
            "bg.png"
            alpha 0.2 xoffset +3
        contains:
            "bg.png"
            alpha 0.2 yoffset -3
        contains:
            "bg.png"
            alpha 0.2 yoffset +3
        
    image bbgg_1:

        contains:
            "bg.png"
            alpha 1.0
        contains:
            "bg.png"
            alpha 0.2 rotate 0.5 xalign 0.5 yalign 0.5
        contains:
            "bg.png"
            alpha 0.2 rotate -0.5 xalign 0.5 yalign 0.5
        contains:
            "bg.png"
            alpha 0.2 rotate 1 xalign 0.5 yalign 0.5
        contains:
            "bg.png"
            alpha 0.2 rotate -1 xalign 0.5 yalign 0.5
        
    image bbgg_2:
        contains:
            "bg.png"
            alpha 1.0
        contains:
            "bg.png"
            alpha 0.2 zoom 1.015
        contains:
            "bg.png"
            alpha 0.2 zoom 1.010
        contains:
            "bg.png"
            alpha 0.2 zoom 0.995
        contains:
            "bg.png"
            alpha 0.2 zoom 0.990

label start:

    scene bg with dissolve
    $ renpy.pause()

    scene bbgg with dissolve
    $ renpy.pause()
    
    scene bbgg_1 with dissolve
    $ renpy.pause()
    
    scene bbgg_2 with dissolve
    $ renpy.pause()
    
    jump start
It would be great, if someone, who skillfull at ATL, could transform this examples in to "transforms" (lol), that they could be used as <show bg at blur>, <show bg at blur_1>.

User avatar
redcat
Regular
Posts: 189
Joined: Thu Oct 30, 2008 9:30 am
Contact:

Re: Blur effect?

#11 Post by redcat » Fri May 20, 2011 7:17 pm

@Alex--> Interesting!
I just like to add that we could also use the image from transformation to make another transformation.
For example, I add a stronger blur from the soft blur here...

Code: Select all

init:
    image bg = "bg.png"
    image bbgg:
        contains:
            "bg.png"
            alpha 1.0
        contains:
            "bg.png"
            alpha 0.2 xoffset -3
        contains:
            "bg.png"
            alpha 0.2 xoffset +3
        contains:
            "bg.png"
            alpha 0.2 yoffset -3
        contains:
            "bg.png"
            alpha 0.2 yoffset +3
     
    image bbgggaussian:
        contains:
            "bbgg"
            alpha 1.0
        contains:
            "bbgg"
            alpha 0.2 xoffset -3
        contains:
            "bbgg"
            alpha 0.2 xoffset +3
        contains:
            "bbgg"
            alpha 0.2 yoffset -3
        contains:
            "bbgg"
            alpha 0.2 yoffset +3
            
    image bbgg_1:
        contains:
            "bg.png"
            alpha 1.0
        contains:
            "bg.png"
            alpha 0.2 rotate 0.5 xalign 0.5 yalign 0.5
        contains:
            "bg.png"
            alpha 0.2 rotate -0.5 xalign 0.5 yalign 0.5
        contains:
            "bg.png"
            alpha 0.2 rotate 1 xalign 0.5 yalign 0.5
        contains:
            "bg.png"
            alpha 0.2 rotate -1 xalign 0.5 yalign 0.5
       
    image bbgg_2:
        contains:
            "bg.png"
            alpha 1.0
        contains:
            "bg.png"
            alpha 0.2 zoom 1.015
        contains:
            "bg.png"
            alpha 0.2 zoom 1.010
        contains:
            "bg.png"
            alpha 0.2 zoom 0.995
        contains:
            "bg.png"
            alpha 0.2 zoom 0.990

label start:
    scene bg with dissolve
    $ renpy.pause()

    scene bbgg with dissolve
    $ renpy.pause()
   
    scene bbgggaussian with dissolve
    $ renpy.pause()
    
    scene bbgg_1 with dissolve
    $ renpy.pause()
   
    scene bbgg_2 with dissolve
    $ renpy.pause()   
        
return
Meowwngg...??

User avatar
azureXtwilight
Megane Procrastinator
Posts: 4078
Joined: Fri Mar 28, 2008 4:54 am
Completed: Fantasia series (ROT and ROTA), Doppleganger: Dawn of The Inverted Soul, a2 (a due), Time Labyrinth
Projects: At Regime's End
Organization: Memento-Mori VNs, Team Sleepyhead
Location: Yogyakarta, Indonesia.
Contact:

Re: Blur effect?

#12 Post by azureXtwilight » Sun Jul 17, 2011 10:36 am

Hmm, how do we make a stronger effect of blur for bbg_1 and bbg_2?
Image

User avatar
Alex
Lemma-Class Veteran
Posts: 2317
Joined: Fri Dec 11, 2009 5:25 pm
Contact:

Re: Blur effect?

#13 Post by Alex » Sun Jul 17, 2011 4:50 pm

What do you mean - "stronger"? To make it looks more unfocused?
In my example it works like:
1) show an image
2) show some semi-transparent and slightly offset copies of that image over it
So you can add some more copies with different offsets or make them less transparent, maybe...

Also, I played with it a bit and that's what I got

Code: Select all

init:
    image eileen happy = "eileen_happy.png"

    transform blur(child):
        contains:
            child
            alpha 1.0
        contains:
            child
            alpha 0.2 xoffset -3
        contains:
            child
            alpha 0.2 xoffset 3
        contains:
            child
            alpha 0.2 yoffset -3
        contains:
            child
            alpha 0.2 yoffset 3

    transform zoom_blur(child):
        contains:
            child
            alpha 1.0
        contains:
            child
            alpha 0.2 zoom 1.015
        contains:
            child
            alpha 0.2 zoom 1.010
        contains:
            child
            alpha 0.2 zoom 0.995
        contains:
            child
            alpha 0.2 zoom 0.990

label start:
    show eileen happy:
        xpos 0.5
    $ renpy.pause()
    show eileen happy at blur
    "Some good memories"
    show eileen happy with move:
        xpos 0.7
    $ renpy.pause()
    show eileen happy at zoom_blur
    "..."
* I don't know why, but this transforms are not friendly with "align"s and "anchor"s (only "pos"s)... :?:

User avatar
blakjak
Veteran
Posts: 224
Joined: Fri Dec 21, 2007 2:36 pm
Location: France
Contact:

Re: Blur effect?

#14 Post by blakjak » Sun Jul 17, 2011 6:11 pm

Alex wrote:I don't know how exactly blur made in photoshop-like programms (definitely they uses very complex formulas), but made an attempt to simulate such an effect using
It would be great, if someone, who skillfull at ATL, could transform this examples in to "transforms" (lol), that they could be used as <show bg at blur>, <show bg at blur_1>.
That's a smart idea. =)

Counter Arts
Miko-Class Veteran
Posts: 645
Joined: Fri Dec 16, 2005 5:21 pm
Completed: Fading Hearts, Infinite Game Works
Projects: Don't Save the World
Organization: Sakura River
Location: Canada
Contact:

Re: Blur effect?

#15 Post by Counter Arts » Sun Jul 17, 2011 7:15 pm

Haha! I must commend Alex on the fast blur technique. This is how some older games without shaders used to do it. I implemented it in a shader.

This totally won't work nearly as fast on software rendering mode. Use the pre-blur technique for that. Or use this technique to pre-blur on load so you don't have worry about it being slow later.
Fading Hearts is RELEASED
http://www.sakurariver.ca

Post Reply

Who is online

Users browsing this forum: Bing [Bot], Google [Bot]