Overview
Designing and developing an application or website can be costly in terms of time and money. To avoid wasting a lot of these resources on a final product that does not meet the user’s needs or has usability problems, it is worth creating storyboards and low-fidelity prototypes. Storyboards can help you understand the context in which a user might be interacting with your product, as well as their thoughts and emotional response to the interaction. Low-fidelity sketches of a prototype allow you to come up with a variety of design ideas quickly and cheaply, and refine them before putting a lot of work into a high-fidelity prototype.
Individual Task
Having collected user data, performed analysis of this data and completed your personas, user stories and new requirements for Submission 1, you will use what you have learned to guide you through the process of creating storyboards and then developing some low-fidelity prototypes.
1. Storyboarding
Select 4 user stories from submission 1 (these can be user stories you created or user stories that were created by your teammates) and create storyboards depicting the scenario of each story:
Produce 4 storyboards (one for each selected user story) using the template from NNGroup. Make sure your storyboard:
● Illustrates the story of a given persona (name of the persona should be provided as part of the storyboard).
● Refers to a specific user story (the goal should be clear in the storyboard).
● There should be 4 to 6 frames drawn in the storyboard.
● Has a brief text description under each visual. These descriptions should be meaningful, considering users’ emotions/thoughts.
In addition you are asked to consider accessibility and inclusivity via the Persona Spectrum for your storyboards. For this, at least two of your storyboards should cater to people who have some sort of impairment or limitation (i.e. permanent, temporary or situational):
● These two storyboards must depict two different types of impairment or limitation (where the types are: permanent, temporary or situational).
Additional reading: https://www.nngroup.com/articles/storyboards-visualize-ideas/
Low fidelity prototype
Now you have a good understanding of your users, the problem you are trying to solve, and have created some storyboards to illustrate the requirements. Next you will produce some prototype screens of your proposed solution:
● Provide sketches of 4 low-fidelity prototype screens. The screens must show implementation of some acceptance criteria from the four user stories you selected in the previous task. For example, (1) the app’s “Home” screen, (2) a “Favourite Trails” screen, and so on. Assume the user is already logged in; do not sketch a sign-up/sign-in screen.
For this:
○ List the acceptance criteria, using the Kanban format as practiced in the lecture and tutorials, for the four user stories you chose for your storyboards.
○ Sketch low-fidelity prototype designs of 4 screens which refer to the most important/relevant criteria to implement. A minimum of 3 acceptance criteria must be implemented per user story. Note that criteria belonging to 1 user story can be implemented across more than one screen. Update the Kanban board with how the criteria was implemented in the ‘Done’ column.
○ In addition to considering general design and usability principles, your prototype must consider accessible and inclusive design.
■ Nominate 4 of Norman’s Design Principles and 4 Accessibility Guidelines/Principles and annotate your prototypes to show where they have been applied. These should be spread evenly throughout your screens (i.e. don’t have 4 rules/principles on one screen and only 1 rule/principle on each of the other screens).
○ Your screens should be drawn by hand ideally. These hand-drawn screens can be scanned/photographed, and then uploaded into your report.
Discussion
Write a brief report explaining the most important decisions you have made when designing your prototype (2-page maximum; annotated images are not included in this limit):
a) Justify the user stories and acceptance criteria you have selected to implement (i.e. why you implemented that set of criteria over the others).
b) Provide clear explanations/justifications of how your nominated Norman’s principles have been applied (referencing the annotated screens of your prototype).
c) Provide clear explanations/justifications of how accessibility and inclusive design has been addressed through the accessibility guidelines/principles in the prototype (referencing the annotated screens of your prototype).
d) As tutors will not be referring to previous submissions while marking Submission 2, please include your relevant user stories and personas from Submission 1 in an Appendix at the end of your Submission 2 document.
Format of the deliverables
● Consider how you would present your materials to a potential client. Your submission must contain the following:
● Title Page
● Table of Contents
● Introduction
● 4 Selected User Stories
● 4 Storyboards (including 2 storyboards considering impairments)
● List of Acceptance Criteria
● Low-Fidelity Prototypes (4 screens, annotated) ● Discussion (max. 2 pages)
○ Justification of user stories and acceptance criteria
○ Explanation of how 4 Norman’s Principles have been applied.
○ Explanation of how 4 Guidelines/Principles for accessibility/inclusivity are addressed.
● Conclusion ● Appendix
○ Personas (from submission 1)
○ User stories (from submission 1)
● Quality over quantity! Make sure your responses to assessment questions demonstrate thoughtful application of theory and processes.