Each team member will conduct two interviews of people outside of class to understand their perspective on your chosen topic and on trivia games. You will want to investigate the depth of each person's knowledge and passion about your topic. You will also want to gather their likes and dislikes with trivia games and mobile gaming in general. As a team, review your interview responses and use this information to develop personas, one for each team member, that describe the context, needs, and frustrations of stakeholders, revealing opportunities to support meaningful experience with your topic. Each team member can also create a short storyboard that describes a "before, during, and after" story of how your solution provide an improved outcome. Here are templates: Persona Template & Storyboard Template

• Interviewing Users from Nielsen Norman Group

• Personas Make Users Memorable for Product Team Members from Nielsen Norman Group.

• Storyboards Help Visualize UX Ideas

❏ Deliverable Collect your team's personas and storyboards into a single document or slide set.

Storyboard Example in Article

Each team member will contribute one competitive analysis of an existing trivia game that is either available on the Web or as an app. Even though you are not investigating direct competition, you will find the analyses valuable in discovering good ideas that you may incorporate into your team's solution. Keep the context of your game in mind, because this may influence what features are appropriate for a game focused on a particular topic.

❏ Deliverable Collect your team's competitive analyses into a single document or slide set.

Idea Map

As a team, simply map out ideas for your trivia game based on your team's interest and the potential value (or impact) the idea may have with your target audience. There are no strict rules on how to do this. You simply want to entertain all the ideas and begin to evaluate which ideas have the most promise. Idea Map Template

Interaction Storyboard (Interface Sketches)

Each team member will create a unique interaction storyboard concept based on your understanding about the stakeholders, the trivia code, and a health topic. Each concept (interaction storyboard sketch) should contain four screen sketches that represent the welcome screen, question screen, correct answer feedback, and incorrect answer feedback.

Your goal is to have several unique design concepts (even though they address the same trivia topic) to consider as you move forward. You will be able to get some feedback during your proposals on these different ideas.

On why to sketch: Etch A Sketch: How to Use Sketching in User Experience Design Check out the first part of this video. This video provides some nice sketching techniques too.

❏ Deliverables Create a team idea map and collect your team's storyboard sketches into a single document or slide set.

Each team member will complete the code template build tutorial to develop a firm understanding of the technical opportunities and constraints your team will have with your design. Also, complete the steps needed to manage your own question database.

==> LINK TO TEMPLATE BUILD TUTORIAL (9 STEPS)

As a team review, you can map out the potential features of a trivia app according to the level of impact a feature might have on a user and the level of difficulty in implementing the feature with code. This should help you with the decisions you will make later about your solution. Here is a template you could use to complete a map.

❏ Deliverable Demonstrate that you have completed the build tutorial, created a question database and can discuss how the code works. Optionally, share your team's mapping of potential features.

❏ Advanced Deliverable Demonstrate that you have made modifications to the trivia app in the following ways.

1. Make at least three noticeable style changes to the game, likely done by changing the stylesheet CSS. Here are some basic changes to consider.

2. Choose and incorporate at least one Javascript code modification from this section of the Trivia Code Reference.

After careful review of your team's sketches and ideas (from 1.5), agree on the main game features and the visual theme of your team's design. Then create digital interface mockups that represent your different screen states that can demonstrate the game flow. These mockups will be used in the next step to create an interactive prototype.

If your team is has having difficulty agreeing on a design direction, determine a plan to come to a decision. Maybe, instead of one mockup, you make two or three unique mockups to compare before deciding.

❏ Deliverables Five digital screen mockups (or more) that represent:

• the welcome screen

• the question screen

• the question screen on correct answer feedback

• the question screen on incorrect answer feedback

• the closing (thank you) screen once the player is done.

Provide enough visual and interactive detail in your interactive prototype to allow thorough testing of each potential user scenario in your game. We recommend you use Marvel App to create your prototype.

❏ Deliverable A link to your working Marvel App prototype that uses your interface mockups.

Outline the features to program by priority--core features, enhanced features, and wish list features. You will find an example of a basic requirements document in the examples tab, as well as the feature map example that can serve the same purpose. Begin coding and maintain well organized code as you progress towards your first full demonstration. It is important to code in "chunks" that you can test frequently to minimize the chance of some bugs getting very hard to diagnose.

Optionally, you could use pseudocode to outline your plan for development as well. is a good introduction to the technique.

❏ Deliverable A document or slide that outlines your progressive development plan.

Conduct some basic code testing to verify that the app is acting as expected under different conditions. Ensure that everything works as expected on different size screens and with touch or mouse interactions. Consider all the things a user might do, like double click, click and drag, swipe, change browser dimensions mid-game, etc.

❏ Deliverable A document outlining the results of your code testing.

Value propositions clearly define key aspects of your design that demonstrate it is a valuable and worthwhile product or service. It provides focus for the design of many types of services or products. Here is a template to get you started.

For [describe target users] who [describe problem or need], [name of product/service] is a [describe type of product/service] that [describe benefit or value].

As a team, review all of your work and discuss several possible design directions before settling in on one single value proposition. You will want this statement to be clear, concise, and compelling. It should be supported by your research and analysis up to this point. Begin to map out the features of your solution. This will likely be updated as you go, but start to think about each feature (also could be called user stories) that your solution will provide. will give you a good introduction to the concept and you can use to get started with the map. Again, this is just a draft of your intended features to provide users and will be adapted later.

❏ Deliverable A document or slide with your team's value proposition and a draft features map.

Each team member will conduct background research on likely topics for your trivia app. Begin to be subject matter experts in any topic you choose and consider the knowledge your target audience may or may not have. You want your treatment of the topic to be accurate and appropriate for the context of your concept. For example, if your team were focusing on a health issue as the topic, see the instructions below on how you could do research.

