Select Page

Today, I present to you our upcoming sermon series “Exposing Lies With Light.” I feel like it is one of the better sermon series graphics and videos I have produced.

The Concept

I used to do a lot of drawing, sketching, and painting. I don’t really do much of this anymore, but when starting a project from scratch, one of my favorite things to do is just try to come up with a few concepts. I try to sketch quickly and try to avoid searching for “inspiration” (read: stealing) before the sketching starts. I also try not to limit myself to things that are possible with my skills or comfortable. It’s much more freeing to approach it thinking “how can I pull this off this concept,” instead of limiting yourself from the start.

Design Considerations

  • Strong Contrast – I wanted a very strong contrast. The title of the series “Exposing Lies with Light” is a very black and white title. There are many ways to develop this contrast, but there had to be some element of light or illumination with a title like this. Here are some of my design considerations:
    • Dark vs. Light
    • Dying / Decay imagery vs. Living / Growing imagery
    • Overlaying different contrasting text statements over a static image
  • Smoke / Particles – With the imagery likely going in some form of dark/light exposure-based theme, I wanted to incorporate some sort of smoke and particle elements that would interact with the light, when present, in the bumper video.
  • Light Features – Again, the light theme just couldn’t be ignored. I was trying to figure out a few ways to do this.

Ideas / examples

A text-based design – A dark frame with a spotlight style light on the top right. The “LIES” text would look beautiful against the black, but when “exposed” by the light, the letters would be shown to be something terrible, like black snakes… or have the bottom of the “E” and “S” dissolve in the light

A static-image design – A headshot of a person (possibly dual exposure) with strong lighting and strong shadows… think of a Harvey Dent (Two-Face) thing. The light would expose either beauty or grossness/death. In then end, this concept was just too abstract for me.

A fog / light design – Another thought was having smoke that was burned off by a spotlight, with lies in the smoke and truth revealed in the spotlight.

