Visual Novel Strategy

SisterShield’s core educational experience is not a textbook, a quiz, or a video lecture. It is an interactive visual novel — a choose-your-own-adventure story where the learner is the protagonist, making decisions that shape outcomes. This page explains why this approach was chosen and how it is structured.

Why Interactive Narrative for TF-VAWG Education

The Problem with Traditional Approaches

Conventional digital safety education tends to be:

• Passive — reading or watching, with no engagement.
• Abstract — statistics and definitions, disconnected from lived experience.
• Fear-based — emphasizing danger without building skills or agency.
• One-size-fits-all — no cultural adaptation, no linguistic accessibility.

These approaches fail the people who need them most: young women and girls who may not yet recognize the patterns of technology-facilitated violence in their own lives.

The Interactive Narrative Advantage

Interactive visual novels address every shortcoming above:

Traditional Approach	Interactive Narrative
Passive consumption	Active decision-making
Abstract statistics	Persona-driven, relatable scenarios
Fear-based warnings	Empowering skill practice
One-size-fits-all	AI-generated, culturally adapted content
Single outcome	Multiple paths with learning at every turn

Three Core Design Principles

1. Persona-Driven Storytelling

Learners identify with a protagonist who faces realistic TF-VAWG scenarios. By inhabiting the protagonist’s perspective, learners develop empathy, recognition skills, and emotional preparation — all in a low-risk environment. The protagonist is not a victim to be pitied; she is an agent making decisions, just like the learner.

2. Teachable Failure States

In SisterShield, there are no dead-ends. When a learner makes a risky choice, they encounter a Learning Moment — an educational reframe that explains why the choice was risky, what the safer alternative would be, and what real-world resources exist. This approach:

• Avoids victim-blaming (“You chose wrong”) in favor of skill-building (“Here’s something to consider”).
• Keeps the learner engaged instead of punished.
• Models the real world, where risky situations can be navigated with knowledge.

3. Agency and Empowerment

Every choice the learner makes reinforces their agency. Even when a choice leads to a difficult outcome, the narrative frames it as a learning opportunity, not a failure. The learner practices decision-making in a safe space, building confidence for real-world situations.

Research Basis

Interactive narrative for sensitive topic education is supported by research in serious games, narrative medicine, and trauma-informed pedagogy. TODO: Add specific citations to support this approach.

---

Twine Integration Architecture

SisterShield uses Twine — an open-source tool for creating interactive, nonlinear stories — as its narrative engine. The integration follows a structured pipeline:

Upload → Parse → Store → Review → Build (inject tracking) → Play (iframe)

Stage	What Happens	Technical Detail
Upload	Teacher or AI generates a Twine story file (.html or .twee)	File upload via submission form
Parse	The Twine parser extracts passages, links, metadata, and story structure	Custom parser in src/lib/twine/parser.ts
Store	Parsed content is stored in the database with i18n fields	Prisma models: Course, CourseVersion
Review	Teachers or admins review content for safety, accuracy, and appropriateness	Global review queue with approve/reject workflow
Build	Tracking code is injected into the story to monitor progress and choices	Injector in src/lib/twine/injector.ts
Play	The built story is rendered in an iframe with progress tracking	TwinePlayer component in src/components/twine/

Why Twine?

Twine is widely used in education and interactive fiction. It produces self-contained HTML files, requires no runtime dependencies, and has a large community of authors and tools. This makes it ideal for a platform where teachers (not just developers) create content.

---

Course Structure Template

Every SisterShield course follows a consistent pedagogical structure, regardless of the specific TF-VAWG topic:

1. Introduction (SDG Context)

Set the scene. Introduce the protagonist and the real-world context. Briefly connect to SDG 5 or 16. The learner understands why this topic matters before encountering the scenario.

Example opening: “Jiyeon is a 17-year-old high school student who loves photography and shares her work on social media. Today, something unusual happens in her DMs…“

2. Scenario (Based on Real TF-VAWG Patterns)