Example Research Perspective for Health Topics: Each team member will conduct background research on at least one health issue to understand the scope of each problem (like trends, statistics, and causal relationships) and the opportunities to affect public awareness. It is important to look at each health issue through the lens of public awareness, since your trivia game can address that, rather than brainstorming cures or new treatment plans etc. How knowledgeable is the general public on the topic right now? How much could the community benefit from learning some key information through a trivia game? What is the potential for generating some social movement? Will you have access to the communities greatly affected by the health issue for further research and testing your trivia app? As a team, discuss all the research and determine which health issue will be your focus. If your team is still undecided, you may use the interviews in the next task to help you finalize your decision.

❏ Deliverable Collect your team's background research into a single document or slide set. Include the team's decision on which topic(s) your trivia game will address, or provide the team's plan to investigate a bit further before making that decision.

Plan another evaluation to test your live trivia app using the think-aloud protocol with at least six people. With your prototype you tested the general game concept, but with this evaluation you want to ensure the game is fully usable and engaging. You also want to evaluate the quality of the trivia questions. Follow up this evaluation with a post interview of participants to get feedback on the overall effectiveness of your solution in addressing your chosen health issue. You want to learn as much as you can while using people's time wisely and respectfully.

.

❏ Deliverable A document or slide that summarizes the results of your evaluation.

Each team member should evaluate the prototype by having two people individually play the prototype game using the think-aloud protocol. Synthesize your results and define important decisions for your trivia design before coding begins.

.

❏ Deliverable A document or slide that summarizes the results of your prototype evaluation.

Take this opportunity to wrap-up your trivia app the best you can in order to begin testing your game in the next phase.

❏ Deliverable A slide set with a link to your prototype, a summary of evaluation results, a copy of your marketing card, and a link to your working trivia app. Prepare to demonstrate and present your background work.

You will find that creating good trivia questions will take careful thought and multiple iterations. So getting a good start on your question bank will be very beneficial. Follow the for your team and make an intentional plan to develop your 20 or more questions.

❏ Deliverable Your completed 20+ question database.

Refine your previous work as needed to be included in your presentation. Ensure that each slide contributes to an explanation of a cohesive story that supports your initial concept and value proposition.

​

❏ Deliverable Your team's proposal as a collection of slides containing...

• a title slide

• your value proposition

• summary slides (or exemplars) of your team's work - likely not everything though.

  • competitive analyses

  • stakeholder personas

  • storyboard sketches.

Share your trivia game link with classmates and others outside of class to generate some data on player performance. Prepare summary data and charts on people's responses to your trivia questions and draw some conclusions about the quality of the questions or people's general knowledge about each item. Look for any patterns indicating errors in your trivia questions and answers.

❏ Deliverable A document or slide that summarizes analysis in charts.

Plan and practice your team's approach to do the following.

• Explain the function and value of your team's solution.

• Summarize major points in your team's process with the project. Sharing the value of each activity leading up to the solution. (Be honest about what went well or didn't.)

• Explain individual contributions and roles in the project, and a reflection of what you learned about collaborating on a team.

• Share your individual perspective on potential careers and how they relate to computing, and include specific pathways you are investigating, like other courses, certification, college, or internships.

Create a 3" x 5" marketing card. The marketing card will be a valuable lead-in to your game that could be distributed physically or as a digital image. Think about what your elevator pitch would be for the game and make it visual.

❏ Deliverable A PNG image file of your marketing card.

It is important to determine how you can get the most return (improvements in the trivia game) from the time you have remaining to work. So, based on your evaluation findings and question analysis, determine a plan to implement improvements while frequently testing to ensure nothing is unintentionally broken. Similar to your code requirements document earlier, simply list items by priority--high priority changes and low priority changes.

❏ Deliverable A document or slide listing improvements by priority.

Final Trivia App (See Basic Requirements List for Reference)

Take the time to review the project process. What went well? What didn't? What did you learn about collaboration? What did you learn about your interests in the practice of designing, coding, and data analysis? What did you learn about personal responsibility?

❏ Deliverable A document clearly conveying your project experience, learning, and future interests.

This is a time to develop a clear narrative to share about your team's work and enjoy sharing it with others in class.

❏ Deliverable Prepare a slide set with your poster, evaluation summary, and app link for discussion and demonstration your trivia app.

Final Trivia App (See Basic Requirements List for Reference)

Your poster design is important for two reasons. One, it is an opportunity for your team to reflect on the project process and what you have learned, and two, it provides a great visual aid for explaining your work to visitors at the final event. Highlight at least six artifacts that demonstrate key work your team completed in the project process from beginning to end, and include a refined value statement that pulls it all together.

POSTER TEMPLATE

• You can use this which is set to 36 inches wide by 24 inches tall. Zoom in or out as needed to add text, images, etc. – but do not change the canvas size. (Be sure you're logged in to your Google Account. From the File menu, select Make a copy. Save the copied file to your shared team folder in Google Drive.)

• If you use a different drawing/illustration tool, set the canvas size to 36 inches wide by 24 inches tall at 300 pixels per inch (10800 pixels wide by 7200 pixels tall).

• If your teacher has specified a different size for the poster, use that instead.

❏ Deliverable A PDF file of poster (36" x 24").

Poster Components

The poster template below is only an example to inspire you on how text and images could be inserted for each element. You want to make your own poster design, but make it coherent and easy to follow. Also, your version may not have as many artifacts or sections as this.

Past Student Examples

Remember, a lot of people will likely be learning about your project for the first time. You will need to tell your story from the beginning in an engaging way.

Final Trivia App (See Basic Requirements List for Reference)

Presentation