Skip to main content

Website and Show reel


I planned out how my website is going to look, by wire framing it all on some paper. Then I made a sitemap on Lucid Chart. Finally, I wrote all the text that was going on the pages. 

To start out the website I found a template that had the design style that I wanted and downloaded it. Then I kept the bits I wanted and took out the rest (this being the boxes). I then inserted all my text onto the first page, and created html pages for each of my briefs, and linked them to the home page. I then put all the text into these html pages. 

My idea for the show reel was for it to begin with my name being written out, maybe even my signature. Then it goes to the Mosi brief and the lines in the posters lead to the next one. 

Since I wanted my name to be written out first, I decided to do this first. I wasn’t sure how to create this effect, so I googled some tutorials. I wanted the font to be my own hand writing, to make it more personal, so I used my Wacom tablet and wrote my name multiple times and chose my favourite one. I then imported this into After effects and followed the instructions, which were:
-     
         -New comp with text or picture
-      -New solid layer (comp size)
-      -Bring down opacity (T key)
-      -Pen tool, mask around signature (Select the solid layer)
-      -Second mask for any crosses or dots
-      -Shut off text layer
-      -Bring opacity up
-      -Effect- generate- stroke
-     - Button at bottom left corner
-      -Stroke properties
-      -Select all masks
-      -Bring up brush size
-      -Set key frame, at the beginning set to 0%, go to end of comp and set it to 100%
-     - Then play!

I did this however I chose to have the dot in a different mask, and it be drawn after the ‘E’ was done, as this emulates the way that I write. 



Comments

Popular posts from this blog

Week 2

Notes Footers are like links to something, such as URLs or emails. <Li> </Li> is an unordered list.  A basic menu would have some simple CSS rules, i.e stylings. { = section so have things separated like 'divs', shows when an area starts and finishes.  Dropdown menu-  Have links added- items and subitems, added next to items.  Use CSS to hide the items until you scroll over them.  All boxes are relative and try to stay on line.  You can animate things using CSS.  THERE IS ONLY ONE HEAD AND BODY, if you have extras then it confuses the program.  Codes To start we created a new webpage, with a CSS and NAV folder inside of it. Then we have to put the code for the index.html page to work on: <! DOCTYPE html > <!-- Standard html5 blank template --> < html > < head > < title ></ title > </ head > < body > <!-- all content goes here. --> ...

Screenshots of website

Week 1- Part 2

Codes: -  This will create a basic webpage with some text on it: You need to have a folder for the webpage, with one folder called CSS, and one the name Index (or something similar) <!DOCTYPE html>                                               <html>         <head>                 <title>Web Demo/title>        </head>        <body>                Hello World!        </body> </html> The body tag means the text on the page, so any text they would want on the webpage they should put it where 'Hello World!' is. -  This will change the styles of the webpage that you created in the last tutorial thing. Within the CSS folder make a file called...