3 ms·

Oh please god, not again Looks kids, Firstly its not motion design, its animation. Shoving in a non linear tween into an interface does not make it more useabl

Oh please god, not again Looks kids, Firstly its not motion design, its animation. Shoving in a non linear tween into an interface does not make it more useable. Thats why everyone hated flash, not because it was insecure or "slow", they hated it because it was full of stupid transitions. Lets put it this way: Go look at FT.com Look at it, its horrific. In terms of design it basically a poorly translated printed page on the screen. However its wildly popular. 500,000 people pay for that interface, why? because the content is so good. Let that sink in for a moment. If the only differentiator between you and your competitor is the amount of ease-in tweens in your UI, you're in an over-saturated sector, go home, start again. As for the OP's first assertion: "if something has been deleted, shove an animation in" NO. what if I want to delete multiple items quickly? (I'm looking at you IOS Mail app.) do I seriously have to suffer that battery sucking animation Every. Fucking. Time? Just lay it out, make it consistent, remove as many steps as possible, and make it fast. Let your content/USP do the talking.

DonHopkins 11y ago
Another flowery buzzword for the same old technique (from judiciously using animation to draw and focus attention, to gratuitously abusing it to dazzle and titillate) is "cinematic interface". Of course like any flowery buzzword, different people have different takes on what it means, but here you go: One concrete example from OpenLaszlo: there was a "cinematic" input focus indicator, so when you tabbed between controls in a form, it would smoothly fade in, animate over and fade out four corner chevrons from the current field to the next, to draw your attention and move your eyes to the next field in a form. And of course it supported type-ahead: you could quickly press any number of tab or back-tabs, and it would continuously animate toward the current input focus. I thought it was actually pretty nice and served a purpose, and was obvious enough that it didn't need any explanation, but yymv. Here's a talk about OpenLaszlo that defined the term "Cinematic User Experience" (this was years ago so it all seemed so fascinating at the time): Creating a Cinematic User Experience with OpenLaszlo: http://webconf.hu/2007/program/i/openlaszloen.html http://webconf.hu/2007/program/i/openlaszloen.html What is meant by the term Cinematic User Experience? It’s characterized by the following: Continuous User Interface: By featuring fluid application state changes, rather than today’s standard page-by-page format, a Laszlo-enabled site helps users stay oriented and efficiently complete multi-step online tasks. Universal Canvas: With the ability to view common media data types including text, video and sound formats seamlessly on a single “universal canvas,” users are able to work with integrated multimedia information displays without the distraction of separate playback software for each media data type. Furthermore, Laszlo enables a wide array of media types without requiring users to install additional plug-in software. Real Time Information: Traditional Web sites only update information when a page is reloaded. Laszlo enables live data push into standard browsers. This real-time messaging enables Laszlo-powered Web sites to provide integrated instant messaging and real-time inventory or financial information displays. Other people have used the same term in various ways: Cinematic Continuity in User Interface Design: https://medium.com/ux-design-1/cinematic-continuity-on-ui-design-8aa191ab9c8e#.ijfn4dnko https://medium.com/ux-design-1/cinematic-continuity-on-ui-de... Cinematic Interfaces -- Film Theory After New Media: https://www.routledge.com/products/9780415833158 https://www.routledge.com/products/9780415833158
- userbinator 11y ago
  I really like the adjective "cinematic" in that you get an experience like watching an action movie, with stuff flying everywhere and general attention-getting mayhem every time something happens; but it also reflects the fact that, no, people do not want interacting with UI to be such an exciting experience. (Notwithstanding things like games where excitement can be appropriate.)

DonHopkins 11y ago

Another flowery buzzword for the same old technique (from judiciously using animation to draw and focus attention, to gratuitously abusing it to dazzle and titillate) is "cinematic interface". Of course like any flowery buzzword, different people have different takes on what it means, but here you go: One concrete example from OpenLaszlo: there was a "cinematic" input focus indicator, so when you tabbed between controls in a form, it would smoothly fade in, animate over and fade out four corner chevrons from the current field to the next, to draw your attention and move your eyes to the next field in a form. And of course it supported type-ahead: you could quickly press any number of tab or back-tabs, and it would continuously animate toward the current input focus. I thought it was actually pretty nice and served a purpose, and was obvious enough that it didn't need any explanation, but yymv. Here's a talk about OpenLaszlo that defined the term "Cinematic User Experience" (this was years ago so it all seemed so fascinating at the time): Creating a Cinematic User Experience with OpenLaszlo: http://webconf.hu/2007/program/i/openlaszloen.html http://webconf.hu/2007/program/i/openlaszloen.html What is meant by the term Cinematic User Experience? It’s characterized by the following: Continuous User Interface: By featuring fluid application state changes, rather than today’s standard page-by-page format, a Laszlo-enabled site helps users stay oriented and efficiently complete multi-step online tasks. Universal Canvas: With the ability to view common media data types including text, video and sound formats seamlessly on a single “universal canvas,” users are able to work with integrated multimedia information displays without the distraction of separate playback software for each media data type. Furthermore, Laszlo enables a wide array of media types without requiring users to install additional plug-in software. Real Time Information: Traditional Web sites only update information when a page is reloaded. Laszlo enables live data push into standard browsers. This real-time messaging enables Laszlo-powered Web sites to provide integrated instant messaging and real-time inventory or financial information displays. Other people have used the same term in various ways: Cinematic Continuity in User Interface Design: https://medium.com/ux-design-1/cinematic-continuity-on-ui-design-8aa191ab9c8e#.ijfn4dnko https://medium.com/ux-design-1/cinematic-continuity-on-ui-de... Cinematic Interfaces -- Film Theory After New Media: https://www.routledge.com/products/9780415833158 https://www.routledge.com/products/9780415833158

userbinator 11y ago
I really like the adjective "cinematic" in that you get an experience like watching an action movie, with stuff flying everywhere and general attention-getting mayhem every time something happens; but it also reflects the fact that, no, people do not want interacting with UI to be such an exciting experience. (Notwithstanding things like games where excitement can be appropriate.)