Interactive Bingo Prototype

Posted

Danielle Tice, Inside Feels Bingo Game

Many people have hard times feeling their emotions and differentiating between them. Neurodivergent people (like me) could benefit from an app that will constantly make them look for their feelings, capturing that moment of feeling the emotion.

The emotion wheel describes six emotions: anger, sadness, fear, surprise, joy, and love. People can use the wheel to identify their feelings and come to terms with how they are feeling and, ultimately, become more self-aware and self-compassionate. This bingo game is aiming to do the same thing but in an interactive way.

Jam Bayoneto, National Park Bingo

National park visitors who have limited time to explore needs a short list of recommended top national park landmarks and experiences they can visit and still have a fun, enjoyable, and immersive experience given their time constraints.

Katie White, Skiing Bingo Game

User Statement: A group of friends go skiing and they want some added entertainment throughout the day. They play a game of skiing bingo and race to complete a bingo with different sights they encounter throughout the day.

Grace Houdek, Concert Bingo Game

Sometimes concert and festival goers end up with a lot of spare time waiting for the show to begin. They would ideally like to have a fun activity to engage in with their friends and other attendees to pass the time. This application provides attendees with an exciting, concert specific activity to take part in together while winning awards, allowing the entire concert experience to be an enjoyable one.

Nicole Grganto, Fitness Bingo

An avid gym-goer wants to develop a workout routine that meets their fitness goals, while tracking their progress of specific exercises over time.

Educator/s:
Institution:
Level: , , ,
Duration: 6 weeks
Category: , ,
Filed Under: , , , , , , ,
Bookmark Project

Project Brief

A well-designed interface is critical to the success of an interactive environment. Learning and practicing the Interactive Design Fundamentals (interactions vs. gestures + patterns) as well as Visual Design Fundamentals (communication + direction + amusement) is a component of this introductory course in Interaction Design. This project introduced students to these fundamentals and asked them to reimagine how the popular game BINGO can be played on a smart phone device. Using Figma, a commonly used web-based prototyping and design tool, student designed an interactive medium-fidelity prototype. They followed an interaction design process resulting in the final product that was a simulation/model/prototype of their idea.

Learning Objectives

PROCESS LEARNING OBJECTIVES:

Week 1:

1: Brainstorm traditional + alternative forms of BINGO.
2: Write a Concept Statement articulating your individual idea and context of use.
3: Define a User Path by writing a User Need Statement and diagramming a User Task Flow.

Week 2:

4: Sketch interface designs for a smart phone device.
5: Generate a medium-fidelity wireframe.

Week 3:

6: Conduct visual research and reference ideas for a design direction in a mood board.
7: Create a consistent design system—type, colors, images, icons, etc. (original and sourced).

Week 4:

8: Prototype (Medium-Fidelity) your Interactive BINGO game building on your medium-fidelity wireframe.

Week 5-6:

9: Generate a static mockup image of your prototype, record your prototype in use, and create a project sheet showing process work and final outcome images.

All weeks at each critical step:

Critique the work of your peers and take into account the feedback you receive along the way.

PRODUCT LEARNING OBJECTIVES:

+ Exhibits your use of Figma as you maintain and generate all of your process work in a single Figma file
+ Clearly indicates how someone plays your new game design
+ Is a model of typographic design, easy to use, easy to understand
+ Inventive solution to a reimagined BINGO game
+ “Digital Craft” is well-executed; Content is free of typos and/or grammatical errors; transitions and animations are smooth and concise
+ Exported + shared from Figma in the means communicated, 
appropriate for public portfolio presentation purposes

Deliverables

Concept Statement (Writing)
User Need Statement (Writing)
User Task Flow (Diagram)
Sketches (Analog or Digital)
Medium-Fidelity Wireframe
Mood Board
Design System Components
Medium-Fidelity Prototype
Mock-up Images of prototype
Recording of Prototype in Use
Project Poster Summary

Readings/Resources

There are too many to list! If you are interested in resource details + the lecture content—I'd be willing to share a link to the course materials collected in Figma. Email me at tegtmey2@msu.edu.

Reflections

This course in Interaction Design is the only IxD course in our Graphic Design program, therefore it has to do a lot of heavy lifting. Students do this project as their second one in the class, it follows a shorter project that introduces them to working with wireframes and using Figma. The project has served as a effective way to engage students in an interaction design process working with content and subject matter that interests them!

Related projects