You're about to create your best presentation ever

Get started with Prezi

Presentation Background Layouts

Create your presentation by reusing one of our great community templates.

Layouts

Transcript: the illusion of motion is often creaated by selecting the most decisive moment in an event, through fragmentation, or through various types of multiplication EXAMPLE Disney Animation is constructed from thousands of tiny frames. ............................................ When ran through a film projector, they create the fluid movement that is a hallmark of Disney Animation. Animation is possible because we have the perceptual ability to integrate the sequential images into a continuous flow.. When Presented with multiple images on a single surface, we must feel the movement, complete the action, or anticipate the next event. Based on our day to day experience in an ever changing world, we use our imagination to connect static images to create the illusion of motion THE ILLUSION OF MOTION THE KINESTHETIC RESPONSE THE DESICIVE MOMENT BEFORE AND AFTER pg103 FRAGMENTATION

Layouts

Transcript: Arrange your background boxes where you want them to be and position the titles of your boxes. Make sure your boxes are big enough so when you start coding the text boxes, when you start typing your text, that it is big enough to read. 5. The Layout Code (continued) 4. You can delete the text and type what you want according to your box title in which you will be typing under. Remember, do not delete all the text at once or the text box will disappear and you will have to recode that box. 5. On line five, </font></div> is the code that ends your text box (the code on line 2 is what starts your text box). If you want to add more boxes, and you have to code it with the same code used for the previous text box but with different values. 6. The </div> on line 6 means you have finished your layout. You cannot add any more code under that code or it will not appear. Example: Layouts Screenshot of Completed Layout 1. 3. 2. 4. Here is an example after finished customizing. (Remember, you can have more than one text box, as many as long as there is sufficient space.) Go to ribbet.com (ribbet isn't that useful anymore since it went freemium; creating an account won't work), or any other photo-editing websites, upload the image, and start customizing it. Add boxes (Stickers > Basic > Geometric) as the background for your actual text boxes. Rectangle works best. Direct Link Start Coding <div style="background: url('DIRECT LINK OF YOUR IMAGE HERE'); width: XXXpx; height: XXXpx;"> <div style="width: XXXpx; height: XXXpx; overflow: auto; text-align: XXXX; margin-top: XXXpx; margin-left: XXXpx; float: left;"> <font color="black" size="2" face="arial"> text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text </font></div> </div> The End - Thank You For Your Attention! Choose a background image. Save it to your computer. Image Once you get your direct link, start coding on the w3schools tab. Here is the code (as you make more and more layouts, the code will start to stick in your mind and you won't have to refer to "how-to" sites anymore): Go to www.w3schools.com and on the homepage there will be a box that says "HTML Example." On the bottom of the box, click the button that says "Try it Yourself." The page where you land is where you start coding your layout. Delete the example code; you won't need that. Alignment Remember to give the proper credits too!!! In order to use your customized image as your background, you need to upload it to sites like TinyPic or Imgur to get a direct link otherwise your image won't show up and your code will be invalid. Start Coding Notes: 1. The width and height values on the first line is where you put how big your image is. You have to use the exact values or your code will not work. You can always refer back to Ribbet or the photo-editing site that you use for the width and the height. 2. The width, height is how big and how wide your text box will be. Keep in mind it has to fit into your background box. Text-align is whether you want your text to be to the left (recommended), right, or center. Margin-top is how far from the top your text box will be. Margin-left: how far from the left. 3. On code line 3, you can customize the font color, size, and font-family to anything you want. The Layout Code Choose a color for your text boxes and font styles (titles of your boxes). The titles can be anything such as About Me or News, etc. 6.

layouts

Transcript: layouts This presentation will show how magazine, book, movie, and poster covers are made. Layouts

Tessa's Layouts Presentation

Transcript: HELPFUL HINTS I USED!!! FINISHED!!! Black and White Water colour Hatching Shading Thicker layer of colour -spend more time in doing at least one fully coloured image (not water colour) Line Art BRIGHT COLOURS Smooth, slick surfaces experimenting with using black and white against warm and cool colours LAYOUTS Make sure its Pixels SCALE COOL COLOURS FRONT DOOR KITCHEN what would I do different BALANCE Bright Contrasting Colours Resizing Image TV ROOM Water colour Shading Experimenting with going from lighter to darker shades BY TESSA GOODRIDGE Bright Primary Colours Simple perspective DINNING ROOM Experimentation with Colour Future Modern Style LIGHT AND DARK Reference Using different colours for different layers PEN PRESSURE Reference COMMENTS MODERN ESTHETIC Light shading -More detail in some of the images Research and Style experimenting with Black and White water colour (AND A LITTLE OF ALEX) SITTING ROOM !!!!!THE FUTURE!!!!!! BEDROOM Panel Lights Tone is uneasy and disturbing the brutality against the bright lighting and colours FLOW AND OPACITY Distinct colours Lighter layer of colour Water Colour Effect REFLECTION Symmetry To get greater detail -experiment with different brush strokes Highlights the Line

Layouts for a presentation

Transcript: https://www.google.com/url?sa=i&rct=j&q=&esrc=s&source=images&cd=&ved=0ahUKEwiin67PnujSAhWDWCYKHX8kC0YQjRwIBw&url=https%3A%2F%2Fwww.pinterest.com%2Fmoonsound89%2Fwindow-advertisement%2F&bvm=bv.150120842,bs.1,d.amc&psig=AFQjCNEMYDkKHHYucmgoIJdo0G9EVlKTqA&ust=1490207733302677 https://www.google.com/url?sa=i&rct=j&q=&esrc=s&source=images&cd=&ved=0ahUKEwiRmrWco-jSAhUj6IMKHac_D7EQjRwIBw&url=https%3A%2F%2Ftheperiodicfable.wordpress.com%2Fcomics-index-of-multi-panel-pans-by-decade%2F1970s-multi-panel-pans%2F&bvm=bv.150120842,d.amc&psig=AFQjCNGQcR9e1DemGQh5kUmg3GBRoOHcGg&ust=1490208971004679 https://www.google.com/url?sa=i&rct=j&q=&esrc=s&source=images&cd=&ved=0ahUKEwjLofOBoujSAhVE94MKHdFBDnkQjRwIBw&url=https%3A%2F%2Fwww.posterlounge.co.uk%2Fmondrian-design-pr530296.html&psig=AFQjCNEOX1xyfaQrwkOMSx7jlF6m0ZuuMg&ust=1490208646021712 https://www.google.com/url?sa=i&rct=j&q=&esrc=s&source=images&cd=&ved=0ahUKEwj8pcWgoejSAhWCxYMKHYbOC7wQjRwIBw&url=https%3A%2F%2Fwww.behance.net%2Fgallery%2F15829679%2FAdvertising-Layouts&bvm=bv.150120842,d.amc&psig=AFQjCNEfZP7d-UHHmvxZqfP4C9kQVw0yZg&ust=1490208431884966 This design uses multiple different elements Layouts for a presentation https://www.google.com/url?sa=i&rct=j&q=&esrc=s&source=images&cd=&ved=0ahUKEwjEtP-VpOjSAhXBx4MKHVcdDk0QjRwIBw&url=http%3A%2F%2Fwww.graphic-design-institute.com%2Fblogs%2Ftypes-of-graphic-web-page-layout&bvm=bv.150120842,d.amc&psig=AFQjCNG622LNgmo0VyjdRuvcKNllV-_viw&ust=1490209241146846 This is when the words are bigger than the main picture Omnibus https://www.google.com/url?sa=i&rct=j&q=&esrc=s&source=images&cd=&ved=0ahUKEwiK5sf3oujSAhXB5yYKHaunBz4QjRwIBw&url=https%3A%2F%2Fwww.pinterest.com%2Fpin%2F252483122832646239%2F&bvm=bv.150120842,bs.1,d.amc&psig=AFQjCNHEMaieUrdjGFNpPxoD8y2k1_sBUw&ust=1490208895566663 Picture window This design uses panels of equal size These are used when you show off the image more than the text Mondrian This design is where the text wraps around the image silhouette Copy heavy is when the words are the most important part Copy Heavy https://www.google.com/url?sa=i&rct=j&q=&esrc=s&source=images&cd=&ved=0ahUKEwjZwfbZn-jSAhUBVCYKHdEPDFIQjRwIBw&url=http%3A%2F%2Fcargocollective.com%2Fdshryock%2FFutura-type-specimen-poster&bvm=bv.150120842,bs.1,d.amc&psig=AFQjCNHVd0SeqXq3cELSPXMJHaqaEuhf7A&ust=1490207996520231 This design has a series of different sized rectangles Multipanel layout Type Specimen

LAYOUTS

Transcript: USERS HISTORY HEIGHT 4 NATURAL & HUMAN FACTORS 1 1 2 4 MORNING NOON 2 3 PRIVACY 2 1 EVENING 3 3 1 3 4 4 2 1 2 the way in which the parts of sth. are arranged or laid out 4 3 LAYOUT 4 1 2 3

Layouts

Transcript: Soorten Verschillende soorten Linear layout Relative layout Table layout Absolute layout Frame layout List layout View layout Linear layout Linear layout Maakt rijtjes Horizontal Vertical Relative layout Relative layout List view List View Lijst Scrollable

Layouts

Transcript: Layouts I have placed a zapper code onto my front cover because I think that it will make my magazine more contemporary and appeal to the latest type of reader that is around at the moment. It will include extra content for them to be able to see on their phones. I think thought this was important to include this because my target audience are used to seeing these features on magazines that they are currently interested in. I have also placed my bar code down the side of Keane where there was a lot of blank space because I wanted to eliminate as much blank space from my front cover as possible because I saw what it looks like to have a lot of blank space on the front cover of B&S and I really didn’t like it. It looked dull and boring so I knew I wanted to ensure that there wasn’t much blank space on my cover. I also made it large so it is obvious to the potential customer how much the magazine costs. I wanted to do this because it is priced at roughly the same price as magazines that are currently available to the public. I have decided to put my text into boxes that are rotated to angle because I think it is intriguing to the consumer of the magazine. I also got the idea from MOJO’s cover but I have made this a more dominant theme on my cover than they have. I decided to do this because it eliminates a lot of blank space that would feature on the front cover otherwise. I have also changed what text goes with what text box. I decided to swap ‘Battle of the Contemporary Artists Inside!’ and ’10 Pages on Keane and His Lifestyle’ because I wanted to draw more attention to the content that is going to feature on my double page spread. I think it will get more attention in this text box rather than the one that it was previously in because it is singled out which will make it seem more significant to the reader rather than all of the headlines that are grouped together. Finally I have put the title of my magazine across the masthead. It is bold and it is also placed behind Keane. I have done this because it appears to the viewer of the image that the title was actually apart of the image that was taken and this is a good feature because it just simply makes the cover look professional. I added a slight shadow to my title to make it stand out and appear bold to the readers so that they remember the name of it and so that it stays fresh in their mind because of the 3D effect that it has. Finally I have gone with the colour gold to simply show to my audience that it is the best magazine for this genre of music. I have decided to design the layout of my front cover very similar to the front cover of MOJO. I have done this because I think that it is a very successful and engaging page for the audience. I have included images of stars on my cover like MOJO and Q because I think it is a very good way to represent how successful the genre of music it is but it also suggests how important the artist on the front cover is as well. The reason I have made my starts gold and not white or grey like Q is simply because I think the gold represents a more successful heritage of the genre of music. I made sure that I included a issue number and a release date of when this magazine was published. I did this because all big magazine production companies do this and it is also allows collectors or people who interested in this genre of music when it was released. It also eliminated some blank space of my cover but it is pointless context it has an reason for being on my front cover and that is important. I have sectioned my front cover into two and I have done this because I think it is a good way for me to show the audience the main artist that is going to feature in the magazine but also it allows me to add context on the cover as well which includes information about what will also feature in this issue of my magazine. I have used the rule of thirds when positing the artist onto my magazine this is important as it will draw attention to the artist which is the most important thing that features on my front cover. My layout is more like Q magazine and this is because it allows me to concentrate on more things which is important because the more interesting headlines that I can include on my cover. I haven't done it exactly like Q magazine though because one of the sections is over hanging on the image on the other section. I haven't copied this idea because I think that it looks amateurish.

Explore our templates for more presentation inspiration

World Map - Atlas

Description: For program proposals, grant requests, or any other nonprofit or education presentation, this beautiful world map-inspired creative Prezi template will engage and captivate your audience. All Prezi education templates and Prezi nonprofit templates are easy to customize.

Easy Book Presentation Template for Individual Design | Prezi

Description: When you need to clearly spell out your message, this creative Prezi template is the way to go. As with all Prezi education templates and Prezi nonprofit templates, this one is easy to customize to let you zoom in on your ideas or pull back to show the big picture.

Resume

Description: How do you stand out from the stacks of resumes on your prospective employer’s desk? With a Prezi resume template, of course! Create your own “Prezume” and and impress them with your cutting-edge dynamism and cool. All Prezi presentation templates are easy to customize.

Report - EDU

Description: If you work in education, make your next report visually interesting and easy to navigate. The line-drawn illustrations in this edu report presentation template encourage curiosity and discovery.

Now you can make any subject more engaging and memorable

Get started with Prezi