[Phpmyadmin-devel] Animations in routines functionality
Hi there, I've added some animations to the routines functionalities in my branch and I'm just looking for your opinions about this. A demo video is available on my site [1]. Please let me know if you think that it's too much eye-candy or if you think that it's OK. I didn't check this into my repo yet and I'm keeping the code in my git-stash. Also I'm wondering if it's worth adding a new configuration variable to disable animations in PMA (there are already quite a few of them arou) for users that have slower computers. What do you think? Rouslan [1]: http://www.placella.com/pma/routine_animations.ogv
2011/6/16 Rouslan Placella <rouslan@placella.com>:
Hi there,
I've added some animations to the routines functionalities in my branch and I'm just looking for your opinions about this. A demo video is available on my site [1]. Please let me know if you think that it's too much eye-candy or if you think that it's OK. I didn't check this into my repo yet and I'm keeping the code in my git-stash.
Personally, I don't like the table jumping up and down. Moving objects attract attention, especially if a large part of the screen moves, and in this case it looks like an effect done because it can be done. Space above Routines table should expand / contract to proper height in one move - it it needs two, then the effect stops looking nice, it becomes annoying. If it can't be done, it would look nice with old content replaced by new with 0 opacity and using fade in to show it. (Note - I can be prejudiced, I hate collapsible options in PMA because the animation used there is just wrong imo) -- Piotr Przybylski
Piotr Przybylski a écrit :
2011/6/16 Rouslan Placella <rouslan@placella.com>:
Hi there,
I've added some animations to the routines functionalities in my branch and I'm just looking for your opinions about this. A demo video is available on my site [1]. Please let me know if you think that it's too much eye-candy or if you think that it's OK. I didn't check this into my repo yet and I'm keeping the code in my git-stash.
Personally, I don't like the table jumping up and down. Moving objects attract attention, especially if a large part of the screen moves, and in this case it looks like an effect done because it can be done. Space above Routines table should expand / contract to proper height in one move - it it needs two, then the effect stops looking nice, it becomes annoying.
If it can't be done, it would look nice with old content replaced by new with 0 opacity and using fade in to show it.
(Note - I can be prejudiced, I hate collapsible options in PMA because the animation used there is just wrong imo)
Piotr, feel free to suggest another animation. -- Marc Delisle http://infomarc.info
2011/6/16 Marc Delisle <marc@infomarc.info>:
Piotr Przybylski a écrit :
2011/6/16 Rouslan Placella <rouslan@placella.com>:
Hi there,
I've added some animations to the routines functionalities in my branch and I'm just looking for your opinions about this. A demo video is available on my site [1]. Please let me know if you think that it's too much eye-candy or if you think that it's OK. I didn't check this into my repo yet and I'm keeping the code in my git-stash.
Personally, I don't like the table jumping up and down. Moving objects attract attention, especially if a large part of the screen moves, and in this case it looks like an effect done because it can be done. Space above Routines table should expand / contract to proper height in one move - it it needs two, then the effect stops looking nice, it becomes annoying.
If it can't be done, it would look nice with old content replaced by new with 0 opacity and using fade in to show it.
(Note - I can be prejudiced, I hate collapsible options in PMA because the animation used there is just wrong imo)
Piotr, feel free to suggest another animation.
After looking at it closely, I realized what bothers me in this case - 'clip' effect looks like two animations mixed up due to hidden panel being vertically centered - 'blind' and moving it at the same time, making it impossible to focus on what is being shown. Plain 'blind' would be the best, but is painfully slow due to reflows of all content below, so maybe a 'blind' that reserves space for box in the same way as 'clip' does (so that content below it is moved only once). -- Piotr Przybylski
Piotr Przybylski a écrit :
2011/6/16 Marc Delisle <marc@infomarc.info>:
Piotr Przybylski a écrit :
2011/6/16 Rouslan Placella <rouslan@placella.com>:
Hi there,
I've added some animations to the routines functionalities in my branch and I'm just looking for your opinions about this. A demo video is available on my site [1]. Please let me know if you think that it's too much eye-candy or if you think that it's OK. I didn't check this into my repo yet and I'm keeping the code in my git-stash. Personally, I don't like the table jumping up and down. Moving objects attract attention, especially if a large part of the screen moves, and in this case it looks like an effect done because it can be done. Space above Routines table should expand / contract to proper height in one move - it it needs two, then the effect stops looking nice, it becomes annoying.
If it can't be done, it would look nice with old content replaced by new with 0 opacity and using fade in to show it.
(Note - I can be prejudiced, I hate collapsible options in PMA because the animation used there is just wrong imo)
Piotr, feel free to suggest another animation.
After looking at it closely, I realized what bothers me in this case - 'clip' effect looks like two animations mixed up due to hidden panel being vertically centered - 'blind' and moving it at the same time, making it impossible to focus on what is being shown. Plain 'blind' would be the best, but is painfully slow due to reflows of all content below, so maybe a 'blind' that reserves space for box in the same way as 'clip' does (so that content below it is moved only once).
Piotr, 'slide' instead of 'clip' seems to work well. -- Marc Delisle http://infomarc.info
On Tue, 2011-06-21 at 12:51 -0400, Marc Delisle wrote:
Piotr Przybylski a écrit :
2011/6/16 Marc Delisle <marc@infomarc.info>:
Piotr Przybylski a écrit :
2011/6/16 Rouslan Placella <rouslan@placella.com>:
Hi there,
I've added some animations to the routines functionalities in my branch and I'm just looking for your opinions about this. A demo video is available on my site [1]. Please let me know if you think that it's too much eye-candy or if you think that it's OK. I didn't check this into my repo yet and I'm keeping the code in my git-stash. Personally, I don't like the table jumping up and down. Moving objects attract attention, especially if a large part of the screen moves, and in this case it looks like an effect done because it can be done. Space above Routines table should expand / contract to proper height in one move - it it needs two, then the effect stops looking nice, it becomes annoying.
If it can't be done, it would look nice with old content replaced by new with 0 opacity and using fade in to show it.
(Note - I can be prejudiced, I hate collapsible options in PMA because the animation used there is just wrong imo)
Piotr, feel free to suggest another animation.
After looking at it closely, I realized what bothers me in this case - 'clip' effect looks like two animations mixed up due to hidden panel being vertically centered - 'blind' and moving it at the same time, making it impossible to focus on what is being shown. Plain 'blind' would be the best, but is painfully slow due to reflows of all content below, so maybe a 'blind' that reserves space for box in the same way as 'clip' does (so that content below it is moved only once).
Piotr, 'slide' instead of 'clip' seems to work well.
Since my branch was merged with master, these sliding animations are now available for everyone to use. If anyone wants to use them, it's really simple. First merge with master (I pushed a bugfix to this functionality recently). Then, from JavaScript, call PMA_slidingMessage() with the message to display as the first argument. Typically this would happen from an AJAX request, so the call might look like: PMA_slidingMessage(data.message); This will show the message just below the navigation links in the right frame. Or, to show the message somewhere specific on the page, one might do the following: PMA_slidingMessage(data.message, $('#myDiv')); If, in this case, #myDiv does not exists, then the message will be shown in the default location. If the target element for the animation, whether specified or implied, already contains a message, it will be faded out and replaced. Empty messages are not allowed. Bye, Rouslan
Le 2011-06-21 16:57, Rouslan Placella a écrit :
On Tue, 2011-06-21 at 12:51 -0400, Marc Delisle wrote:
Piotr Przybylski a écrit :
2011/6/16 Marc Delisle <marc@infomarc.info>:
Piotr Przybylski a écrit :
2011/6/16 Rouslan Placella <rouslan@placella.com>:
Hi there,
I've added some animations to the routines functionalities in my branch and I'm just looking for your opinions about this. A demo video is available on my site [1]. Please let me know if you think that it's too much eye-candy or if you think that it's OK. I didn't check this into my repo yet and I'm keeping the code in my git-stash. Personally, I don't like the table jumping up and down. Moving objects attract attention, especially if a large part of the screen moves, and in this case it looks like an effect done because it can be done. Space above Routines table should expand / contract to proper height in one move - it it needs two, then the effect stops looking nice, it becomes annoying.
If it can't be done, it would look nice with old content replaced by new with 0 opacity and using fade in to show it.
(Note - I can be prejudiced, I hate collapsible options in PMA because the animation used there is just wrong imo)
Piotr, feel free to suggest another animation.
After looking at it closely, I realized what bothers me in this case - 'clip' effect looks like two animations mixed up due to hidden panel being vertically centered - 'blind' and moving it at the same time, making it impossible to focus on what is being shown. Plain 'blind' would be the best, but is painfully slow due to reflows of all content below, so maybe a 'blind' that reserves space for box in the same way as 'clip' does (so that content below it is moved only once).
Piotr, 'slide' instead of 'clip' seems to work well.
Since my branch was merged with master, these sliding animations are now available for everyone to use.
Rouslan, thanks but I was not talking about a sliding message; this was about the sliding sections like Options in Browse. -- Marc Delisle http://infomarc.info
On Thu, 2011-06-16 at 21:05 +0200, Piotr Przybylski wrote:
2011/6/16 Rouslan Placella <rouslan@placella.com>:
Hi there,
I've added some animations to the routines functionalities in my branch and I'm just looking for your opinions about this. A demo video is available on my site [1]. Please let me know if you think that it's too much eye-candy or if you think that it's OK. I didn't check this into my repo yet and I'm keeping the code in my git-stash.
Personally, I don't like the table jumping up and down. Moving objects attract attention, especially if a large part of the screen moves, and in this case it looks like an effect done because it can be done. Space above Routines table should expand / contract to proper height in one move - it it needs two, then the effect stops looking nice, it becomes annoying.
If it can't be done, it would look nice with old content replaced by new with 0 opacity and using fade in to show it.
(Note - I can be prejudiced, I hate collapsible options in PMA because the animation used there is just wrong imo)
Well, I added in the animations because without them the content on the page just flashes and I find that really disturbing, not just because I could (you can see this functionalities without the animations on my demo server). But yeah, you have a good idea there about making the content slide once from the source size to the target size with alpha blending to complement the transition, I'll look into, but it doesn't sound simple to implement and it will probably be CPU intensive. And I was suggesting the configuration option to disable animations especially for people that are annoyed by them and also for people with old computers :) Rouslan
2011/6/16 Rouslan Placella <rouslan@placella.com>:
On Thu, 2011-06-16 at 21:05 +0200, Piotr Przybylski wrote:
2011/6/16 Rouslan Placella <rouslan@placella.com>:
Hi there,
I've added some animations to the routines functionalities in my branch and I'm just looking for your opinions about this. A demo video is available on my site [1]. Please let me know if you think that it's too much eye-candy or if you think that it's OK. I didn't check this into my repo yet and I'm keeping the code in my git-stash.
Personally, I don't like the table jumping up and down. Moving objects attract attention, especially if a large part of the screen moves, and in this case it looks like an effect done because it can be done. Space above Routines table should expand / contract to proper height in one move - it it needs two, then the effect stops looking nice, it becomes annoying.
If it can't be done, it would look nice with old content replaced by new with 0 opacity and using fade in to show it.
(Note - I can be prejudiced, I hate collapsible options in PMA because the animation used there is just wrong imo)
Well, I added in the animations because without them the content on the page just flashes and I find that really disturbing, not just because I could (you can see this functionalities without the animations on my demo server). But yeah, you have a good idea there about making the content slide once from the source size to the target size with alpha blending to complement the transition, I'll look into, but it doesn't sound simple to implement and it will probably be CPU intensive.
One effect or the other, two at one will surely be too slow. I think alpha alone would be the simplest to implement, as you just have to replace contents and run the animation.
And I was suggesting the configuration option to disable animations especially for people that are annoyed by them and also for people with old computers :)
Sounds reasonable. I think this could be implemented by setting jQuery.fx.off to true. -- Piotr Przybylski
On Thu, 2011-06-16 at 22:47 +0200, Piotr Przybylski wrote:
2011/6/16 Rouslan Placella <rouslan@placella.com>:
On Thu, 2011-06-16 at 21:05 +0200, Piotr Przybylski wrote:
2011/6/16 Rouslan Placella <rouslan@placella.com>:
Hi there,
I've added some animations to the routines functionalities in my branch and I'm just looking for your opinions about this. A demo video is available on my site [1]. Please let me know if you think that it's too much eye-candy or if you think that it's OK. I didn't check this into my repo yet and I'm keeping the code in my git-stash.
Personally, I don't like the table jumping up and down. Moving objects attract attention, especially if a large part of the screen moves, and in this case it looks like an effect done because it can be done. Space above Routines table should expand / contract to proper height in one move - it it needs two, then the effect stops looking nice, it becomes annoying.
If it can't be done, it would look nice with old content replaced by new with 0 opacity and using fade in to show it.
(Note - I can be prejudiced, I hate collapsible options in PMA because the animation used there is just wrong imo)
Well, I added in the animations because without them the content on the page just flashes and I find that really disturbing, not just because I could (you can see this functionalities without the animations on my demo server). But yeah, you have a good idea there about making the content slide once from the source size to the target size with alpha blending to complement the transition, I'll look into, but it doesn't sound simple to implement and it will probably be CPU intensive.
One effect or the other, two at one will surely be too slow. I think alpha alone would be the simplest to implement, as you just have to replace contents and run the animation.
And I was suggesting the configuration option to disable animations especially for people that are annoyed by them and also for people with old computers :)
Sounds reasonable. I think this could be implemented by setting jQuery.fx.off to true.
I've improved the animation to only slide once during the replacement of the content and uploaded a new demo video [1]. Please let me know what you think. [1]: http://www.placella.com/pma/improved_routine_animations.ogv
2011/6/17 Rouslan Placella <rouslan@placella.com>:
On Thu, 2011-06-16 at 22:47 +0200, Piotr Przybylski wrote:
2011/6/16 Rouslan Placella <rouslan@placella.com>:
On Thu, 2011-06-16 at 21:05 +0200, Piotr Przybylski wrote:
2011/6/16 Rouslan Placella <rouslan@placella.com>:
Hi there,
I've added some animations to the routines functionalities in my branch and I'm just looking for your opinions about this. A demo video is available on my site [1]. Please let me know if you think that it's too much eye-candy or if you think that it's OK. I didn't check this into my repo yet and I'm keeping the code in my git-stash.
Personally, I don't like the table jumping up and down. Moving objects attract attention, especially if a large part of the screen moves, and in this case it looks like an effect done because it can be done. Space above Routines table should expand / contract to proper height in one move - it it needs two, then the effect stops looking nice, it becomes annoying.
If it can't be done, it would look nice with old content replaced by new with 0 opacity and using fade in to show it.
(Note - I can be prejudiced, I hate collapsible options in PMA because the animation used there is just wrong imo)
Well, I added in the animations because without them the content on the page just flashes and I find that really disturbing, not just because I could (you can see this functionalities without the animations on my demo server). But yeah, you have a good idea there about making the content slide once from the source size to the target size with alpha blending to complement the transition, I'll look into, but it doesn't sound simple to implement and it will probably be CPU intensive.
One effect or the other, two at one will surely be too slow. I think alpha alone would be the simplest to implement, as you just have to replace contents and run the animation.
And I was suggesting the configuration option to disable animations especially for people that are annoyed by them and also for people with old computers :)
Sounds reasonable. I think this could be implemented by setting jQuery.fx.off to true.
I've improved the animation to only slide once during the replacement of the content and uploaded a new demo video [1].
Please let me know what you think.
[1]: http://www.placella.com/pma/improved_routine_animations.ogv
Looks much better to me. I am a bit concerned about content reflows during size change, but there shouldn't be much content there to cause performance problems. -- Piotr Przybylski
On Fri, Jun 17, 2011 at 1:29 PM, Rouslan Placella <rouslan@placella.com> wrote:
On Thu, 2011-06-16 at 22:47 +0200, Piotr Przybylski wrote:
2011/6/16 Rouslan Placella <rouslan@placella.com>:
On Thu, 2011-06-16 at 21:05 +0200, Piotr Przybylski wrote:
2011/6/16 Rouslan Placella <rouslan@placella.com>:
Hi there,
I've added some animations to the routines functionalities in my branch and I'm just looking for your opinions about this. A demo video is available on my site [1]. Please let me know if you think that it's too much eye-candy or if you think that it's OK. I didn't check this into my repo yet and I'm keeping the code in my git-stash.
Personally, I don't like the table jumping up and down. Moving objects attract attention, especially if a large part of the screen moves, and in this case it looks like an effect done because it can be done. Space above Routines table should expand / contract to proper height in one move - it it needs two, then the effect stops looking nice, it becomes annoying.
If it can't be done, it would look nice with old content replaced by new with 0 opacity and using fade in to show it.
(Note - I can be prejudiced, I hate collapsible options in PMA because the animation used there is just wrong imo)
Well, I added in the animations because without them the content on the page just flashes and I find that really disturbing, not just because I could (you can see this functionalities without the animations on my demo server). But yeah, you have a good idea there about making the content slide once from the source size to the target size with alpha blending to complement the transition, I'll look into, but it doesn't sound simple to implement and it will probably be CPU intensive.
One effect or the other, two at one will surely be too slow. I think alpha alone would be the simplest to implement, as you just have to replace contents and run the animation.
And I was suggesting the configuration option to disable animations especially for people that are annoyed by them and also for people with old computers :)
Sounds reasonable. I think this could be implemented by setting jQuery.fx.off to true.
I've improved the animation to only slide once during the replacement of the content and uploaded a new demo video [1].
Please let me know what you think.
[1]: http://www.placella.com/pma/improved_routine_animations.ogv
Agreeing with Piotr, the animation is way more pleasant now. But one other thing looks pretty annoying to me, that is having all these partly useless PMA_ajaxShowMessage()'es pop up and disappear sometimes really so fast you cannot read the content. - some loading messages flash so quick you don't even know what it is - messages that display the successful execution are not needed since you already see the success of the current action in the light green box below the links bar. This applies to many areas in phpmyadmin. In your demonstration the drawbacks of those messages are particularly present though. In my opinion PMA_ajaxShowMessage() in its current implementation should be thrown out of pma completely. A loading indicator should appear in a small box at the top of the screen like gmail has, success messages should appear in the same way or within a light green box like the ones in rouslans demo video.
------------------------------------------------------------------------------ EditLive Enterprise is the world's most technically advanced content authoring tool. Experience the power of Track Changes, Inline Image Editing and ensure content is compliant with Accessibility Checking. http://p.sf.net/sfu/ephox-dev2dev _______________________________________________ Phpmyadmin-devel mailing list Phpmyadmin-devel@lists.sourceforge.net https://lists.sourceforge.net/lists/listinfo/phpmyadmin-devel
On Sat, 2011-06-18 at 18:14 +0200, Tyron Madlener wrote:
On Fri, Jun 17, 2011 at 1:29 PM, Rouslan Placella <rouslan@placella.com> wrote:
On Thu, 2011-06-16 at 22:47 +0200, Piotr Przybylski wrote:
2011/6/16 Rouslan Placella <rouslan@placella.com>:
On Thu, 2011-06-16 at 21:05 +0200, Piotr Przybylski wrote:
2011/6/16 Rouslan Placella <rouslan@placella.com>:
Hi there,
I've added some animations to the routines functionalities in my branch and I'm just looking for your opinions about this. A demo video is available on my site [1]. Please let me know if you think that it's too much eye-candy or if you think that it's OK. I didn't check this into my repo yet and I'm keeping the code in my git-stash.
Personally, I don't like the table jumping up and down. Moving objects attract attention, especially if a large part of the screen moves, and in this case it looks like an effect done because it can be done. Space above Routines table should expand / contract to proper height in one move - it it needs two, then the effect stops looking nice, it becomes annoying.
If it can't be done, it would look nice with old content replaced by new with 0 opacity and using fade in to show it.
(Note - I can be prejudiced, I hate collapsible options in PMA because the animation used there is just wrong imo)
Well, I added in the animations because without them the content on the page just flashes and I find that really disturbing, not just because I could (you can see this functionalities without the animations on my demo server). But yeah, you have a good idea there about making the content slide once from the source size to the target size with alpha blending to complement the transition, I'll look into, but it doesn't sound simple to implement and it will probably be CPU intensive.
One effect or the other, two at one will surely be too slow. I think alpha alone would be the simplest to implement, as you just have to replace contents and run the animation.
And I was suggesting the configuration option to disable animations especially for people that are annoyed by them and also for people with old computers :)
Sounds reasonable. I think this could be implemented by setting jQuery.fx.off to true.
I've improved the animation to only slide once during the replacement of the content and uploaded a new demo video [1].
Please let me know what you think.
[1]: http://www.placella.com/pma/improved_routine_animations.ogv
Agreeing with Piotr, the animation is way more pleasant now. But one other thing looks pretty annoying to me, that is having all these partly useless PMA_ajaxShowMessage()'es pop up and disappear sometimes really so fast you cannot read the content.
- some loading messages flash so quick you don't even know what it is
Those "fast" ajax messages read "Loading..." (as in: loading the content for the dialog, etc), but because I was using the loopback interface on my computer while recording that video, the requests were answered really fast by phpMyAdmin. If you try this on my demo server, you will see that those messages actually stay on for quite a bit.
- messages that display the successful execution are not needed since you already see the success of the current action in the light green box below the links bar.
Good idea to remove some of those, thanks :)
This applies to many areas in phpmyadmin. In your demonstration the drawbacks of those messages are particularly present though.
In my opinion PMA_ajaxShowMessage() in its current implementation should be thrown out of pma completely. A loading indicator should appear in a small box at the top of the screen like gmail has, success messages should appear in the same way or within a light green box like the ones in rouslans demo video.
participants (4)
-
Marc Delisle -
Piotr Przybylski -
Rouslan Placella -
Tyron Madlener