can you re well my name is a quick steiner and part of the huge design team that we have and i'm gonna so the disappoint my designer friends and colleagues and i'm just gonna be talking about the shuttle that i use the tools that i use not gonna be much of a you know on design talk more it's going to be a blender for so what is blended a it is a three any package that is used to produce a full blown movies here's a few titles that the blender foundation the the mother all the project have want the than they possible they just one big please feel which is a site finally we if you've ever seen any one of those movies definitely checkout belief in tell which is actual movie okay out of all those that are produced and it stands on its own but most of these are really great have that for a developing wonder so they provided really you know use cases relevant use cases for the to develop it's also at getting production environment so it can be used to develop games i'm actually considered using the game engine to produce interactive prototypes for know are we didn't even try to for the pins footsteps and then in blender which i can just demo my failure see who's i lost my cursor somehow that is not good how do i get it back okay back with the cursor thank you so it's well it actually has slides from previous because i don't know if you get into details but the text tool that is in blender kind of behaves completely different in the game engine so i thought of gonna present like that with image plane but it turns out to be very clumsy but you can do pretty much anything with wonder but back to topic so it is be game engine it is also i wanna creation tool remotely i view somebody iphones in the you know that were created also thanks to winter and we also use it for documentation some of you have seen my R L G M talk where are discussed the getting started project that me and that are created for the last release of know so it's sort of a really simplistic animation describing and showing kind of a hands on helping people make the first footsteps in brno and there are it's actually translate it so the the tool lender actually have very good integration with a scripting language so we just call the renderer after translating all the strings so even the animation itself is translated a what i'm gonna be talking about here is using blender as a prototyping tool for prototyping the sort of transitive state so prototyping animation why is why did i choose blender apart from the fact that it's a tool that's available mainly because of iteration to get something i'm actually we getting ahead of myself i have done this talk will probably repeat a lot of the things that i said on if you follow the you know design channel one you to have had a series of of tutorials or videos of behind the scenes a looks add how to do motion design would blender so the that before god i'm probably gonna handout or pdf or so the shortcut url is actually the play list of all the "'cause" the channel is full of other walk outside and other interesting things but that is just to play list for the motion design i would have shortly talk about why we need to mark up and design these conditions you may have noticed that we kind of shifted in our design kind of shifted away from those everything at your fingertips kind of interfaces where everything it is thrown at you at the same time to words more streamlined interfaces some people you know kind of mistakenly associate that with touch interface is of the form for factor it's not related to touch adjusted something that happened when you devices got popular so we're doing to interface is that try to minimise the number of controls and chrome you know being shown at the same time but only show you control that are necessary in the context of what you're viewing and this sort of requires to change of scenes or change the interface it required the interface to be more dynamic and i have a few examples actually as i was sitting and being very drawing to the last lecture also observed a john hacking on scrolling and so seeing him struggle with scrolling at a little window by only a small bit one line and this thing happening you know been are a without this move transition between that and well one line is probably not as much of a change if you're repainting you're seeing like with you know to if you remember virtual desktop for workspaces we're not perceived by majority of people very well because the transition just button there it would be in a very you will have one workspace only windows and suddenly either by hitting a shortcut to miss clicking on the toolbar your mentors disappear and there was usually no you know indication or feedback what actually happened i have another example of this directly in blender it's just you see this so let's take this you but you looks the same size scale it is perhaps interesting do you mind if i sit and disappear this the be or be high to give your and i'm just gonna be this all encompassing be able it's okay i'm just trying to make this shape look somewhat distinct from one side so wonder has like multiple views and when you switch diffuse you can see that it actually transitions between them which gives you a much better idea of what you you're looking at i mean there's a there's a label on the top left to do to like hank you what you're looking at but it's much easier to figure out you know the way you look especially when you add a camera you know in into into the play so the transition really helps you navigate in the three D space and inventor this is actually an option because they're from crazy and a some people think like feel this that's a factual fraction of a fine but it helps a lot by figuring out where you are in space so that's why the transitions are actually very helpful in communicating what's actually happening in front i think this is the default now it's a you know it's probably in the options somewhere but you can try to help me find it it is somewhere i don't know so for are you usually never get anything right the first time and people sort of expect us when they look at the we key or when i post something on the you to channel that is the final thing and no not at all we need to have tools that allow us to quickly integrate and get things right especially in that at the time you don't wanna wait for some like you're gonna be switching workspaces all the time but you know the timing has to be have to be right so to get that flexibility of being able to change the timing you have to have a preview of what you're doing and blender has a fairly reasonable view in the three D view or that are usually because this is primarily a three D package you for you know more delaying the primary view with usually the wire frame but it also have and then we looked some something that's interesting works scrolling one was good so this is an old very old a project of mine but you can see here in the preview i'm i'm seeing a image textures so this is a textured view as the O G L S L U and it gets pretty accurate i can also hide everything that's outside the camera can select first hear him or buttons in a but to is the i'm looking at it probably okay all for me okay so if i play back the intonation you're gonna get pretty much real time playback helping animation without the need to wait for under or anything like that so this is really good for getting the timing right but unfortunately it has many drawbacks the kind of animation that we need usually involves switching states of at the few you can see all the objects i just tell you know matched planes and they have a texture touch to it want to like mimic at change of a seeing eye usually blended between then what have the material consisting of two image textures that are applied but to the colour of the material and the alpha channel five the transparency or opacity of that object and one blending between then does not get real time rendered in the jealous of you so you're not getting you're not getting you're not seeing just do another example this straight it's mm fairly long so you're gonna you trip down memory lane a little you can see they all thought is not compass of it correctly and also when you go to the overview it should be shaded with black the textures of the windows actually change in season really for design of virtual workspaces going on there so the G are selling you is not perfect it has in many cases walls the pixel is not getting seriously hot what's the solution i thought it i don't have any sounds i so the blender guys came up with just for me they came up with a new rendering engine which is impressive in many other ways but for me the biggest i think that it brought was the interactive preview inside the view port itself so you're not actually so to go back to my former work flow if i actually wanted to see what's the animation will look like required me to render these into a either and i nation power later always just doing image stills for reason that time can't explain if you're interested so it was waiting and i had my old computer it was really slow now i have like multi-core beast of a machine so it's better but still it's a drag you can make a mistake and you don't see it and i do every time i can make a mistake i make it into corrected i make another one so it's just and it's especially easy in blender because there's like lots of things where you are reusing the same like material or texture that you're using elsewhere and then you change it's without thinking that it's actually being used by multiple objects or you break it elsewhere and you don't see it until you hundred and you render it so it's just a very tedious work for so we did with the new and i'm now going to you know it was the solution for a to avoid like fracture bugs with cycles it's disabled by default if you open it so we don't actually it it's a rates and provides are real time of sort of preview directly in the three D view port and this is an accurate render so except for motion will are which i'm only using because i'm used to twenty five frames per second well and just to like provide that fluidity for the i cheat will using motion better rather than doing everything sixty frame saying that a takes a lot longer and it's not really needed for the for the mark ups but apart promotion bore it really provides an accurate render sure that had brought something more interesting than this but what we're where you're saying for our mock ups is never i i'll it scene so the materials are all these image planes are being transmitted so they're trying to me so there's no actual lighting it's very simple i bought if i move around in the in the time line everything that i see is that an accurate render that i'm gonna get where everybody's into image styles of course i have i don't have a very all for machine it is our full but not as powerful to be able to keep up and giving me a real time preview so this is this is this is playback but it's not really keeping up with the real time playback but i can switch back to something that material you or just wire frame to be able to rehearse the timings better but still like have another window of cycles or just switched which the which the view that would be we give you a real time preview and this is actually markup for the work that colour doing where here so we're gonna get this eventually and so i'm going to this talk is now over i am going to are going to actually demo and show you some of the things that i do to produce this and i'm gonna do that by sitting and disappearing again if at any time you have a question please you know raise your hand and ask away so i'm gonna start with explaining the different material setup that you have for you have a question so like i said the things are completely different in cycles in terms of material setup but you know the under community is got infinite resources so they're actually maintaining the two engines can currently but i think the new well this so much better and make so much more sense in the older will you had like a special switch which with a shade less that a lot you to do something like this where you did not worry about know complex lighting your mopping up a user interface everything is just flat shaded all the textures are just that you know what materials aren't very sophisticated just the texture that trying in colour and can be transparent and even that it didn't do all to well like landing the transparency a long the colour the state with kind of finicky at times because you would get that all what channel of the you know a blend of to well what channel it's just it's a there were cases where this is the right and of set up with actually quite tedious this set of materials enough and now so i called makes more sense in my opinion but you know i was used to something else i love that i know so we was a little bit tricky not there is no start you there is a very helpful tool to help you with using blender for you sort of to the and emission and that is important images this one so it's a script that you to do just that it's not enable but default so what you do is it is like and then dons a tab and you search for import images as planes and it right here you just and he will that and you have it so now we can import images and explains and this is actually two scripts at one because right now i mean the all will the blender render engine you can use that it's gonna set up the materials appropriately but if i changed two cycles engine it's gonna do complete something completely different so it is the exact same work flow i need to find a texture where are will people will good so it just did all the work for me and if i take a look at the material doesn't so i'm gonna split my view show you the materials so in cycles the materials are not that the there is a can of the this is the key so i'm actually done the one thing and i didn't look at the options that the that the import script has and then you old wallpaper and so we here and is if you off and how you want to import your image for our rgb at the end he is so you know colour information plus transparency you want to select the emission and transparent so the material will image colour and it's going to use the alpha channel from the image to use as a transparency mask for or fate or sure right here also there's multiple ways of how you can scale the image into the see i'm just gonna use the a relative size so if i would well so if i would the points the camera at it are so if i switch to the rendered view you can see that this one is actually training colour one to the other one but if i didn't have this one well that some ambient lighting in the scene so have to get rid of that anyway so this is the right way to set it up so the way it works the materials are actually ripple shader so D colour information like a admission shader which would normally a lot of you set a colour to and it use for lance essentially or that sort of thing parts instead we are using the image texture what the image texture i don't really know what drink feel is so let's just say that the colour information from the image is being passed to the emission shader that would in this case give us exactly what we what we need unfortunately or in the cases where there is from transparency information we would need the other bit which is a transparent shader which usually just is that if i set the colour that i don't know why my name what do you want to do with that one yes i do want there's probably a for there we go one so it's providing a parent transparency but if we take the alpha channel all the image as a that's a factor of how we're mixing these two colours it's effectively doing what we want so there's the in they did image going in here that would normally be like mixed based on the factor that's here so this would be fifty percent transparent if i would keep the fancy channel white but we're gonna use the alpha channel as a map sue i don't wait calls here is a right so in this case the output channel is exactly the same is just the white well while there's no can spencer here so if i would take some other image that i know who it's like nice i'll a what is this time away so you can see that if i didn't have the math it's just mixing the colour information from the image we the colour that's provided by the transparent shader if i use the mask from the alpha channel it's doing what we need so it makes sense it would like be pdas to set up which i actually have to do for a lot of scenes that i had the when i was doing getting started the cycles engine has the great motion blur that's fast and accurate and there's no trouble with it as with the a composite or composite that a motion buffer that the hold rendering engine provide or also have like attractive motion blur by that's like if you want sixteen sample that means that each frame is rendered sixteen times it was just ridiculously slow so cycles great motion blur it's want to redo a lot of these things that the import images those planes rid of for you but it was worth it i mean it's this well there's really much better so another tool that i'm going to show you that's extremely useful for doing this sort of animation is the top sheet which i don't want all hope she'd what right name let's try this and that will be after again so as i was saying iteration is ski so let's say i would want to change the timing of you know this bubble appearing so blender has got and what's slow as got this which is the door she so you can view the time there's also a graph editor for each object here any property can be animated in linear and you have this it's you i would change the resolution but then it would break that we tried earlier so okay the i could do this and it is like the so but the line still cut alright never mind so this is like the property changing in time which is they act axes the don't cheat on the other hand only worries about the states of animation so each state that you use frame you set that you want this to remain at this value at this point of time is shown as adult it's kind of like have this preview that it to aggregates like individual properties for object so we can like have a fine detail or you can just see the individual p-frame without really knowing what exact property it is and just like in the the three D view all the transformations that you can do on object you can do one all the thumb key frames for example if i what we're gonna do mm i was gonna make this year were we comedy you so if i would think that this slot a it's not i wanted to too much tedious work and just one line okay so this one let's do this so it changes across five frames one two three eight we wanna do that slower we don't but let's assume that we wanna do that slower so i have the the final state year and i can these are really useful a problem here this one will show objects that are not even in the in the scene maybe move to other layers for our hidden so this enables fifty really see all the objects and this one on the other hand is only showing the key frames that are relating to these what is all czech which you know this is a very this is the most useful to because you're gonna end up any meeting even with a simple animation that actually you're gonna be any meeting so many proper these are artifacts here and so so making this this so to change that writing i just move the key frame so what if we wanna make it take twice as long i just grab it and move it by eight frames in the time line now if i animated it's taking twice as long are just actually show it in the context of the other animation that's lower and actually like that there's two things that are moving it's the the new plane the old one so this would be eight as well and these are individual objects actually so i would have to do that for all of them so the best way to do is do a box select make it more i have them selected do box selecting here well no i don't know why it's doing all these five well video eight it's also terribly slow so now i've moved all that so they have to speak so this is dope sheet it's also useful because like in here you in the curve editor you define how the states transition so you know you're changing the curve how fast or like you know they using and that kind of thing well this is just tiny when that state is happening it's also extremely useful to be states so i know what certain time i wanna return to that particular state i just copy the key frame and i know for example this i "'cause" that's fine it's really lot there we go so remarks i know it's position here and if i you would this put it in here it's going to be exactly there i mean there's other properties like scale that change but i know that whatever i have p-frame here just location is going to be exactly the same as it was when i copied it and this one so it's extremely useful at the whole are we with time you have any questions but you signing and that's one point three use people i everywhere and you like microsoft office all the options turned on i mean like there's we have people that are have for case usage of our software it's nothing compared to massive number of long tail like me like me i'm using blender for something that's not really meant like you wonder was not designed to do the animation at all it's just no i'm not gonna touch and well what we did we did actually like get involved in some cases john a was working on the like X T G of older stuff old and of the i call on you know some of these things like integrating at that level but they didn't have like the major redesign one of the things that i really like and that are completely you know specific to that audience is that every everything everywhere every key every property is an innate able like anywhere i am i can just press like visibility i insert a key frame everything is an innate able anywhere and also you can see really cryptic properties to tool tips showing up and that they like if i showed this to somebody you know would like it had no place there but people will more likely be you know doing very specific things and this is even for non wanna hackers it's useful because like for the getting started stuff i written i thought i it's very scary to admit that i publicly but you know because of the it because everything that i seen you why i can i know how to access it's and that conscripted somehow you know in a very sturdy way so i mean it's a it's just a different audience interface and i you know i'm not in love with many of the decisions especially like it shows that like all the options that i said you want i with my limited you wonder can reliably project every time i do anything so it's not the most stable piece of software but it really does everything it does everything okay what was like well so honestly they're related now so i didn't like this to is very much for people who do it like eight hours a day five days we right so like it's very hard to the few times i've been trying to well the right now the hard very hard times i was curious if there if you know of any other like innovation tools that are good like say i use i need to animate something like there is one that's not really like synthetic but really i spend time in blender for other projects and are doing different things so just familiar with it that way but there's many things like that the pattern that you that are common other like the dope she'd like you can't and they without every piece of software that you see that the crop editor also like any piece like you know apple motion everything or you know the adobe aftereffects everything is using the same kind of pattern so i would say a lot of people will be familiar with most like there's the materials set up that's kind of something that's specific to wonder but i've just shown you how to the web and you know now so goods mission is to do probably take an on the learn it's okay i i'd be really interested to know you have more about the i mean this is probably something i'd like to have as a conversation not really interested in a specific all the specific which is you'll up and use the mouse to get your job done and maybe even some of the features to do with ring transitions the you which you maybe even have to maybe buried and hard to get to than the because i'm working on a so actually my stuff to break which is basically trying to achieve this kind of altering capability for user interface is specifically for user interfaces i'm with the rent technology but i want this kind of visual design really i mean it's not you right well the that i don't do in blender i mentioned it and the beginning is interactivity i mean that there is the game engine but i just went for what technology so i jake very whenever there's interactivity involved wanna you know change the you very this is not of us to order type it in i'm sure the people that are very familiar with the game engine that will try to prove me wrong but i just go for at these cases but for just like this stuff transitions animation i you know there's very little that you need you just need the basic transforms so scaling rotation i have movement one thing that is kind of club see to do which i was gonna demo i don't make sense is sort of clipping masks or you know like when you want something to eat here like fade in the you know the into an area or that sort of thing which i'm currently just doing like a mask so like been erased so i'm doing it with a blue liens will be an operator the lender has got like also on may have not made it we are the interactivity means that you're not doing many destructive actions and hundred has got this modifier stack so you're changing things but you're keeping the primitives so you can always go back and change it so the bowl boolean operators also not really destroying the shapes the match it's just being dynamically apply to any make it so that's how i do like in here look this is this object is a cage so everything that moves so you have stuff this is just movement but everything that's outside of this cage is hidden invisible because this is only got so that's one of the areas that like if i wanted to do the fate that i would want to do it will be tricky i don't know how i would do it in the three D you on it so i would know how to do it in the other but then it just work i definitely bigger you should sit down with you and i don't is it works are interested in using tools like this but the sort of using the same technology you know you know that tool with bill you think letter it will it could not be a prototyping tool but some stuff actually but we have three in this in this something i'm really interested in is the idea of having the visual to actually you can directly connected to devices that you're developing your user interface post so for instance developing for buying or top and also you should actually on the one hand you got the technology that's being shared between the design so that's gonna run on the fire you know so you make changes as you're designing them and on your that's machine and you should be have to just pick up that phone and that's actually check out how the animation feels a response if we we're looking the problem specifically from the point of your you i the but i'm sure that we could figure out a much better way fly so i am some other thank you that i can show so for example in the i hope i've only example i probably didn't so this is also an older project i need it before and i wanted to touch so this is this is just demoing the behaviour scrolling on such devices and you can see that the big object that corresponds to the page being a new blind that finger circle and this is not any needed separately because it's actually quite hard to do a similar sort of thing that gets you out of the imp impression of animation is like when character moves on a surface on the ground and it slides so the ground is not actually like the fourth is not moving in correspondence that surf same thing would be here like if i would want to change anything in the time it would look bad so this is actually using constrains so that's another tool that's built into blender so are you interested in hearing about it or is it just out of time i thought i have so much time that i know is our is gonna i alright well if you're interested and i can tell you later so thank you