Topics

Featured in Development

Peter Alvaro talks about the reasons one should engage in language design and why many of us would (or should) do something so perverse as to design a language that no one will ever use. He shares some of the extreme and sometimes obnoxious opinions that guided his design process.

Featured in AI, ML & Data Engineering

Today on The InfoQ Podcast, Wes talks with Katharine Jarmul about privacy and fairness in machine learning algorithms. Jarul discusses what’s meant by Ethical Machine Learning and some things to consider when working towards achieving fairness. Jarmul is the co-founder at KIProtect a machine learning security and privacy firm based in Germany and is one of the three keynote speakers at QCon.ai.

Featured in Culture & Methods

Organizations struggle to scale their agility. While every organization is different, common patterns explain the major challenges that most organizations face: organizational design, trying to copy others, “one-size-fits-all” scaling, scaling in siloes, and neglecting engineering practices. This article explains why, what to do about it, and how the three leading scaling frameworks compare.

Courtney Hemphill on VR, Augmented Reality, and the Importance of Animation in UX

Transforms and translations are what power animations are in software, and fundamentally all that motion is about velocity, acceleration and interpolation.In this week's podcast, Barry Bird talks to Courtney Hemphill, a partner and tech lead at Carbon Five. With over ten years of experience in software development, Hemphill has done full stack development for both startup and enterprise companies. Hemphill's presentation at QCon New York was entitled Algorithms for Animation.

Key Takeaways

We are moving closer to natural user interfaces, and this is something software engineers across the board need to consider when they are developing programs.

More and more you are seeing the cutting edge companies using animation to help people see where things lie within an interface, and be able to map out where the things they might need are.

Transforms and translations are what power animations are in software, and fundamentally all that motion is about velocity, acceleration and interpolation.

If you are trying to get someone to engage with your program or platform, you want enough animation to keep them engaged, but not so much that it confuses them.

Testing is essential: If you don't know what's wrong, you don't know how to fix it.

Related Sponsor

Notes

Why Developers Should Care About Creating Animations

1m:05s - The interfaces we interact with in software are becoming more dynamic.

1m:30s - We are moving closer to natural user interfaces, and this is something software engineers across the board need to consider when they are developing programs. You don't just have a pointer and a mouse and a keyboard- you can squish and stretch things, using your fingers and your hands.

1m:55s - Animations need to feel real, and that is all based in Math and Physics.

2m:15s - The animations you see on websites have always been an opportunity for us to have a more fundamental learning about what the program does without needing a lot of instruction.

2m:38s - Animation functions almost as a way for people to discover and explore an interface so they can interact and engage with it more easily.

The Importance of Animation Resembling Reality

3m:00s - If you've ever put on an Oculus Rift and experienced "judder" and felt immediately sick, that's the most extreme version.

3m:31s - If a computer is running slowly and you see frames dropped, you are sensing something underlying that is not right, and you immediately distrust it.

3m:42s - The further away you get from something that is smooth, the more you start to mistrust the platform and the data behind it.

Natural Textures vs Cartoon-Like Textures

4m:28s - We are still working with a digital device, so it's difficult to represent something that has a tactile element to it, whereas with animation we're ok with a 2D screen representing real-world movement.

5m:10s - More and more you are seeing the cutting edge companies using animation to help people see where things lie within an interface, and be able to map out where the things they might need are.

6m:25s - Fundamentally, humans felt that the things they were using were a digital device and should be representative of a 2D digital world.

6m:50s - What you now see has been elevated more, and is this notion of animation and motion within an interface.

Effective Navigation with Animation

7m:35s - Snapchat is one of the most popular programs, and if you try to find any sort of navigational rule you will fail miserably. It just works, and more than anything it's playful.

8m:10s - Every action that you take with Snapchat has a representative motion-animation response from the program that gives a little bit more information.

8m:24s - There are some rules that people say are best practices, but some people have thrown those completely out and been very successful in doing so.

Math in Creating Animations

8m:53s - Transforms and translations are what power animations are in software, and fundamentally all that motion is about velocity, acceleration and interpolation. What you layer on top of the interpolation function is where things get really interesting.

9m:26s - It gets very complex very quickly but for people to understand just the basis of all of it it is just around acceleration, velocity and the percent change.

10m:04s - We don't live in a linear world, we live in a world that's got torque and yaw and friction, and all sorts of weird physics that act upon motion. You can't just have linear motion; you've got to bring in the effects of gravity and bring Newtonian physics into animation.

Becoming Proficient in Animation

13m:13s - When you start learning about animations, you start to see that everything has a framework, everything has magic. If you think about Ruby on Rails, Rails adds a lot of magic to what is underneath it. Physics engines do effectively the same thing.

13m:47s - If you start by understanding the core components, and then you layer the nuances on top of it, you start to get into the Unity and Unreal engines and you can have more power to manipulate and understand how to have greater effect within those physics engines and frameworks, because you have that core understanding.

14m:28s - You can get far by just playing; the frameworks take care of a lot of the math, but you will benefit greatly if you have the foundational knowledge of what it's all built upon.

Common Mistakes Illustrating Complicated Ideas with Animation

17m:15s - Doing too much at once- humans find it very difficult to keep track of more than four moving things of note in an interface.

17m:35s - If you are trying to get someone to engage with your program or platform, you want enough animation to keep them engaged, but not so much that it confuses them.

18m:22s - You can put something into an interface, you can design it, you can build it; but you have to put it in front of an end user. You can have measured it and seen the performance be perfect across all the machines, you've done user testing- but you need to have the person the program is intended for play around. They are the only ones who can tell you "This is too much, I am confused."

20m:15s - It's very tricky to represent data within an animated framework. You can show things moving in a way, but it might confuse people more than their ability to sit down to a static graph, and have the opportunity to digest it themselves.

Best Practices

25m:28s - Test often. Make sure your frames per second are keeping with the 60 frames-per-second or faster realm to prevent jank.

25m:41s - If we're talking about browser-based animations, you'll want to consider the opportunity to push things to the GPU and off the CPU.

More about our podcasts

You can keep up-to-date with the podcasts via our RSS Feed, and they are available via SoundCloud and iTunes. From this page you also have access to our recorded show notes. They all have clickable links that will take you directly to that part of the audio.