UI - Rengrow/Street-Fighter-II-Gamusinos-Fighters- GitHub Wiki

Page Index

Workflow of menus

Street Fighter II is a game with really fluid menus, with short screen changes looping constantly to get the player used to it as soon as possible. Firstly, there is the legal information and the instructions of the game, after which an animation transitions and the main menu appears. If no coin is added nor any button pressed, a sequence of the AI playing against itself will appear on screen, so that potential players might get attracted. When any input is given, the screen goes back to the main menu and into the character selection, followed by the vs screen and the fighting screen. Whenever the player wins a round, the game will pause to show the amount of points the player has earned and what is his total. After the battle has eneded, the quote of the winner will appear. If the player has lost, he has the chance to try again during a 10 seconds countdown before it goes back to the main menu, and in the opposite case, it will go back to the character selection menu, only to show which will be the next stage, and repeating until a bonus stage appears, or the player reaches the ending of a certain character, in which case it will go back to the main menu again. If it so happens that a second player is added, the game will stop wherever it might be to go to the character selection menu and start a battle with said player. When he loses, the game will continue, only that a small countdown to the right will appear as to indicate the 2nd player that, by inserting more coins, he can come back and fight against player one again. 22, 23, 24

Workflow Menu image

HUD Analysis

The in-game user interphase is structured the same for each battle, starring in the left side the main player or player one, and the machine or the second player on the right. The only feature that depends on the amount of player is the amount of points of each one, and the indicator of which points have each player. If only one is using the controls, it will appear a “1P” and the points on the right at the left side, while in the right side it will simply show “Insert coin” blinking. If there were two players, the “Insert coin” would disappear and be substituted by a “2P” with the corresponding points on the right. In between both scores there is a “HI”, which is the highest score reached. Those will appear on the top of the screen, just above the life bars (yellow means life left, red means life missing; when one of those reaches the “KO” letters, the character loses). Just under the “KO” sign there is the time left, which when reaching zero, gives the win to the player with the most life left. At the extreme side of the respective character (left for the first player, right for the second), under the life bar, there is the name of the character the player is using. If either has already won one round, a sign of victory (a hand shaping the letter “v”) appears right at the respective side of the life bar. The rest of the space is empty to permit more visibility and liberty to the player, in order to make the gameplay the more dynamic. Finally, when starting a battle, the countdown, "Fight!" and amount of battles done also appears on screen.

With that said, let's show it point by point 21 : Game elements

  1. Characters fighting
  2. Character's names
  3. Rounds won by each player
  4. Remaining health bar (+ stun gauge, hidden to the player)
  5. Round time remaining
  6. Score
  1. In every match of Street Fighter II, there are two (and only two) fighters in the scene, each one controlled by one player. The main goal of the game is to defeat your opponent in a first-to-two environment.
  2. The name of the character appears below it's health bar, so it's easy to keep track of which one belongs to each character.
  3. A small hand doing the victory sign appears if that player has won one round, so you can check at first glance if you're in danger of losing the game, should you lose the round.
  4. The big yellow bar turns to red as you get hit, showing in a proportional manner how many HP you have left. Should your bar get to 0 before your opponents, you would lose the round. Another game mechanic tied to the health is the stun, as each attack you receive does both health damage and stun damage. Once your stun bar fills up, you get fully paralyzed and unable to move for a short period of time or until hit. This “stun meter” resets to 0 after a character-dependent period of time has passed without being hit.
  5. Shows how many seconds remaining there are in the round. Should it hit 0 before any health bar reaches 0, the character with more health remaining is declared the winner of said round. If such value is equal, the game assigns both characters a win (tie).
  6. . Inside the match the score is irrelevant, serving just as a living testament of the arcade era, where most games were single player and the rankings were in fact determined by score. However, it increases as you perform different actions, adding up between consecutive matches (if playing solo on the arcade mode).

Spritesheet of all the UI elements

Title Screen

Intro sheet

Logo 1 sheet

Logo 2 sheet

Characters Selection

Characters Selection UI Image

Portraits

Portraits

Victory Quotes

Victory Quotes Guiles, Ken and Chun Li Victory Quotes Ryu, Honda and Blanka Victory Quotes Vega, Sagat and Bison Victory Quotes Zangief, Dhalsim and Balrog

Fight HUD

Fight HUD

VS Mode and Game Over screen elements

VS mode and game over screen elements





We don't own any of the information or images of this wiki. Street Fighter II and all of the content used for the wiki is property of Capcom. Every piece of content is used and can be used by anyone for non-commercial projects.


⚠️ **GitHub.com Fallback** ⚠️