R097 TA1: Planning Interactive Digital Media

1 Explain why a navigation diagram is produced before building an interactive product. 3

One mark for each of the following, to a maximum of 3.

• It shows every screen and how they connect
• It allows checking that every screen is reachable with a route back
• Structural problems are far cheaper to fix on a diagram

Model answer. A navigation diagram maps every screen as a box and shows with arrows which screen each link leads to, so the whole structure can be seen at once. That makes it possible to verify that every screen can be reached, that there is always a route back or onward so nobody becomes stuck at a dead end, and that nothing important is buried so deep that users abandon it. Fixing those problems on a diagram takes minutes; discovering after the product is built that a whole section is unreachable means rebuilding the navigation and often restructuring several screens with content already in them.

2 Describe four accessibility requirements an interactive product should meet. 4

One mark for each of the following, to a maximum of 4.

• Sufficient colour contrast
• Alternative text for images
• Captions or transcripts for audio and video
• Keyboard operability, or not relying on colour alone

Model answer. Text must meet a contrast ratio of at least 4.5:1 against its background, so it stays readable for users with low vision. Every meaningful image needs alternative text, so a screen reader can describe it rather than announcing an unlabelled graphic. All video and audio needs captions or a transcript, which serves deaf users and also the many people using the product with the sound off. Every control must be operable by keyboard alone, with a visible focus indicator, because a large number of users cannot use a mouse or a touchscreen accurately.

3 A museum wants an interactive touchscreen exhibit with a menu of six topics, each leading to text, images and a short video. Justify the navigation structure you would choose and explain how you would plan the screens. 6

One mark for each of the following, to a maximum of 6.

• A suitable structure is named
• Justified for a public kiosk
• The navigation diagram is described
• Dead ends and depth are addressed
• Wireframes for each distinct screen
• A kiosk specific consideration

Model answer. A hub and spoke structure is the right choice. The menu is the hub, each of the six topics is a spoke, and every topic screen returns directly to the menu, which means the deepest the visitor ever goes is two taps and they can always get back in one. That suits a public kiosk specifically: visitors arrive with no instructions, stay for a minute or two, and the next person needs to find the exhibit in its starting state. A hierarchical structure with sub-sections would bury content and leave people stranded; a linear structure would force them through topics they do not care about. I would plan it with a navigation diagram showing the attract screen, the menu, the six topic screens and the video on each, with arrows in both directions, which makes it easy to confirm there are no dead ends and no screen more than two steps from the menu. Then I would wireframe each distinct screen rather than just the menu: the attract loop, the menu, a topic screen with text, image and video, and the video playing state with its own controls. Being a kiosk adds requirements that belong in the plan rather than being discovered later: an idle timeout that returns to the attract screen after a minute of no input, tap targets large enough for a visitor who is standing and not looking closely, no reliance on a keyboard, and a layout that works for both a child and an adult at a fixed screen height.