 Welcome to the auditorium everybody up next. We have Michelle Scholp She is a web designer from Minneapolis freelance. Yep, and I have personally heard her talk in Chicago Minneapolis and Phoenix and You guys are in for a treat. Let's hear it for Michelle Scholp Great. That was good. That was some like coffee almost kicking in level clapping. So that's good. That's good. All right Good glad to hear that. All right. So anyway, this is this is what we're talking about So if you don't want to hear about this you are now trapped and you're stuck and you have to listen to it And you can't leave so sorry Anyway, yeah, so hi everybody. I'm Michelle like said I I'm a designer freelance I design and build digital interfaces. So what that looks like is My background is in design currently I do a lot of front-end development work with WordPress I build custom themes and I also do strategy focused UX for independent clients as well as for enterprise But specifically with animation My first freelance job right out of college was doing banner animations and had like giant site header Animations in flash so that was like my first freelance design job was doing all this animation stuff So it was really fun to get to know all of that stuff Although I'm really glad that we're not doing flash anymore And that was actually where I kind of wanted to get started It was talking about the current state of web animation right now because the days of flash and the days of putting a million gifts on your MySpace profile are long gone And we actually have a ton of really great technologies now that enable us to animate stuff. So Even CSS has a bunch of stuff built into it JavaScript has a ton of stuff we can do and they let us use motion to interact dynamically with our websites So what does that actually look like? Unfortunately, although we did leave the days of flash and MySpace behind Animation is still causing a lot of problems on the web You've probably noticed if you go to one of these really fancy sites that There might be a struggle with loading there might be bandwidth issues It's probably very very resource intensive and a lot of the complaints that people are saying about animation on the web Nowadays is that it's overdone. It's unnecessary. It's really annoying. It's super complex and another problem with animation is that we've got this thing called add the add effect or add blindness where we're So used to the flashing fancy thing being something that's trying to sell us something that we end up ignoring it So there's a lot of problems nowadays with animation on the web And one of the biggest ones is this trend of parallax websites So the Nielsen group who's basically the foremost experts on UX if you want to know anything about user experience Just read everything the Nielsen group ever has to say ever They've they did a big study on the usability of parallax websites, which have been around for a few years now And basically what they found is that a lot of user complaints that they are very difficult to control They take longer to load They're just very disorienting and they're dizzying they're very distracting and honestly the the words used were that they're Basically just not cool enough to warrant all the problems like it's not that great It's kind of cool, but it's not worth taking away from the user experience There's also a term in the animation industry called jank. It's a great term. I love this term It basically means any kind of stuttering or halting or breaking in the flow of the animation so you can tell that something's wrong Basically when an animation fails to load properly or if it fails to be able to keep up with the rendering And it basically interrupts how people can interact with your app, and it's very very distracting But animation is not the enemy. It's not all bad. It's a very useful tool So how do we avoid all of these problems and be able to use animation effectively in our projects? I Wanted to get started by introducing you all to the 12 principles of animation Who's heard of the 12 principles of animation even if you don't know them all all right a couple of you So some of you are nerds like me and the rest of you I will teach you right now These 12 principles of animation were developed Back in the day at Disney animation studios by some of the original core animators and what they were done They've also been put together as a really great book which I highly recommend you peruse or at least put on your coffee table So you look impressive But they were created to provide kind of a standardized platform to make animations feel more physically and psychologically believable So I'm gonna go through all of these principles right now so for the first principle is called squash and stretch and squash and stretch has to do with Physics a lot of these have to do with physics So this has to do with the physics of mass and the behavior of items if you've ever watched a video of a bouncing ball like In slow motion you see when the ball hits the ground due to inertia It squishes and then when it comes back up it stretches again So this is a principle that you use in animation to make things seem more physically believable There's also a principle called anticipation and anticipation is also a physics thing It's about mass and it's about inertia and the energy it takes to start and stop An object at rest tends to stay in rest an object in motion remains in motion So it takes energy to start an object and to stop an object So adding the right amount of anticipation gives it a sense of mass It also gives it a sense of character right because you could have the wind up or getting ready to get started on something You know like when Wiley coyote is about to take off running. He doesn't just go He usually like spins his legs for a while and then takes off like this is part of anticipation Staging is a general concept that basically just says hey viewer This is the most important part and there's lots of ways you can do it not just with the animation Although that is one way movement is away But also just the way you lay out the things on your stage the way you focus things the relationship between objects all of Those things have to do with staging We think about that a lot in design in terms of layout and hierarchy There's a concept in animation known as straight ahead action and also pose to pose and this is basically how Animators decided what went in between key frames Straight ahead action was when you actually drew every single key frame individually It was usually for more complex motions when stuff was happening pose to pose was like here's our Most common things we want square circle triangle and we'll let the junior animators figure out how to get there Or we'll let the computer figure out how to get there, right? Follow-through and overlapping action is also a concept in physics with mass and it has to do with Inertia, but also the differences in masses of different things. So for example When you have a tall object starts the bottom is starting But the top is still kind of at rest and so it's gonna kind of you know like this animation is showing It's gonna kind of lag behind and then it's gonna take a little bit longer to stop Another example of this is if you're turning your head your hair is gonna Keep moving a little bit longer than your head is because it weighs less than your head And so it's gonna keep going so this has to do with physics. It has to do with convincing behavior Slow in and slow out again this has to do with physics. It has to do with acceleration Most things don't just immediately go a constant speed and then stop they usually accelerate and decelerate This is also a concept in the animation world known as easing which we'll talk a little bit about later The the arc motion so in in objects in motion in the air They don't tend to go in a straight line due to gravity and mass they tend to move in an arc So they'll go up. They'll slow and then they'll come back down So this is a concept that follows the rules of physics Secondary action is both psychology and physics so in with physics It's a little bit of that attention to detail for example if there's a furry creature that's walking the fur is gonna kind of move That it's in its own way kind of making waves while the arms are moving in psychology This is an attention to detail that leads to more believability, right? Again furry creature if all of his hair just kind of was there It would be less believable than all the hair moving kind of separately So it's a concept that adds detail makes an animation more believable Timing has a lot to do with the physics of mass and also to paint what kind of Surfaces it might be on so you can see the top one on the bottom one although. They're the exact same shapes They feel like they're on a very different surface or they weigh a very different amount One of them takes a lot more energy to get started than the other and so these are things that affect the timing of an object Exaggeration is the concept in animation that Over-emphasis making things a little bit more ridiculous than real life actually makes it more believable It's kind of like when you're on stage and you're wearing stage makeup And if somebody came up to you after where they're like whoa, what do you what is your face? But on stage it makes your face look normal It's the same kind of thing with Exaggeration and animation being a little bit more over the top actually makes an animation more convincing The concept of solid drawing Means that your object is following the principles of space time and matter So it behaves consistently with itself and its environment So it's if it's a cube it's going to behave the way you would expect a cube to behave Maybe it's a cube made out of Jell-O. Maybe it's a cube made out of steel It's going to behave the way you'd expect it to behave and it's also contributing to the belief that this object could actually exist The last one is kind of a fuzzy one But it's appeal and it's basically the heart and soul or the personality of an object. It's the character It's like is it delightful is it is it fun like do we do we root for it? Do we enjoy it? This is very much a psych psychological aspect of animation But it's basically that little that last little 10% of making something be fun So now that we learned all of these things which is super cool How are these actually useful to us? So what what are these things actually providing to our animation? There's a few different things that they provide. So the first is realism, but we talked a lot about that We want things to behave the way we might expect them to behave in the real world. So the physics the psychology They establish context. So all of these things help establish spatial and causal relationships between states objects and their stage and they Establish influence between actions and objects. So if something does something something else will happen They also this also contributes to focus so it directs attention to the most important part of the stage and again delight that appeal Positive experiences the personality of an object. These are all the things that those principles contribute to animation So now that we know kind of about animation What are the actual properties that we can animate and in what way? So this part of it is now going to be your animation vocabulary lesson, which is super fun. We're in school, right? So that's what we're supposed to be doing These are some of the elements that you can animate so any given object you could change its color So maybe the border maybe the fill Maybe the texture maybe a pattern something like that you can change its shape So a square becomes a circle, you know something more complex than that you can change its location So where it is on the stage? You can change its focus So whether or not it's kind of right in the forefront and very easy to see or whether it's kind of faded into the background Maybe fuzzy you can change its scale So what size an object is and you can change its opacity. So whether or not it's transparent or solid or somewhere in between Here's the concept of easing. I just love this thing is hypnotic I just want to stare at it like it's so ridiculous But these are the different ways that objects can accelerate or decelerate on a stage The concept of ease in is speeding up or acceleration So if you hear and this is like a CSS property you can you can work with if you hear about easing in This is accelerating so starting slow and getting fast easing out is the opposite and that is slowing down or decelerating And then there's also the concept of bounce and that's where an object is using follow-through to go slightly past its destination and come back So maybe if it's zooming towards you it goes like a little bit bigger and then retreats Or if it's going this way it goes a little bit past it and then comes back This is especially useful in fast animations because if something is coming to a stop really quickly It's not going to immediately stop. It's probably going to go like this right so that makes it a little more believable Or if something is very small or lightweight, it's probably not just going to slide gracefully to a stop It's probably going to go like whoa, so you want that in your animations I want to talk a little bit about duration, which is the timing of an animation or how long something should take to animate So Nielsen again I'm going to bring up Nielsen all the time did a study called three important time limits and they came up with these These three so the first one is anywhere around a tenth of a second a hundred milliseconds is what the brain processes as an Instantaneous response, so it feels like it just automatically happened right around that time At about one second You feel connected it feels like it's part of the flow of thought. It's really good for Navigation or major state changes whereas the point one second is better for very small transitions Anything up to and past ten seconds your losers your users are going to lose their train of thought and feel disconnected So if it's going to if your process is going to take longer than ten seconds You probably want some kind of secondary animation in there like a loading bar So for example, he's a really quick simple animation really close to that point one second. It feels almost instantaneous It's just happening right away a little bit more complex animation Maybe somewhere in between that point one and one second so you can tell that it's happening, but it's not taking too long Transitions and navigations tend to happen right around that one second mark You feel like it's connected to what you are doing, but it's slow enough that you can see what's happening And then long ones that are going to take maybe closer to that ten second mark You see that it needs that intermediary loading bar to show you. Hey, something is happening There's several different kinds of transitions you can have The ones that were identified and I'm using a lot of examples from material design Google's material design obviously there's several different animation philosophies But they had a lot of really good animated examples and I kind of like what they had to show here So number one is persistent which means that it stays on the stage So as it animates it's going to stay on your stage Incoming means that it wasn't on the stage and now it is on the stage Outgoing is the opposite it started on the stage and now is not and static means that it's not doing anything at all It's not animated, but it is an object that it other things might be able to interact with or might be able to provide context So it's still important One type of transition is a cut transition and a lot of the web is built on cut transitions Right like when you click on something and load a whole new page and it goes to a new page It's a cut transition everything reloads, right? The problem with cut transitions is that there is like a big huge lack of orientation here Especially if everything changes your your brain kind of resets and you have this change blindness So you don't necessarily know what was changed on the screen So this is actually why Between page loads on places where we can't control the animation We want to have as much consistency as possible We want to keep our headers in the same place our navigation in the same place our photos in the same place To kind of eliminate some of that problematic change blindness that cuts Create then we have a concept called a tween and this is the transition between keyframes Which if you remember from the the straight ahead action and the pose to pose This is basically what all of those elements we talked about transition between each other So for example here, we've got the purple circle turning into the white square that is larger So we're transforming shape. We're transforming color. We're transforming scale. The background is transforming opacity There's a lot of tweening happening here. So that's basically just a term for When things transition between keyframes One that's used a lot is a fade. There's several different kinds of fade you can have a Dissolve, which is a standard fade where it just fades out Across dissolve, which is where it fades out while something else is fading in So there's an intermediary state where you can kind of see both of them or a Sequential fade where it fades out and then the next thing fades in so you never see them both on stage at the same time And then we have transformation again This is taking you taking advantage of some tweening But this is where one object is basically becoming another like morphing So the one with the letters is kind of fun You've probably I used to play with that stuff in flash all the time back when I first got started But the one on the right is kind of showing a really nice example of some value of you know a button turns into the loader Which turns into the confirmation. That's kind of a nice use of transformation. I Want to briefly show you this this is a lot on the screen at once and it's kind of cool, but UX in motion developed some specific uses of motion patterns that can be used in web design and you might recognize a bunch of these I would highly recommend you go check out UX in motion net and Read a little bit more about these they're built somewhat upon the principles of animation Somewhat upon just different patterns that you might be seeing and they all have to do specifically with user experience in motion But I don't want to go into too much detail on that I'm kind of giving you an overview of what you can start looking for on your own So now that we know basically all the elements of the animation and what we can animate and in what way how do we then use? animation semantically and usefully in order to add value to our websites, right like we're not just doing it for doing it One thing that Animation is very good at is providing a hierarchical context So we want to establish hierarchical relationships between different things or show how we are navigating between layers again these are some really good material design examples showing how Parent objects become child objects how tiles become full screen things and how layers relate to each other Using animation in the web to give you that context and establish that hierarchy It's also really useful for establishing relationships So the first couple on here are what's known as a tab-to-tab or scrolling and swiping relationships Which are basically peer-to-peer relationships. So they're equal hierarchy. They're you know cats and dogs We could argue whether or not they're the same, but for this sake, they're the same They're kind of peers in terms of navigational hierarchy. There's also relating drop-downs to their menu items So the third one has a lot of examples of showing how the elements relate to the button that you clicked on So it's easier to tell where they came from Expansions accordions or drop-downs are a great example of using animation rather than just happening You can see oh this came from here and this goes back to here and another great example is Like loading icons or placeholders showing where the content is going to eventually be It's also really really useful to provide feedback Which means that it's indicating that a user has done something and that you've received that action and it's working, right? So basic example is like a checkbox, right? You check it and it there's little animation that shows that it's checked great perfect Clicking and dragging or pressing and dragging on mobile very useful to show like hey We have actually picked up this thing. This is where it's going to move to this is where it's going to settle down at Adding something to cart and showing like oh cool now. It's in the cart I just use that animation or even something as simple as pressing buttons to enter in your passcode on your phone and Yes, I have pressed these buttons and then yes the password is correct or no the password is not correct for using animation to convey all of those things Yeah, it's really good for your success and error states which there's another great example on this page for indicating status Just shaking it a little bit to be like hey no you you type something in a little bit wrong another great status indicator is When you're loading new content showing where that content is going to load which is a great example on the left hand side there Toggling in between states so for example here light mode versus dark mode. We're using animation to show that Indicating a progress like a load bar or pagination or where you're at in a process Really great ways of using animation to show where you are You can also use animation to give instruction. There's lots of different ways. This could take place It could be anywhere as simple as when you first load something Just slightly showing what motion you're supposed to take the first one, you know you load it And it's like oh you can swipe this so then when you do it, you know, what's up You can use animation to build an entire walkthrough if you want to so kind of a pre-loading state where hey Here's how the app works you can use it to indicate progress through an app You can use it to call attention to something you might want to click on like hey This button is probably the one you want to start with so it's really good for giving instruction or for tool tips or for In-context instruction and of course again back to that concept of appeal Adding delight you can create a little bit of personality or character with your animation It goes along with what your brand is so that could be anywhere from micro interactions. I love The two on the right are like some great examples of little like micro uses of animation to just make it a little bit more Fun like pulling that thing down and launching that little paper airplane. I just love it You can do character animation like this loading thing is which is kind of fun Or any or even like full b-roller cut scenes, which is a little bit more kind of like old school flash loader But you can still do it in a tasteful way But different ways of adding delight and we've been using animation. It's not new like this isn't new We've been using animation on digital interfaces since they were created and I want to talk about the most important Animation that's ever been created on a on a digital interface and that's the flashing cursor It's actually like one of the original animations and it's super super useful. It tells us a lot of things First of all, it gives us hierarchy because it says hey, this is the element to focus on right This is the most important part of the page because it's the one that's moving It's gives us feedback. So as the flashing cursor moves. We know that we are typing and it's working Right it gives us status because as long as the cursor is flashing We know that our computer hasn't frozen or bogged down right because when it stops flashing That's a problem and it gives us instruction if we've never seen it before Here's where you're supposed to type right? So this is actually this little flashing cursor is a really really useful example of animation and digital interfaces Okay, so now that we've seen all of these different ways that we could use animation How do we then use it responsibly in our own projects? And there's a few questions that you should ask yourself when you're in the process of putting animations together thinking about using animation in your website First does it add value you want to prioritize animations that will add value or multiple forms of value So how could it add value? Does it show the user where information came from or where information went to? Does it indicate progress? Does it move the user through the information space so like be able to navigate between layers? Does it reinforce the physics of an object or does it reinforce your branding? Like does it feel on-brand? Does it explain something faster than words or a video could? Also are your behaviors consistent? It's a better user interface when all of your animations behave in a consistent way So if something is going to do a similar thing the animation should act similarly as well It's also if you're repeating yourself in a way that makes sense It's a better more maintainable code base and it's a little more streamlined because then you're reusing a few of the same patterns Instead of reinventing the wheel every single time Is your interface still functional without the animation? So I believe especially on web interfaces where we can't necessarily control the browsing experience We want animations to be very functional and very practical But it's still needs to be able to work without it, especially if your animation is being done by any cutting-edge CSS or JavaScript that people may not have enabled You want your actions to still be functional without it So they may not be as good they may not be as user experience friendly But they should still all work without your animation. It shouldn't be crucial Is your animation optimized so what does that mean? Certain things are more resource-intensive than others if we're using a parallax animation of a million really giant photos and videos That's probably not going to be super optimized So consider the size of your assets that you're animating Consider if you're animating a whole bunch of really complex points in an SVG If you're trying to render gradients and make them move around a certain way How many paths you're trying to animate which animation techniques you're using can you optimize them? Can you make them a little bit more streamlined? We want to avoid jank. We want to avoid resource hogs and bandwidths and being frustrating and making people click away from your site And Lastly, do you need it? Are you just doing it for the sake of being cool or do you need to actually do it at all? Or could you do something simpler or could you just avoid it like think about that and don't do it if you don't need it I? Wanted to close on kind of this this quote I read in the book animation at work Which is one of the elista part books that you can I read a lot of those and they're great But this quote was don't make something unless it is both necessary and useful But if it is both necessary and useful don't hesitate to make it beautiful And what I feel like that quote is saying is that you want to be pragmatic first You want it to be something that you need, but if it is something that you need do it purposefully and do it well So here's a list of links that you can't read right now But that's okay because I'm posting the slides online. I just wanted to make sure that I had them all for you here The first one is really cool because it is all of those principles of animation But all done completely in CSS so that's really cool because you can see how that works and also jank free org About avoiding jank in your animations all of these are some just delightful light brunch reading That you can that's what I do over brunch as I read about animation principles So like you can too it goes really good with eggs But anyway Wrapping up the formal part of the presentation right now. So here's me Here's how you can get in touch there is the link of where you can find the slides So that's probably the important part that you want where to find me next After the session is over. I will be out in the hallway track. I'll be in sessions I will definitely be at the after party on Saturday and I'll be wandering around somewhat aimlessly But I'm kind of easy to find in the future online I'm going to be Doing a webinar with I themes about design sometime in March So keep an eye out for that. It's gonna be pretty sweet and my next camp will be word camp Miami So if you're gonna be in that area feel free to say hi to me there. Otherwise. I am opening up for questions All right raise your hand big so that the microphone people can run towards you hold it close cool Do you have any insight into the handoff process after you've prepared design prototypes for animations and given that to a developer someone That's gonna Work with those files. Is there any best practices or ways to package those things in order to make it an efficient process? Well, just out of curiosity like as a I'm guessing as a designer Like what would you be building the menu doing it in browser? Are you doing it as a mock-up like? We just hired a animator who's gonna be doing them in after effects Designer creates PSD gives PSD to animator to figure out UI animation and then What would be the next steps handing to the developer or if there's any tools that you recommend for? Displaying them online or cloud sharing or things like that. Sure So tooling I kind of feel like the best tool is the one that works So I I don't usually recommend tools necessarily. I think that's a good workflow I think the only thing to add to that is aside from Giving the at the after effects file, which is the actual video the animated file This is going to be turned into probably like an in browser Animation by the developer. I mean documentation on top of that like is this happening on click Is this happening on swipe? Is this happening? You know, when do we expect this to happen? How do we expect this to happen? I've seen I Haven't worked in like a hand-off situation for that. So most of the UX stuff I'm doing in teams is more Like stage layout versus animation interaction a lot of their animations are already determined by their design system Which is nice And they kind of skipped the video step and went right into the build in the browsers that stage but I've seen some stuff in my research and some of these resources on Using video as a communication tool and I think just supplementing that with intention like documentation of intention will make it really useful Yeah, there's another one. Sorry. Go ahead. Do you know of any good examples of parallax websites? And if so, what was maybe some of the highlights that you thought were successful in that creation good examples of parallax websites, um, I kind of personally I kind of hate all of them As a personal taste, right? So they are nice. It's cool But to me all it is is nice and cool like it hasn't added anything aside from being cool and I'm a pragmatist So hard. I don't believe in doing anything just for being cool so like I've seen a lot of parallax websites that are beautiful and cool and pretty and a pain in the butt to load on my phone and a pain in the butt to load on a slow internet connection and I don't know so If you're designing a website to try to win a design award You can do a lot of cool stuff with parallax, right? But if you're designing a website to like try to actually convert something with people that you can't really guarantee How their bandwidth is going to be or what they're doing like I don't see a Purpose, I don't know but I mean they are cool and they're pretty and I've ood and odd At them before but I don't know I can't really give you like a good example Because I just have like an opinion Yeah The this is a mic. There's a microphone It's coming There we go. Thank you only work on 2d. Do you have any suggestions about working with 3d? So 3d animation is its own thing I took one class in 3d animation and what I learned about that is that 3d animation is Hard and there's a reason that it's an entire field of people that went to school and just did that There's plenty of programs that you can do it in You have to have a really good understanding not just of animation principles But also of lighting and staging and and mass and and how shapes work I Certainly don't have any experience doing anything close to 3d on the web although there is a lot of interesting 3d-transform stuff happening in CSS nowadays I wish I was cool enough to be experimenting with that But I do follow some really awesome animators that are doing a lot of interesting stuff in that space And I can talk to you about who they are afterward if you want But I don't have any specific tips with 3d other than 3d is is its own Jeopard beast and kind of like how I say I don't do SEO because that's its own field I also don't do 3d because that's its own field Yeah Yeah, well, that's getting your steps in You'll hit ten thousand in no time So I have a question. I love Animation and what it makes available But I find myself being too headed when I design and I also want to design for accessibility So I really like the where you said like is it still functional if it doesn't load or somehow doesn't work Do you have any examples or resources for? Animation but in a way that's also accessible sure so Accessibility is something that I strive for but probably fall short in a lot But I'm always constantly learning because that's all we can do but I believe following the principles of Trying to be as native as possible so like let HTML do what HTML is supposed to do then let CSS do what CSS is Supposed to do and then let JavaScript or something else do what it's supposed to do We'll probably be the best way to create accessible animations, right? Because we're not trying to override a native browser behavior or a semantic browser behavior with some random thing just because we want it to do something fancy So if we can that's kind of another use of responsible animation It's like if we can let if we can use a native HTML element and behave the way It's supposed to behave and and make that work and then maybe style it to look nice Then maybe we can add in some CSS animation. That's native then go into JavaScript I think that's probably the best way of keeping and I'd be if anybody is like more of an expert on that and wants to tell Me more I would love to know because then I can add that to version two of this presentation But usually I stick with trying to use semantic things the way they were meant to be used and that's the best I can do Okay, hold on microphone. We want to make sure the at-home players can hear us They're important to So my question to you was about are you more into JavaScript animations or just pure CSS animations and The difference between the two sure so nowadays We can do a whole lot with CSS that we maybe couldn't when people started doing JavaScript animation like went I mean the whole reason that a lot of jQuery happened was because we were trying to do these things simply and semantically and interestingly I I Am medium at JavaScript so as a WordPress front-end developer I can get away with that right because I'm doing a lot more PHP than JavaScript Although thanks Gutenberg now. I have to do more JavaScript, but anyway Yeah, but I Do mostly I try to do is as much CSS as possible for my animations as opposed to JavaScript If I do use JavaScript I'm trying to do it vanilla as opposed to loading a framework. I mean again It's like how stripped down can we make it how optimized can we make it? So if it is something that I can do in CSS and it's supported by most of the browsers that I need to support Then sweet and then if I can fall back to whatever the HTML element supposed to do then sweet So I would say most of my animating and I'm mostly working in microanimations, so I'm not doing character animation I'm not doing full-screen, but like there are people that are great at that I'm mostly trying to do to do micro at interaction like toggles and expansions and buttons and like making those be more useful That's primarily CSS for me Any other questions? Cool. Well, like I said, I'll be around for today and tomorrow I'll be pretty easy to find and feel free to come bother me if you have any questions about animation about design about Wapu about Salad, I don't know whatever The happiness bar I Maybe I was planning on going to the talk after mine though, but I will be at some point today So there is like a little ten minute break. Yeah, I can go I can go I can go there now Yeah, so if anybody else has any questions that I want to reach out the happiness bar down at the end of the hallway Outside of that. Thank you very much Thank you. Thank you And like I said, we do have a little break before the next talk so go out stretch your legs dance party in the hallway Check one two three four