sitemaps and wireframes

Research pre production documents

find two visual examples of a sitemap and two wireframe
Write a paragraph describing what a sitemap is
write a paragraph describing what a wireframe is
Create a table a table for each one and write two advantages and two disadvantages


Sitemaps

 A sitemap (also known as a sitemap.xml file) is a list of pages of a website, or rather a map of a website. Sitemaps are used during the planning of a website by its designers.



 Wireframes

 A wireframe is a layout of a webpage that demonstrates what interface elements will exist on key pages. This is a critical part of the design process.





Advantages
makes changes more efficiently
saves time and money

Disadvantages 
provides design limitations adds more to the process of making a website 

Disadvantages - can only be used for designing website
Can't use it for films etc...




sitemaps 
a list of pages of a website
three main types: 
- Those used during the planning of the website design (essentially a spider diagram mapping out what pages are on and how get communicate (this is a preproduction sitemap)
- The second type is  a list, visible to the pubic on a website 
- The third list is a coding list designed for search engines (key words in coding etc..)


wireframes
A visual representation of the framework of a website 
not meant to be visually attractive 
meant to show a detailed layout of a website 
Aims:
-Help arrange a sight for a specific purpose 
- Informed by the business aims or a creative idea
- shows the website layout
- shows how different elements (features) of the site interact with each other
- Can be hand drawn sketches or completed via online software

Created by by business analysts, user experience designed, developers and visual designers
Expertise required: interaction design, information architecture and user research

Disadvantages - can't see the colours, graphics or design style 





Look at small production companies (e.g.. Zigzag Productions, Wildstag Studios, Casual Films)
Create the following:
- Sitemap for your production company
- Wireframe for the homepage of your site on a computer screen
- Wireframe for the homepage of your site on a mobile phone screen 
-Wireframe for the site discussing the projects you have 'completed' (a short film and a funding video)
- To do this, use sites like the following, or draw by hand:
1. Lucidchart.com (wireframe builder)
2. Wireframe.cc (wireframe builder)
3. Writemaps.com (sitemap builder) 



analyse existing market examples 
evaluate what went well in theirs 




Comments

Post a Comment

Popular posts from this blog

Personnel, facilities, locations and resources

Personnel, facilities, locations and resources Getting the right staff part 1 - One way is to audit them - Complete a media skills audit part 2 - Create a list. If you were to make a short film what skills would you need? eg. camera work, editing, directing, acting, costume design, production design, concept design Production Designer  - Responsible for concept design in theatre productions and films - They identify a style for sets, locations, graphics, props, lighting, camera angles, while working closely with the director and the producer 1) What does the role of a production designer entail? And what skills do they need? - "the hand of the director" - Understand how the director reads the script and helps the director visually accomplish what he interprets the film to be. Helps achieve the directors vision of the script. - Have to "mind read" the director - Have tot create the visual world of the film - In preproduction, their key role is  tak...
Read more