Skip to content

lvlivingston/Apres-TreeSki

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Title Banner

A browser based game created by Leah Livingston

Click Here to Play the Game Now


Do you remember Chris Pirih's classic 1991 computer game "SkiFree"? If you enjoyed running from the abominal snowman back then, you'll love this version set in the Austrian Alps!

Let's set the scene...

Oh je! After skiing all morning, you spent the afternoon in the Stúbe hut during après-ski. The last train home is in one minute, so you're cutting it close. To make the train, you'll have to take a shortcut through the trees; and let's just say, you're not in your best 🍻"state-of-mind"🥴 to ski well.

Your goal?

Ski the shortcut through the trees to make the last train home.

How to play

Click the "Auf geht's!" button and hold down the "S" key when you're ready to ski. To navigate, press the "A" key to turn left, the "D" key to turn right. Don't be afraid to test out key presses... there might be a few surprises built in for you to find!

How to win

You've won when your skier makes it to the bottom of the ski slope and onto the train in under one minute. If you hit three trees on the way down or don't reach the train, you lose.

Click Here to Play the Game Now


Screenshots of the Game

Game Start

Start Screen

During Gameplay

During Game

End Options (Winner vs. Two Losing Options)

Winner Loser - Option One Loser - Option Two


Tech Stack

This game was built using HTML, CSS, vanilla JavaScript & Canvas.


Credit

A big thank you to Weston Bailey, April Gonzalez, Matthew Haines, Tom Kolsrud, & Abay Rysbek for your support.


Next Steps

Short-Term Stretch Goals
  • Adjust responsiveness for additional screen sizes
  • Refactor code of movementHandler function to implement DRY
  • Change startCountdown function to abide by the single responsibility principle to enhances testability and maintainability
  • Change use of innerHTML in healthScore function to safer alternative like textContent, createElement or appendChild to reduce chance of cross-site scripting (XSS) attack
  • Adjust user experience, so train scrolls up onto screen rathering than appearing
  • Adjust collision detection functions to match exact image sizes (i.e. triangle trees), rather than current square boxes
  • Ability to pick up a pretzel or beer on the way down to gain an additional life
Long-Term Stretch Goals
  • Add noises for when you hit a tree and ski, as well as music at the end
  • Adjust canvas to scroll left and right to add more surprise finds
  • Include moving obstacles i.e. other skiers/snowboarders, animals, etc.
  • Add point system based on number of wins, speed, and surprise finds
  • Include immediate 'game over' function by triggering an avalanche
  • Ability to choose your player "Johannes" or "Katarina"
  • Option to race computer player down the hill
  • Ability to play using the computer mouse
  • Ability to play on mobile (reacts to touch events)

Planning Materials & Original Pitch below

An elevator pitch of your game idea

Do you remember Chris Pirih's classic 1991 computer game "SkiFree"? If you enjoyed running from the abominal snowman back then, you'll love this version set in the Austrian Alps!

Click the "Auf geht's!" button when you're ready to ski. You've won when your skier makes it to the bottom of the ski slope just in time to make the train home!

Setting the scene

After skiing all morning, you spent the afternoon in the Stúbe hut drinking during après-ski. The last train home is in ten minutes, so you're cutting it close. It's time to ski down the hill as quickly as possible to make it back home.

The goal

Ski down the slope in time to make the last train home.

How to play

Use the left, right, and down arrow keys on your keyboard to navigate down the ski slope.

How to win

Ski down the hill in under one minute, and you win!


What tech stack you plan on using (example: using Tailwind for styling)

This game is built using HTML, CSS, JavaScript & Canvas.


Wireframes of your game

The minimum viable product (MVP) goal is for the user interface to show basic CSS in order for a functional game to be played.

Starting Screen

Start Screen

During Gameplay

During Game


Last 10 Seconds

End Screens for Winner vs. Loser

Winner


Loser


MVP Goals

Style
  • Includes basic CSS in block form to ensure functionality works

1991 SkiFree

Functionality
  • Includes a start button to activate the beginning of the game
  • Include one player functionality
  • Include function to allow player to move via the keyboard keys
  • Include obstacles (placed randomly)
  • Include countdown timer
  • Include finish line for player to win
  • Include a start over button to reset game from the top

Stretch Goals

Style
  • Includes CSS & Canvas styling to match that of SkiFree Screenshot of SkiFree
Functionality
  • Include health score tracker with three (3) lives, meaning with each crash, you lose one life.
  • Add boundaries to the left and right of screen to ensure skier can't ski out of view
  • Ability to pick up a pretzel or beer on the way down to add another life.
  • Include moving obstacles i.e. other skiers/snowboarders, animals, etc.
  • Include immediate 'game over' function by triggering an avalanche
  • Ability to choose your player "Johannes" or "Katarina"
  • Option to race computer player down the hill
  • Ability to play using the computer mouse
  • Ability to play on mobile (reacts to touch events)

Any potential roadblocks

  • How to create a gameboard that is longer than the screen seen at the start

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published