Blurred Backgrounds Effects in E-Learning #366: Challenge | Recap
Design Visually Rich Backgrounds Using This Simple Effect
Background images are one of the best ways to add visual intere...
Published 3 years ago
Version 1.0
Blog Post
Dominik,
I liked your interaction but noticed it didn't actually blur and that some of the colors didn't make sense.
For fun, I recreated it with a few minor updates. I copied the background picture and cropped the copy to be the same size as the text. I saved a copy of that picture and pasted over the background picture. Then I took a copy of that and blurred it then added a washout effect. Finally, I added an animation to the blur state by clicking ctrl c, ctrl x, ctrl v to copy the picture, delete it and paste it while in edit state mode. then adding a slow wipe effect from the right.
For the buttons, I used the eyedropper to select colors from the background photo (I like the green from the statue and the blues from the sky/water).
For the bullet points I did something similar with the color the same as the buttons (green) and the outline the color of the statue base (brown).
Demo: https://360.articulate.com/review/content/5c5c0c27-96e2-41cf-ac27-b5e34cfd9ed8/review
I liked your interaction but noticed it didn't actually blur and that some of the colors didn't make sense.
For fun, I recreated it with a few minor updates. I copied the background picture and cropped the copy to be the same size as the text. I saved a copy of that picture and pasted over the background picture. Then I took a copy of that and blurred it then added a washout effect. Finally, I added an animation to the blur state by clicking ctrl c, ctrl x, ctrl v to copy the picture, delete it and paste it while in edit state mode. then adding a slow wipe effect from the right.
For the buttons, I used the eyedropper to select colors from the background photo (I like the green from the statue and the blues from the sky/water).
For the bullet points I did something similar with the color the same as the buttons (green) and the outline the color of the statue base (brown).
Demo: https://360.articulate.com/review/content/5c5c0c27-96e2-41cf-ac27-b5e34cfd9ed8/review
Thanks for your feedback, Ron. I did some adjustments :)
- Dominik,
Very kind of you to incorporate my suggestions. Keep up the awesome work.