Present a realistic situation drawn from documented TF-VAWG patterns (e.g., sextortion, cyberstalking, non-consensual image sharing, online harassment). The scenario should feel real but not graphic.

Design rules:

• Based on documented patterns, not invented for shock value.
• Culturally relevant to the target audience.
• Escalates gradually, giving the learner multiple decision points.

3. CBT Skill Build (Cognitive Coping Exercise)

At a key decision point, introduce a brief cognitive-behavioral technique:

• Thought identification: “What is Jiyeon thinking right now? What might she be feeling?”
• Reframing: “Is there another way to think about this situation?”
• Coping strategy: “What is one thing Jiyeon could do right now to feel safer?”

This is not therapy — it is a skill-building exercise embedded in the narrative.

4. Global Action (Reporting and Real-World Tools)

Connect the story to real-world action:

• How to report the specific type of TF-VAWG shown in the scenario.
• Platforms like StopNCII.org for non-consensual image removal.
• Local reporting mechanisms (e.g., Korean Cyber Bureau).
• How to document evidence safely.

5. Safety Exit (Crisis Resources)

Every course ends with visible, accessible crisis resources:

• Crisis Text Line: Text HOME to 741741.
• Korean Women’s Emergency Hotline: 1366.
• Platform-level Get Help dialog.
• Reminder that Quick Exit is always available.

---

Choice Architecture

Every decision point in a SisterShield story offers three types of choices:

1. Safe Choice

Leads to a positive outcome with reinforcement. The narrative acknowledges the learner’s good judgment and explains why this was a safe choice.

Example: “Jiyeon decides to screenshot the messages and tell her school counselor. The counselor helps her report the account and block the sender.”

Reinforcement: “Documenting evidence and telling a trusted adult are two of the most effective first steps when facing online harassment.”

2. Ambiguous Choice

Leads to a nuanced outcome that requires critical thinking. The situation does not immediately resolve; the learner must think about consequences and next steps.

Example: “Jiyeon decides to confront the sender directly, asking them to stop. The sender apologizes but then creates a new account.”

Learning outcome: “Confronting a harasser can sometimes work, but it can also escalate the situation. Consider: what are the risks of direct confrontation? What safer alternatives exist?“

3. Risky Choice

Leads to a Learning Moment — never punishment, never graphic consequences, never victim-blaming. The narrative explains the risk, offers a reframe, and provides a path back to safer decisions.

Example: “Jiyeon decides to ignore the messages and hope they stop. Over the next week, the messages increase.”

Learning Moment: “Ignoring harassment is a common response — it makes sense to hope the problem will go away on its own. However, many forms of online harassment escalate when ignored. Here is what Jiyeon could do now…”

Critical Design Rule

Risky choices must NEVER blame the learner or protagonist. The framing is always: “This is understandable, AND here is additional information that might change your thinking.” The word “but” is avoided in favor of “and” to maintain a non-judgmental tone.

---

Growth Narrative Within Stories

Across a series of courses, the protagonist develops skills:

Course Stage	Protagonist’s Growth	Learner’s Growth
Early courses	Recognizes TF-VAWG patterns	Builds awareness
Middle courses	Uses reporting tools, tells trusted adults	Practices response skills
Later courses	Helps others, advocates for change	Develops leadership and empowerment

This mirrors real-world growth: from awareness, to self-protection, to community action.

---

Rubric Mapping

Rubric Category	How This Page Contributes
Technical	Demonstrates “full functionality” through a sophisticated content pipeline (upload, parse, store, review, build, play)
Potential Impact	Pedagogical strategy is evidence-informed and designed for lasting behavior change
User Experience	Choice architecture creates an engaging, non-punitive learning experience tailored to the target audience
Avoid Harm	Learning Moments replace punishment; no victim-blaming; crisis resources in every course
Ideation	Interactive narrative is a direct, innovative response to the identified problem (passive, fear-based education fails)

Strengthening This Section

To maximize impact, include at least one fully written example course (or excerpt) that demonstrates the 5-part structure and 3-choice architecture in action. This provides concrete evidence of the pedagogical strategy, not just the theory.