Design for Web/Motion Graphics News
news
Graphics in Motion
Graphics in Motion
news events history subscribe
news
Graphics in Motion
Graphics in Motion
news
news
events
history
subscribe
events homepage History
events
history
subscribe
events
history
subscribe
subscribe
Site map
The site map shows the set up of the website and how each page will link to the homepage. My root folder will have all the pages for the website, and will include a separate images folder with rollover images.
Scamps
The scamps show the basic set up and aesthetics of the websites. They exhibit the format and layout that the information on the website will take and how the information will be organised. I made a few examples of the layouts that I felt lent themselves to the concept the most.
Design for Web/Motion Graphics News Container - 1600px x 800px Pages: - Homepage - Newspage - Events page - History page - Subscribe page
Colour scheme:
Navigation bar - centered under the logo with roll over images for buttons. Content - Summer brief research and extra research into motion graphics Fonts used: - Times New Roman for logo - Times New Roman for body (12pt) - Helvetica for buttons
Text - #000000
Background - #FFFFFF
Website Specifications
I looked into the specifics of my website by identifying the fonts I will use, the colour scheme, the logo and the layout specifics.
Design for Web/Motion Graphics News
news
homepage title
200px
title
200px
video feature 474px
250px
article
250px
250px
live feed
live feed
article
breadcrumbs
article
500px
500px
700px
about motion graphics
500px
500px
article
200px
250px 474px
navigation
50px
700px
500px article
1024px
navigation
50px live feed
300px
title
200px
1024px
1024px navigation
50px
about
250px
article 700px
300px
250px
300px
history
subscribe
title
200px
title
200px
1024px
1024px
navigation
50px
navigation
50px live feed
510px
live feed
history timeline
510px
subscription form
500px
700px
450px
500px
300px
700px
Site map
The wireframe shows more exact measurements of each element of the template from the design of the scamps on each page so that they all fit together. I have kept the measurements of the logo and navigation bar the same and altered the measurements based on the content of each page.
300px
300px
Design for Web/Motion Graphics News Index
News based page with a ‘feature of the day’ - voted for by viewers of the page. The page will showed most viewed and most recently released examples of cross-media motion graphics. It will have navigational links to each page and the logo/heading of the page.
News
More in depth examples of new releases and features, perhaps with an advanced search bar that allows the viewer to see the features that fall into the category they are interested in. Will also have a Twitter feed and Facebook link to the websites fan pages. The examples of new releases will link to external pages directly for the designer who created the motion graphic.
Events
Events page will show upcoming motion graphic exhibitions or events, perhaps including cinematic releases that use a lot of 3D or motion graphics. May also have an advanced search bar so that the viewer can narrow down by areas they are close to or by the specific category of event they would like to go to.
History
A brief history of motion graphics and animation techniques and development within the field in terms of technology and software. Will have the option to jump to different titles parts of the history will fall under. Will include the emergence of motion graphics throughout history and will show early examples of motion graphics, through the use of vimeo examples and images.
Subscribe
A page giving the option for viewers to subscribe to the website and recieve updates of motion graphic releases via email. It would be a free subscription and give the subscribers the opportunity to get advanced tickets to events and perhaps competitions.
All Pages
All pages will have the navigation bar to access other pages directly and the logo on the top of each page, with a direct link to the homepage. I am considering having the Twitter feed and Facebook link on the right bar of every page to allow people to access external links quickly.
Design for Web/Motion Graphics News
Research
While there are a lot of motion graphic based websites available to people, they are not designed in such a way that provides the viewer with the opportunity to filter the information to suit their own interests. On top of this, most of the examples I found were blogs giving amatuer motion graphic designers the opportunity to get their work seen by other people. I would like to include something similar but this would be in the form of ‘feature of the day’ as voted by viewers. In terms of content and layout my website would be more news-based. Similarly not many of these pages give the visitors the opportunity to subscribe, which would be an integral part of my website.
Design for Web/Motion Graphics News
Research
While there are a lot of motion graphic based websites available to people, they are not designed in such a way that provides the viewer with the opportunity to filter the information to suit their own interests. On top of this, most of the examples I found were blogs giving amatuer motion graphic designers the opportunity to get their work seen by other people. I would like to include something similar but this would be in the form of ‘feature of the day’ as voted by viewers. In terms of content and layout my website would be more news-based. Similarly not many of these pages give the visitors the opportunity to subscribe, which would be an integral part of my website.