Stretch tasks R093 TA3: Pre-production Documents

Round 1: Quiz Blitz

1. Visualisation diagram Static product means visualisation diagram.
2. Storyboard Moving image means storyboard.
3. wireframe Boxes stand in for images and grey bars for text.
4. Every screen and the links between them Every screen is a box and every link an arrow.
5. False Give a value, such as #02848B.
6. Licence It is the evidence that nothing infringes copyright.
7. Annotations explaining each choice Writing why each element is there is where the marks are.
8. Shot type; Duration Also camera movement, dialogue, sound and the transition.
9. Linear One screen after another.
10. hierarchical Most websites use a hierarchical structure.
11. A dead end A navigation diagram is checked for dead ends.
12. To agree a look and feel with the client early It exposes disagreements in an afternoon.

Round 2: Quick Fire

1. • Words like modern mean different things, and the board exposes that
   • It is settled early, before artwork must be redone
   Model answer

   Words like modern mean different things to the client and the designer, and a mood board shows the actual look, exposing any disagreement. It is settled in an afternoon, before design starts, rather than after two weeks of finished artwork that must be redone.

2. • The canvas size and orientation
   • Exact colour values and named fonts
   • The position of every element, with annotations
   Model answer

   It must show the canvas size and orientation, such as A3 portrait, the exact colour values, such as #02848B, and the fonts by name and size. Every element must be positioned and annotated to explain its purpose, with bleed and safe margins marked for print.

3. • It keeps the discussion on structure and placement
   • Styling would distract the client
   Model answer

   Leaving the styling out keeps the conversation about structure: where each element goes and what it does. Colour and images would distract the client into debating how it looks before the layout is agreed.

4. • It is the evidence that nothing infringes copyright
   • So the product can be published lawfully
   Model answer

   The licence column is the evidence that every asset can be used without infringing copyright. Without it, the product cannot be published lawfully, and an unlicensed asset could lead to legal action or invalidate the work.

Round 3: Big Think

1. • A mood board for the look and feel
   • Wireframes for each screen
   • A navigation diagram with no dead ends
   • A hub and spoke structure suits a kiosk
   • A storyboard for the video
   • A script for the voiceover
   • An asset table with licences
   • A work plan with milestones
   Model answer

   A mood board would agree the look and feel with the museum first. Wireframes would show the placement of every element on each screen, without styling, and a navigation diagram would show every screen and link, checking there are no dead ends; a hub and spoke structure suits a kiosk. For the welcome video, a storyboard would show each shot with its type, duration and sound, and a script would set out the voiceover. An asset table would record every image, clip and sound with its source and licence. A work plan would set out the tasks, milestones and contingency.

2. • A magazine cover is static, so it needs a visualisation diagram
   • A video advert is moving image, so it needs a storyboard
   • The visualisation diagram shows size, colour values and fonts
   • The storyboard shows shot type, duration, sound and transitions
   • Both must be annotated with the reasons
   • Otherwise they are drawings, not documents
   • A header block with purpose, audience and version
   • So another designer could build from them
   Model answer

   The documents are the wrong way round. A magazine cover is a static product, so it needs a visualisation diagram, and a video advert is moving image, so it needs a storyboard. The visualisation diagram must show the canvas size, exact colour values and named fonts with sizes, with every element positioned. The storyboard needs one frame per shot, each with its shot type, camera movement, duration, dialogue, sound and transition. Both must be annotated to give the reason for each decision, otherwise they are drawings, not documents, and another designer could not build from them. Each also needs a header block stating its purpose, audience and version.

This or That

1. Visualisation diagram A logo is a static graphic.
2. Storyboard An animation is moving image.
3. Navigation diagram A mood board sets the look. A navigation diagram sets the structure.
4. Poppins SemiBold 42pt Fonts are named, with weight and size.
5. Every distinct screen Wireframing only the home screen is a common mistake.
6. Hub and spoke Branches that return to a central screen are hub and spoke.
7. Mind map A mind map branches out from a central idea, judging nothing yet.
8. No: it is a scrapbook Annotations explaining each choice make it a planning document.

Memory Match

• A 6 Mood board: Annotated collage setting the look and feel
• B 3 Visualisation diagram: Annotated plan of a static graphic
• C 5 Storyboard: Frame by frame plan of moving image
• D 1 Wireframe: Screen layout with no styling
• E 2 Navigation diagram: Every screen and the links between them
• F 4 Asset table: Every asset's source, format and licence

Sort It

1. Storyboard A film trailer A trailer is moving image.
2. Visualisation diagram A logo A logo is a static graphic.
3. Visualisation diagram A magazine cover Static graphics use a visualisation diagram.
4. Wireframe A mobile app screen App screens are wireframed.
5. Wireframe A website's home page Each screen of an interactive product is wireframed.
6. Storyboard An animated short Animation is planned shot by shot.
7. Storyboard A music video A music video is moving image.
8. Wireframe A kiosk menu screen Interactive screens use wireframes.
9. Wireframe An online booking form A form is a screen in an interactive product.
10. Visualisation diagram Product packaging Packaging is a static design.
11. Storyboard A TV advert Moving image uses a storyboard.
12. Visualisation diagram A poster A poster is static.