← Back to Games
Pixel Art · Typing Game Built for Internship · ResolveX Browser · HTML / CSS / JS

Path of Emotions ⛰️

A pixel art typing game for crisis line workers! Building emotional vocabulary and typing fluency through seven progressively challenging environments, with feelings words falling from the sky.

RoleSolo Developer · Designer · Artist
EngineHTML · CSS · JavaScript
GenreTyping Game · Wellness Tool
PlatformBrowser
StatusIn development
ContextResolveX Internship
Actively in development · screenshots and playable build coming soon Will update when complete ✦

Why this project found me

Years before I was a designer, I was a volunteer at a crisis line texting service. Following a series of trainings, I spent hours typing responses to people in acute distress, learning to choose words carefully, quickly, and with intention. That experience gave me important context. However, I never had to fill out extensive documentation after every interaction, just a few questions.

Later, I worked as a houseless camp case manager, which was a role that demanded emotional precision, often in chaotic conditions. The workers around me had to document and emotionally regulate all at once. I watched brilliant, caring people burn out not from lack of empathy, but from systems that gave them no room to breathe or practice.

When my internship at ResolveX, a mental health company with documentation software for crisis center workers, offered me this opportunity to make a game, I was incredibly excited to build. Path of Emotions started as an answer to a very personal design question: what does it look like to practice both emotional vocabulary and typing speed in a space that doesn't feel clinical?

"What if the same act of typing that fills out crisis documentation could also be a moment of calm and learning?"

-> The question that started this project

Who we're designing for

Before deciding what time of game to create, I developed six user personas representing the range of workers in this problem space who might use Path of Emotions, from new frontline employees finding their footing to seasoned executives managing burnout. Each persona shaped a different aspect of the game: pacing, vocabulary difficulty, visual tone, and accessibility needs.

The feelings wheel

The vocabulary for Path of Emotions is grounded in the feelings wheel, which is a structured map of emotions language used widely in crisis support training. It organizes emotions from broad states at the center outward to nuanced, layered feeling-words at the edges.

This became the backbone of the word bank and the game's difficulty progression. Words closest to the center of the wheel — "sad," "angry," "afraid" — appear in early levels. As the game progresses, the words move outward: "bereft," "ambivalent," "despondent," "tender." The mountain climbs as the vocabulary deepens.

Feelings wheel reference

The feelings wheel: foundation of the word bank and difficulty curve

A sample of feeling words used in the game

Anxious Hopeful Grief Resilient Overwhelmed Bereft Tender Numb Ambivalent Despairing Relieved Shattered Hollow Wistful Despondent Elated Rattled + many more

How Path of Emotions works

Crisis line workers spend significant time typing during and after calls, documenting, responding, logging. Typing fluency directly affects how present they can be on a call. Path of Emotions builds that fluency in a way that also familiarizes workers with the exact emotional vocabulary they'll use on the line.

The mechanic is simple: feeling words fall from the top of the screen. Players type each word and press enter to clear it and move onto the next terms before it reaches the bottom. Words are highlighted as the current target when the player hits enter, so there's no clicking needed. Each level gets gradually faster, increasing the typing demand over time. There are intermediate levels with paragraphs to type, testing an individual's ability to type full sentences.

The dual purpose is intentional. Faster typing means more practice with typing under pressure. Familiarity with emotional vocabulary means richer, more precise responses to callers. Both skills are practiced in the same breath, inside a calming pixel art environment that is not in a documentation context.

⌨️
Typing Fluency
Words fall gradually faster across levels. Workers build speed in a low-stakes space, so documentation during live calls feels less overwhelming. The game can be stopped and resumed at any time, and starting speed can be adjusted accordingly for replayability.
💬
Emotional Vocabulary
Every word in the game is a feeling word drawn from crisis support language. Players absorb vocabulary passively while focusing on the typing task.
🌿
Calming Environment
Seven pixel art backgrounds progress through environments that feel restorative rather than stressful, including a waterfall, snowy banks, and more.

