Home >
One of the key concepts for a RIA is that it has to be rich. This could be rich content, rich interactivity, or a combination of the two. The extent of the richness of the application directly ties to an emotional response when using the application. We always want that to be a good response, otherwise that application that you spent a lot of time and effort creating will be dead before you know it.
One way to enhance the richness of the experience is to make things interactive, engaging, and entertaining to the user. When making things more rich and interactive, its often the little things that count the most. My series of posts on graphics tricks show you how to change the way things look, but by themselves don't show you how to apply them and make things more engaging.
Here's a quick example how you can apply some of these graphics effects to create a richer drag effect. Just click on the panel and drag it. Pay attention to the animations when you click and drag.
Notice that there are two things going on here...
1. Animate the opacity to semi-transparent
2. Animate the distance of the drop shadow
Applying these two effects creates an illusion of depth within the application. It appears as though the object that you click on is lifted off of the plane of the application, and is dropped back onto the application when you release it.
I hope this gives you a few ideas to help you make your own applications more interactive.
You can access this example in a new window at:
http://www.cynergysystems.com/blogs/blogs/andrew.trice/animationEffect/main.html
You can view the source here:
http://www.cynergysystems.com/blogs/blogs/andrew.trice/animationEffect/srcview/
Or, you can download the source here:
http://www.cynergysystems.com/blogs/blogs/andrew.trice/animationEffect/srcview/Animation Example.zip
Tag Cloud
Podcasts & Screencasts
@InsideRIA on Twitter
Follow InsideRIA on Twitter
Facebook Application Development
This is a very cool and relatively simple effect.
While cool, that animation effect gives me vertigo. Clues are important, but more subtle ones would be a lot less distracting.
Understandable, however this example was exaggerated to demonstrate the effect. It can very easily be altered to be less dramatic. It has added quite a bit to the "engaging factor" of the applications that I have used it.
Hi all
First of all, I wish to say that these are the greatest articles I've came across in a long time. seriously, great work.
Having said that, I missing the part of the jBoss deployment. as I read I see that it's not going to be discussed on the next installment, and I don't remember having read that on the previous ones.
am I missing something?
Many thanks and keep up the good work!
lazer epilasyon
Hi All
All this cross browser, cross platform my a$#, I run on Mac and I can't see any showcase from Siverlight.net; I donno I installed it twice.
Anyways, I'm rooting for Flex and AIR, with Thermo's release, Adobe will get to compete exponentially with UIs and capabilities. estetik
The graphic effect looks great. I would say the pane looks not lifted but pushed down as it becomes little light in color than clear. What I was thinking is, how to use these graphic effects for presentations. This would be great handy tool for presenters while showing interactions between objects. Pick and drop while you explain.
-------------------------------
Joseph | Me Online
Hello:
I wonder is their anyone out there that can help me. I need a pattern tool like a pick colour tool. For flash interactivity or any script language I can get it in. I need to be able to set up an area on a web page say showing the interior of a house, like the bathroom. Set up some different tile samples of to the side of the image. and be able to change the pattern of the bathroom tile with a click. I have looked everywhere for anything that resembles this and have come up empty.
An help would be greatly appreciated
Thank You
Jeff
reutenjeff@yahoo.com
Hello:
I wonder is their anyone out there that can help me. I need a pattern tool like a pick colour tool. For flash interactivity or any script language I can get it in. I need to be able to set up an area on a web page say showing the interior of a house, like the bathroom. Set up some different tile samples of to the side of the image. and be able to change the pattern of the bathroom tile with a click. I have looked everywhere for anything that resembles this and have come up empty.
An help would be greatly appreciated
Thank You
Jeff
reutenjeff@yahoo.com