Tutorial Flip Page for Web design (Wix)

hi my name is David rodas mackinder and today I’m going to teach you how to create this effect for your website this is a SWF what’s a flash document and to import it to your Wix what’s my Wix is my website builder so you can export it here and if you use WordPress or you use muse you just have to download the plug-in to being able to to do it okay so the first thing that we’re going to do is we want to see the the measurements that this needs
to have so in this case is 960 in 440 960 by 440 okay so we’re gonna with that we’re gonna go to our InDesign file and we’re gonna create a file with this dimensions go file new document where it says int and we’re gonna put a web because this is for a website number of pages let’s say that you own your portfolio to have 10 pages and it’s going to start in page number two this is important seeing here says one page we’re gonna put a face in pages
so we have a double page magazine so the next thing is page size each page needs to be four four eighty because it’s half of the measurement that we we want our magazine to be because we’re gonna have two sheets so we’ve got to divide the screen shot measurement / – just the width and the height is gonna be 440 same as our a screen shot show it to us okay number of columns usually you want to use columns to organize the information on your
website so you can put my columns and you’re gonna you’re gonna check that everything it’s okay and okay okay now we’re gonna proceed to put the information in in our magazine here I have a I’ll already with my information my logo what I do my website and my mail if you guys have any questions then down here our iPad like the squares to kind of get information of for my magazine here you you can put your images your text wherever do you that you
do and you want to put on your portfolio okay so now that we have this we’re gonna grab all the layers and we’re gonna go to view interactive page transition one more time we’re gonna grab all the pages go to view interactive page transition okay here we can display how it’s gonna be the transition for a page and here you can add different effects if you want but for now we’re gonna do the page turn okay note that that would we are we we did that
now we’re gonna have this icon that’s or layers you gotta check that over our layers have the same icon so you don’t have any problems so now we’re gonna proceed to explore it so we’re gonna go file X for word McIntire three here at the bottom the format we wanted to be Flash Player as W F and we want to save it okay now we’re gonna check that we have all pages if you want or you need you can put generate HTML file I don’t either so it’s just so
pages the scale is a hundred percent because we already locate how many pixels we need for our magazine so we need to be a hundred percent so doesn’t change the measurements okay so we see in here are measurements paper color for my for my website I want the paper color to be white so that’s why I apply paper color you can change it and we’re gonna proceed to put okay okay so now our SW have being exported and we’re gonna reproduce it so here
McIntyre III has loved us we’re gonna open it up and there you go this effect is going to look your webpage look really nice and really interactive for for your customers and the next step you can use the LS WF for different things like I already said but I’m gonna teach right now how to add it to my wigs so if you have Wix is really easy you go to wix.com to your page editor you go to in my case I’m gonna go to a branding is where I want to put
my my ass WS so we’re gonna go to add flash swf add flash file upload my case Mac in turn three years of us Don add flash file okay so now I’m gonna locate it where I want it and we’re gonna save published and we’re gonna be able to see it on my website so my website is it’s a McIntyre comm so we’re gonna go to portfolio branding in there we go we have our magazine and our customer can’t start you can start flipping our pages for our portfolio
that’s all for today you can check more of my tutorials on my blog on my website or my website is is the McIntyre comm and it’s a mackinder at gmail.com if you wanna send me a mail you can find also in facebook so check my work thank you