First Pass on Animation Scenes
George is sharing four new Figma frames for the homepage hero animation and explaining that the motion should be web-based, with elements in the frame moving and transitioning rather than playing a video. He asks for feedback on whether these are the right scenes, whether the content in them is accurate, and whether the team wants to add one more scene while keeping each sequence around four seconds. George also explains that the scenes fall into two groups—student-card related items and aggregate school-wide views—and suggests starting with the student-card scenes before moving into the broader views.
[00:00] Hey, folks. Good morning. Happy Wednesday. So just following up on the link that I dropped in Slack to our Giant Figma workspace,
[00:10] I have four new frames here that I want you guys to take a look at. This is for the homepage hero animation. So the way that we had discussed this was basically taking the system we have for the images,
[00:20] which is that kind of layered animation kind of base system, and sort of connecting those together such that one could fade in to the next one and so on and so forth,
[00:30] kind of making a kind of web-based animation out of all of those pieces. When you think about animation, it's not an animation in the sense of like it's loading a video and playing it.
[00:40] It's more about it's moving around objects that are already in the frame. So there's some limitations there as far as like making something click and having it do something.
[00:50] We have to kind of be clever. But either way, I think what we can achieve for these is to have the different pieces kind of load in
[01:00] and then have the avatar with the person's role kind of like move around and do something on it. So in this case, they might scroll over and maybe add one of the absentee things like they were absent that day.
[01:10] In this case, they might go over and click, you know, new encounter. For the nurse, I was thinking that either she picks the sort of red X or is just sort of scrolling over top of it.
[01:20] And then for the big pie chart here that the person would sort of scroll over and these would pop up and they go to the next one and the other one would pop up kind of thing.
[01:30] So a couple of pieces of feedback here. One, you know, are these the right scenes to show? Two, what's actually in the scenes, we want to make sure that doesn't say like thing one as I have here,
[01:40] that it actually has the right information. You'll also notice that there are kind of sort of two different types. So when I was looking through the notes about, you know, what we discussed about the different things that we wanted to show,
[01:50] I realized that there's kind of two sets. There's sort of things that are related directly to a student or a student card like the absenteeism
[02:00] or the various incidents that are happening on that student's record. But then there's other ones that are a little bit more like looking at the things in aggregates.
[02:10] So for those ones, you'll see that as far as the animation is concerned, I figured the ones that are about the student card we can do first because they're a little bit more personal
[02:20] and we can kind of have things pop up and then that way the student card doesn't have to go away and kind of reappear every time it can kind of be there.
[02:30] And then we sort of switch over to the more aggregate view or the sort of whole school view where now we can kind of get into seeing some of the things we'll be looking at students in aggregate.
[02:40] So let me know if that's not the right approach, of course. But otherwise, let me know if there's also additional things that we want to put in. So if you want to see not just attendance and behavior, but something else in here related to student card,
[02:50] we can certainly sneak that in. I would say that for each of these, we have about four seconds. And that's, you know, not an insignificant amount of time to have it kind of load in, do something,
[03:00] and then go away and have the next one load in. They will cross over.
[03:10] I'm not going to have it be like the thing has to fully exit before the next one enters to save a little bit of time and keep it smooth. But generally speaking, it's not a ton of time. So I would say we have room for maybe one more scene.
[03:20] And after that, it'll just be too much to be able to take in or someone will scroll past it anyway. So I'm curious to hear your thoughts. Talk soon.
