Gamification for Interactive Learning by Karl Kapp on Lynda.com
Game Thinking
Game thinking pulls on deeper game elements, like engagement loops, freedom to fail, player’s journey; used in opposition to gamification because it tries to use game elements that are more intrinsically motivating
Gamification capitalizes on the game element of replayability. Repetition without the content becoming boring, personalizes the pace and content, encourages exploration.
Reflection is often a part of playing, which helps learners internalize the content
Game (def.) a system in which players engage in an abstract challenge defined by rules, interactivity, and feedback, resulting in a quantifiable outcome or objective, often eliciting an emotional reaction
Gamification (def.) taking parts or elements on games and applying those elements to learning activities to engage the learners; it’s not about playing a game, it’s about engagement
Types of Gamification – Content v. Structural
Both use game elements and mechanics to engage the learner, but they differ in what elements they use and how they are applied
Structural – placing a game structure around the content without changing the content itself
Content – when the content is altered to become more game-like
Uses of gamification
Pre-work – activities completed before the main learning event
Pull-through – behavior or content intended to reinforce recently learning info
Daily-reminder – regular notification of and practice with important info
Winning does not equal mastery
Gamification, if not focused correctly, can push people towards a performance mindset (where they care more about how they are doing/perceived at doing than how well they are engaging with the content)
- Performance oriented gamification discourages experimentation and exploration
Ideally, you achieve mastery orientation — signals are that users accept errors and seek challenges, hoping to develop their skills, knowledge, and behaviors, and have confidence in their ability to succeed
- Achievements/badges can acknowledge efforts and support learners during challenges
- Provide frequent progress feedback, notifications of improvement, and provide info about accomplishments
With good balance, no one player or group can always win, and each learner has an opportunity to be successful
Guidelines for Balanced Gamification
- Ensure scoring is transparent
- Ensure all players understand how points, advancement, and rewards are earned
- Ensure one team/person can’t “run away with the victory”
- Provide bonus features that allow for a catch up
Testing is crucial for establishing good balance! Encourage testers to try to game the system
Engagement requires that decisions the user makes can actually make a difference in the game, which means they’re should be “consequences” for mistakes
Encourage users to explore. This will help users to keep themselves engaged. Be mindful about not punishing a certain type of exploration.
- Consider: creation, collection, socialization, exploration, etc.
- Examples: Minecraft, Pokemon, WoW, Stanley Parable
“People cannot influence their own motivation and actions very well if they do not pay adequate attention to their own performances.” – the conditions where something occurs, and the result
Action > Feedback > Motivation > Repeat
Feedback Loop = Engagement loop = Learning loop
At the heart of game thinking is learning. Engagement leads directly to learning
Loop basics – provide info about knowledge, skills, or behavioral development in real time; allow for opportunity to change and retry; have clear goals and indications of feedback
Progression Loop — the “player’s journey” through the entire experience, series or steps
These require deliberate action, and thoughtful consideration to work effectively
- Introduce new stimuli or changes into engagement loops
- Introduce a negative feedback loop
Gamification solutions require dozens of questions (there needs to be a lot of content in order for the thing to work and not become quickly repetitive)
Good multiple choice questions requiring more than rote recitation require more time to create
Types of Multiple Choice Questions
The further down the list you go, the greater you will need to understand the info to correctly and actively answer the question.
- Recall question — rote memorization, does not reinforce or test understanding
- Application question — recognize the info and apply to a situation
- Evaluation question — extension of current knowledge
Using Point Systems
Points can feel really cheap unless they are applied thoughtfully and carefully
- Tie points to performance — you get more points when you do better
- Use points to give deeper, immediate feedback — gauge understanding
- Indicate relative value of activities — certain actions or answers are worth more points, can be used to direct learners in a direction (ex. Prevent guessing)
- Provide variability and replayability — add more dimensions so that learners can still improve even if they know most of the answers
Badge — visible sign of mastery/achievement; if the badge has little or no relevance to people in the group, the badge will quickly lose value
Badge Prestige (perceived value)
- Perceived difficult of earning the badge
- Proper validation of the badge
When badges are predictively earned and broadcasted beforehand, it can be linear motivation
When badges are not broadcasted, they are nonlinear motivation (secret achievements); it can be a reward for exploration
Leaderboards can create a competitive environment for points or badges. However, they can also be demotivating for people who are further down on the board.
You need to develop a strategy to motivate as many learners as possible with leaderboards and not accidentally demotivate people (think Duolingo’s tired leaderboards)
Well designed leaderboards can provide direction and motivation
Losing can be frustrating, demotivating, and not fun, but with competition, someone has to end up at the bottom. This means that you are at risk of alienating someone who loses.
Deemphasize Winning to combat this
Limit praise for winners, offer a small/no prize for winning, emphasize learning aspects; remind learners that failure is part of the learning process; reframe success to a shorter timescale, or only personal progress
Or use cooperative games instead of competitive, where people have to collaborate to succeed
Reflection is key to true learning, so try to lead learners towards doing so
Some users will only focus on winning, and will try to cheat in order to do so
How to Minimize Cheating
- Test and Retest (try to find ways to cheat, and fix those issues)
- Monitor Continuously
- Consider methods that aren’t exactly cheating, but could be interpreted that way by other learners
- Establish and Check System Parameters (dotting i’s on if all settings are correct)
Structural Gamification — application of game elements to propel a learner though content with no alteration or changes to the content
The content stays the same, but it’s inserted into a game framework
A training video does not change, but there are points or badges attached to viewing it.
The number of structural gamification tools has expanded and diversified, many measure behaviors and actions as well
You need to have lots of questions in order to have enough content to sustain any real duration
Game based gamification — learners engage in small games unrelated to the content, and which are intended to grab attention and clear the mind
Used to prep users for learning, put then in a “flow”
Flow — a mental state in which a person is fully immersed, only paying attention to the task at hand
The content that you are trying to teach appears after a few moments of playing, hoping to be easier to learn and retain after clearing their mind playing
It’s possible that playing the minigame enhances learning because it increases the learner’s vigilance and alertness (stress), which preps their mind to taking in new information.
When learners are given the choice to play a minigame with the questions or just answer a question, most learners will choose the game, those learners answer more questions correctly, and have longer correct answer streaks than those who did not play
These learners were also motivated to pursue extra learning opportunities, “so they could answer more questions correctly” (confidence = more open to opportunities = more chances of success?)
Competition based gamification – players are prevented from directly competing with opponents, and have to entirely focus on optimizing their own play
It helps to keep the number of competitors small in these setups. The fewer the competitors, the more likely someone sees their own chances of success, so they try harder. This phenomenon is known as the N-effect.
Consider breaking people out into teams to shrink groups of competitors
Competition is not appealing to everyone, and can become demotivating to players. Consider who your audience is, what you are hoping they will learn.
Progression based gamification — showing learners their progress based on their mastery of desired knowledge, skills, or behavior
Types of Progression Based Competition
Against the computer
Against time
Against other learners
Categories of Badges — time, accuracy, learning, competency
Performance based gamification — measures what a person does and rewards appropriately
- Self reporting — self measured
- Observation — supervisor measured
- Systematic — interface measured
Content gamification — application of game dynamics, mechanics, and elements to alter instructional content itself to the content more game-like
Views gamification as a design affordance — if a designer adds many game elements, content gamification can shift into a learning or serious game
Design affordance — properties of objects which show users the actions they can take
Requires more advanced design skills, does not have preexisting framework
Techniques — story/context, characters, challenge
Characters can spark better engagement than text only in content
Give learners options about who is their teacher, mentor, aide…
Think about diversity
Challenge should exist! Users are not engaged when things are too easy. Challenge has been correlated with both intrinsic motivation and motivation related to fostering competence and learner confidence
Adults learn best when they have a need to know
People have been shown to better retain facts from when they are included in a story than when they are presented on their own. So, set up the right content for your learners!
If you set up good contexts for presenting info, then the users know what kinds of situations that that info is useful
Key points for use
- Ensure characters and the situation are relevant and relatable to the learner
- Make the story interactive (have consequences for good and bad actions)
Provide juicy feedback — designing for visceral reactions in the learners so they experience emotions; it should be natural within the context of the world, consistently given, and coherent
Crafting Meaningful HTML by Jen Kramer
Identify major elements of the page (the content).
Create notes on what components are, understand the content before marking it up.
Heading 1, generally only one per page, the name of the website.
Remaining headings should have hierarchical info
Never skip a level!
Don’t use HTML to add any style to text (bolds, strongs, italics, sizes…) Use CSS
Exception is when style directly adds significant meaning to the content
Keep in mind that HTML is really for people who are interacting with the text without the CSS visuals (when CSS doesn’t load, screen readers,etc.). It should still be easy to read (or listen to) and convey the intended meaning.
Don’t pick list types by appearance, but by the meaning that list type would convey.
(this is not expanded on…)
Remember alt tags! Make it meaningful to the people who really need it
This really applies to the footer, considering the amount of info usually present
Use <span> tags to apply style elements to text that add meaning that’s isn’t as important to be included more directly in the HTML
Full list of HTML Tags: https://www.w3schools.com/tags/default.asp
Tags that could be potentially useful outside of standard range
<address> defines an address
<article> defines an article
<aside> defines content that is not necessarily part of the pages content
<dl>, <dt>, <dd> defines description lists, terms, and values of those items (FAQ)
<figure> can also be used to define images, different use cases
<noscript> defines alternate content for users not using client-side scripts
CSS: Enhancing Interfaces with Animations by Christina Gorton
Performance and accessibility should always be a priority! Animation should never reduce the impact of either
You want to only impact the Composite portion of the rendering pipeline
Style > Layout > Paint > Composite
You can check this on csstriggers.com
You can also use CSS feature Prefers-Reduced-Motion to minimize the nonessential motion for users who have this requested
Keep in mind 12 principles of animation for web animations as well. They don’t all apply one to one, but it can help make more effect animations
Squash and Stretch
Anticipation
Staging
Straight Ahead and Pose to Pose
Follow Through
Slow in and Slow Out
Arc
Secondary Actions
Timing
Exaggeration
Consider it as choreography.
Sequencing – order designated to parts of animation; incoming, outgoing, and persistence.
Easings – linear, ease-in/ease-out, ease-in-out, cubic bezier
Cubic Bezier is most customizable
Transforms — scale, rotate, skew, translate
Consider X and Y axis
Translate moves items across the screen
A focal element in a transition is a persistent element that is significant to the overall hierarchy of element in transition
Colon and tag create a pseudo element
Button animations
Hover has new background slide in from left, changes text color
.button:before (this does not animate, it established a pseudo element to animate with)
Set color, size, font, etc. parameters.
Z-index controls the depth, used in example to hide pseudo element behind button
Transform-origin controls starting place of animation
Transform controls animation
Overflow: hidden hides element when it is outside bounds of original button (?)
.button:hover
background-color: transparent will allow pseudo element appear
.button:hover:before
transform: translateX(0px)
Hover has new background slide in from top, quicker than first animation
.button:before
Transform: translateY(-100%)
Transition: all 0.2s ease-out
Z-index: -1
.button:hover:
Background-color:transparent
.button:hover:before
Transform: translateY(0)
A lot of possibilities with the same basic tools. Remember to just try combos and explore!
x:hover creates an in effect, x:after creates an out effect
Video Script Writing by Rick Allen Lippert
Informational videos have goals. Try to limit them to three or four, tops.
They often want to motivate, train, or inform. These are kind of “baked” into the format. These kind of break down to trying to persuade someone to act in the desired way you want them to.
Remember logos, pathos, and ethos!
Terminology
Header — contains the page number, draft number, and title
Slug — video, scene description
Parenthetical — advice on delivery, use sparingly
Shot types
LS — long shot
MS — medium shot
CU — close up
Two column script — video directions are on left side, audio directions are on right side
Screenplay style — standard movie script, text is still formatted similarly to two column, which video aligned left and audio aligned right
The video is supposed to solve a problem, so you need to know what the problem is.
Identify the Need
Identify the Solution Topic
Identify the Audience
Identify where it will be shared
It’s helpful to start with a vision identified and create a budget to match than doing the reverse
This is where to decide the length, the most important points, the goal, style