Seven environments

The game moves through seven distinct environments, each with its own pixel art background and emotional tone. The home screen opens inside a cozy tent that is safe and relatively barren. From there, the player moves outward into larger, more expansive scenes as the words grow more complex. Six are complete; the Forest Floor is still in progress.

The environment progression was sketched out early in the process with rough drawings and rough colored drawings to nail down the emotional arc and visual variety before committing to any pixel art. These sketches aren't for all environments, just the early ones used to establish tone and spatial direction. Please note that final environments are still in draft format and need to be cleaned up.

Rough environment progression sketches

Early environment progression -> early iteration rough ideation sketches

Early environment work 1

Environment / prop work -> early stage but deprecated

Early environment work 2

Background exploration (original stream background, depreecated)

Tent home screen

Home screen -> inside the tent

Home Screen — Tent
Home Screen -> Inside the Tent
🌲
Coming Soon ✦
Level 1 -> Forest Floor
Level 2 — Waterfall
Level 2 -> Waterfall
Level 3 — Green to Snow
Level 3 -> Green to Snow
Level 4 — Snowy
Level 4 -> Snowy
Level 5 — Base Camp
Level 5 -> Base Camp
Level 6 — Summit
Level 6 -> Summit

Each text also has custom UI underlays, backgrounds for falling text and button states that are designed after the backgrounds were finalized so text legibility stays consistent across different sky and ground colors.

UI button overlays

UI button and overlay work

Small animated characters

Each environment has a small animated pixel character that lives in the scene with idle animations and reactions to correctly typed words. This will help make the world feel alive without distracting from the typing. Character work is the most recent phase, and images will be added here once they're complete.

✦ Character sprite images coming soon! I will update this section when complete.

How the mechanic evolved

Several decisions shifted significantly during development, both in terms of the interaction design and the technology stack.

🎮
Unity → HTML / CSS / JavaScript
I started building Path of Emotions in Unity, which felt like a natural fit given I'd worked in it before. But as the project took shape, I realized the game was always intended to live in a browser and accessible to crisis line workers without any install, across whatever device they're using at their desk. If it's a web game, a web game makes more sense to build as one (even though I could have uploaded the Unity game to web format). Because I have experience with frontend, switching to HTML, CSS, and JavaScript simplified the deployment entirely, kept the files size small, and meant I could iterate on the UI and feel much faster without a build pipeline in the way.
🖱️
Click-to-select → Enter to advance
The original design required players to click on each word to select it before typing. This felt intuitive at first, but became tedious quickly, especially in levels with many words falling at once. The mouse movement broke the typing rhythm entirely and added friction that worked against the calming tone and would not work in higher levels. The solution was simpler: players just type and hit enter. The next word in the queue highlights automatically, so the hand never leaves the keyboard. It's faster, and flows better.
Gradual speed increase across levels
Rather than fixed difficulty tiers, the words fall gradually faster as each level progresses — starting slow enough to be meditative, accelerating to a pace that requires real focus by the end. This mirrors how real typing fluency builds: the challenge appears gently, not as a sudden wall.
🌿
Environment as emotional texture, not just backdrop
Early versions had the same background for every level. The decision to give each level a distinct, progressively expansive environment came from the personas — burned-out workers and new volunteers both needed the game to feel like a break, not another task. The changing scenery provides that sense of journey and progress without any explicit reward system.

Still building

🛠️
In Active Development
Coding is underway. The environments and UI are built; character work is in progress. Hoping to wrap development soon, and will update this page with a playable build and final screenshots when complete.
Six environments complete -> Forest Floor in progress
UI overlays and falling text -> complete
Word bank drawn from feelings wheel -> in progress
Core typing mechanic -> in development (HTML/CSS/JS)
Small animated characters -> in progress
Level progression and speed curve -> in progress
Sound design and ambient audio -> planned
Clean up and finalize environments -> planned
Playable build and final screenshots -> coming soon
⏱  Will update when complete