[image_gallery id=”300583b113a01abe671b342ae2ffb204″ images=”‹º›{‹²›attachment_id‹²›:5863,‹²›url‹²›:‹²›//‹²›},{‹²›attachment_id‹²›:5872,‹²›url‹²›:‹²›//‹²›},{‹²›attachment_id‹²›:5871,‹²›url‹²›:‹²›//×376.png‹²›}‹¹›” columns=”3columns” image_ratio=”square” dots=”disable” autoplay=”{‹²›autoplay‹²›:‹²›off‹²›,‹²›on‹²›:{‹²›animation_speed‹²›:3}}” overlay=”off” margin=”15″ __fw_editor_shortcodes_id=”4252c38bca274ea63075ee9e92dce0f7″ _array_keys=”{‹²›images‹²›:‹²›images‹²›,‹²›autoplay‹²›:‹²›autoplay‹²›}” _fw_coder=”aggressive”][/image_gallery]

The Direction

In one of my first posts on this blog for class (Image Manipulation – Quote), I used a silhouetted person backlit by strong light panels. I was thinking about different lights I’ve used in my photography and video days and thought about some of the most basic lights you see every day… fluorescent tube lights. Like in that post, a light like this is bold. You can find them in all sorts of shapes, and they CYCLE. That means, that at high shutter speeds, your camera actually picks up color flickering. Also, when you have lights that are physically cold, they take a few seconds to turn on and produce a nice glitch effect. So, I decided to run with it… black against fluorescent lighting with some sort of unique way of presenting words and phrases.


[single_image id=”703fc92266dbd881670bbc42eddd504a” image=”{‹²›attachment_id‹²›:‹²›5864‹²›,‹²›url‹²›:‹²›//‹²›}” url=”” alignment=”left” size=”large” radius=”0″ lightbox=”false” shadow=”disabled” overlay=”{‹²›overlay‹²›:‹²›disabled‹²›,‹²›overlay1‹²›:{‹²›button_name‹²›:‹²›This is button‹²›,‹²›button_icon‹²›:‹²›ti-check‹²›}}” popover=”” animation=”none” animation_speed=”2″ animation_delay=”0″ __fw_editor_shortcodes_id=”f6f8480ac0027d9a1bd9d62ab9987468″ _array_keys=”{‹²›image‹²›:‹²›image‹²›,‹²›overlay‹²›:‹²›overlay‹²›}” _fw_coder=”aggressive”][/single_image]

The Building Process

Above, you can sort of see the progression. When I am designing sermon graphics, I am not solely focusing on a still graphic. I’m constantly thinking about how the still image and the upcoming bumper video will interact. Sometimes, I simply animate some of the layers from my photoshop document in After Effects (like I did in our “HIM” series). Sometimes, I’ll design a graphic, then design a separate bumper video using assets from the graphic (like I did in the similarly titled “Exposed: Unfiltered Truth” series). And other times, like I did with this project, I design the graphic and video at the same time.


Glowing TextI duplicated the “Exposing … With Light” text layers, adding 3 different styles.

  • Top – A plain white text layer to solidify the letters at 50% opacity.
  • Middle – a text layer with a glow added to it using inner glow, gradient overlay, and a few other style elements.
  • Bottom – Took the white text and applied a heavy gaussian blur, this created a bit of white glow.

Created a blue/green “smoke” effect.

  • I created a new layer and filled it with a green to transparent radial gradient around the text
  • Created a new layer and Rendered black-white clouds
  • Set this cloud layer to “darken”
  • Grouped the gradient and clouds and applied a mask to mask out most of the cloud and gradient except the area right around the text
  • REPEATED THE PROCESS with a blue gradient
  • Nudged the layers around the screen

Added the word “LIES” to the middle of the graphic

  • Spent way too long trying to come up with a “good” layer style look

[image_gallery id=”3ac5be476bf376db66e94e658f844ecc” images=”‹º›{‹²›attachment_id‹²›:5865,‹²›url‹²›:‹²›//‹²›},{‹²›attachment_id‹²›:5866,‹²›url‹²›:‹²›//‹²›},{‹²›attachment_id‹²›:5868,‹²›url‹²›:‹²›//‹²›}‹¹›” columns=”3columns” image_ratio=”square” dots=”disable” autoplay=”{‹²›autoplay‹²›:‹²›off‹²›,‹²›on‹²›:{‹²›animation_speed‹²›:3}}” overlay=”off” margin=”15″ __fw_editor_shortcodes_id=”ef4fbaa54c2328c8a36a96c949b27682″ _array_keys=”{‹²›images‹²›:‹²›images‹²›,‹²›autoplay‹²›:‹²›autoplay‹²›}” _fw_coder=”aggressive”][/image_gallery]



Sure, I needed to spell out the word “LIES” for the main graphic, but I also knew I wanted to do something with the x-ray effect on top of the fluorescent lights. For the video, I decided I’d have a black background with white text on top with a phrase that sounds good, but does not line up with scripture. Then, the phrase would be “hit” with the light, and expose the truth, so I knew I had 3-4 phrases to create. It was time-consuming, but here was the process.

1. Place every letter needed onto(into) the photoshop document. – This became pretty tedious. I grabbed every letter I needed and threw them all in the document in the same place. This allowed me to put all the individual letter files in a group behind the actual font. Then, I resized the entire group of images (letters), to match the actual font. Because I resized every letter at once, they were each the same size…and it kept me from having to resize each letter individually. Then I drug each letter to its proper spot behind the letters

2. Remove overlap from each letter. – Because the letters were so close to each other, and because my “bone” font was a collection of jpgs, their individual canvases overlapped onto the next letter. So, using the rectangular marquee tool (rectangle select), I drew a box as close to the letter as possible, inverted my selection, pressed delete, and moved on to the next letter.

3. Apply a mask to the bone letter group using the actual cubano font text. – If this is confusing, let me briefly explain. All my “bones” were in a folder. I manually aligned each letter in the previous 2 steps. On a separate layer was a text layer containing the CUBANO font of the same size. I control-clicked on the thumbnail, and it selected the text itself (marching ants around the words), then used this selection to create a mask…In fewer words, using 2 clicks I removed everything but the words in the foldered bone-font.

I repeated this process 3 times.

[image_gallery id=”7b4024736fcc2cb2e212e5831a1df06d” images=”‹º›{‹²›attachment_id‹²›:5873,‹²›url‹²›:‹²›//‹²›},{‹²›attachment_id‹²›:5875,‹²›url‹²›:‹²›//‹²›},{‹²›attachment_id‹²›:5874,‹²›url‹²›:‹²›//‹²›},{‹²›attachment_id‹²›:5885,‹²›url‹²›:‹²›//‹²›}‹¹›” columns=”3columns” image_ratio=”square” dots=”disable” autoplay=”{‹²›autoplay‹²›:‹²›off‹²›,‹²›on‹²›:{‹²›animation_speed‹²›:3}}” overlay=”on” margin=”15″ __fw_editor_shortcodes_id=”e7cf991650a0b5acde4c5a1df7a0cc02″ _array_keys=”{‹²›images‹²›:‹²›images‹²›,‹²›autoplay‹²›:‹²›autoplay‹²›}” _fw_coder=”aggressive”][/image_gallery]