AF103 Design for Web - New Assignment!

After enjoying two weeks off from university I'm in some ways glad to be back and ready to get on with the new assignment. We originally were given the brief just before half term and I hadn't really looked at it too much in detail but took a a quick glimpse and skim through to get an overall idea of what was required for this assignment. Now that I'm back I can take more of a closer look at this project and what the objective of this assignment is as well as what we have to hand in at the deadline.

This assignment is called AF103 - Design for Web and it relates to our previous project which was Wonders of Nature - interaction design. For this assignment we have to create a responsive website which relates to our previous project of the wonders of nature where most of the content we used and the research we gathered and placed in our iBooks need to be displayed in our websites we create for this new project.  For this project because it links with the previous one with the topic of wonders of nature it means I have to stick with the content I used in my iBook and the topic I was given which was Earthquakes. Also the visual style I went for must be portrayed in the website I create as well, so they link together.

So to wrap up quickly the basics of this brief that I just stated

• AF103: Design for Web 
• Wonders of Nature Topic: Earthquakes
• Creating Website: Responsive 
• Content from iBook to Web 
• Same visual style as iBook

In the brief it states that we can used a variety of different HTML software in order to be able to hand code the website through HTML and CSS. These include the options of the following:

• TextWrangler 
• NotePad ++
• BBEdit 

This software will allow us to hand code, using HTML5, CSS3 and Media Queries for the responsive design element of the website we create. We also have the option to use jQuery  in order to create galleries or slideshows. We also are recommended from the brief for this assignment to use 'Skeleton' framework as a basis for building our site.

For our website it much contain:

• A strong and user friendly navigation system using a 'Responsive Navigation Design Pattern'    
• Content to include a selection of: text, images/illustrations, sounds and moving image.     
• Animated navigational elements to accompany the content and enhance the user experience.

Throughout this project we also need to:

• Plan our time and the different phases of the project with a detailed production schedule
• Find and analyse examples of ‘Responsive’ web design including examples of different Navigation Design Patterns currently used in industry 
• Visual research, which contributes to devising the look and feel that is consistent to all of your finished output.
• Design the graphical style, interactivity and elements of visual language that will be consistent to all of your finished output
• Undertake design and technology research into developing content for responsive websites.
• We will produce evidence that the html and css for our website pass validation tests from W3C
• We will produce evidence that our website passes accessibility checks.

For Our Pitch we must:

• Pitch your content and design solutions to this project to the group for discussion in the form of a prepared presentation. 
• This must contain mock-ups, navigation plans and storyboards that fully explain your chosen visual style for your website.
• We must also include, Wireframes and mock ups for your pages at each proposed break point, logo and header designs, interface designs and a style tile of the overall visual approach.

As you can see this project is quite a big one and requires a lot of effort and hard work in order to fulfil the briefs requirements and I will be trying my 100% to get the website that I create running smoothly with a great navigation system and visual style as well as making sure the website is accessible and gives the user interactivity which will help them to gain a better user experience. Also making sure the website is responsive and works well on desktop, tablet and smart phone.