Wikipedia

Isometric video game graphics

"Isometric graphics" redirects here. For isometric projection in general, seeIsometric projection.

Isometric video game graphicsare graphics employed invideo gamesandpixel artthat use aparallel projection,but which angle theviewpointto reveal facets of the environment that would otherwise not be visible from atop-down perspectiveorside view,thereby producing athree-dimensional (3D) effect.Despite the name, isometric computer graphics are not necessarily trulyisometric—i.e., thex,y,andzaxes are not necessarily oriented 120° to each other. Instead, a variety of angles are used, withdimetric projectionand a 2:1 pixel ratio being the most common. The terms "3/4 perspective", "3/4 view", "2.5D",and" pseudo 3D "are also sometimes used, although these terms can bear slightly different meanings in other contexts.

Once common, isometric projection became less so with the advent of more powerful3D graphicssystems, and as video games began to focus more on action and individual characters.[1]However, video games using isometric projection—especiallycomputer role-playing games—have seen a resurgence in recent years within theindie gamingscene.[1][2]

Overview

edit

Advantages

edit
Corresponding 3D camera rotation angles for true isometric projection (at left) and the form of dimetric projection commonly found in video games and pixel art (at right).[3]The expressionarctan(sin(45°))is equal to ≈35.264°.
True isometric drawing of a cube. Note the 120° angles separating thex,yandzaxes, as well as the equal lengths of each of the cube's edges. The expressionarctan(sin(≈35.264°))orarctan(sin(arctan(sin(45°))))is equal to 30° and forms a pixel ratio of ≈1.732:1.
The form of dimetric projection commonly used in video games and pixel art. Only two of the angles separating thex,yandzaxes are the same, and only some of the lengths of the cube's edges are equal. The expressionarctan(sin(30°))is equal to ≈26.565° and forms a 2:1 pixel ratio.

A well-executed isometric system should never have the player thinking about the camera. You should be able to quickly and intuitively move the view to what you need to look at and never consider the camera mechanics. Trying to run a full-3D camera while playing out a real-time tactical battle is certain to cause ahelmet firein new players as they are quickly overwhelmed by the mechanics.

Trent Oster, co-founder ofBioWareand founder ofBeamdog[1]

In the fields ofcomputer and video gamesandpixel art,the technique has become popular because of the ease with which2Dsprite- andtile-basedgraphics can be made to represent3Dgaming environments. Becauseparallel projectedobjects do not change in size as they move about an area, there is no need for the computer to scalespritesor do the complex calculations necessary to simulatevisual perspective.This allowed8-bitand16-bitgame systems (and, more recently,handheldandmobilesystems) to portray large game areas quickly and easily. And, while thedepth confusion problemsof parallel projection can sometimes be a problem, good game and level design can alleviate this.

Further, though not limited strictly to isometric video game graphics,pre-rendered2D graphics can possess a higher fidelity and use more advanced graphical techniques than may be possible on commonly available computer hardware, even with3D hardware acceleration.[4]Similarly to modernCGIused inmotion pictures,graphics can be rendered one time on a powerfulsuper computerorrender farm,and then displayed many times on less powerful consumer hardware, such as ontelevision sets,tablet computersandsmartphones.This means that static pre-rendered isometric graphics often look better compared to their contemporary real-time-rendered counterparts, and may age better over time compared to their peers.[2]However, this advantage may be less pronounced today than it was in the past, as developments in graphical technology equalize or producediminishing returns,and current levels of graphical fidelity become "good enough" for many people.[citation needed]

Lastly, there are also gameplay advantages to using an isometric or near-isometric perspective in video games. For instance, compared to a purelytop-downgame, they add a third dimension, opening up new avenues for aiming andplatforming.[1]Secondly, compared to afirst-orthird-personvideo game, they allow you to more easily field and control a large number of units, such as a fullparty of charactersin acomputer role-playing game,or an army of minions in areal-time strategy game.[1]Further, they may alleviate situations where a player may become distracted from a game's coremechanicsby having to constantly manage an unwieldy 3D camera.[1]I.e., the player can focus on playing the game itself, and not on manipulating the game's camera.[1]

In the present day, rather than being purely a source of nostalgia, the revival of isometric projection is the result of real, tangible design benefits.[1]

Disadvantages

edit

Some disadvantages of pre-rendered isometric graphics are that, asdisplay resolutionsanddisplay aspect ratioscontinue to evolve, static 2D images need to be re-rendered each time in order to keep pace, or potentially suffer from the effects ofpixelationand requireanti-aliasing.Re-rendering a game's graphics is not always possible, however; as was the case in 2012, whenBeamdogremadeBioWare'sBaldur's Gate(1998). Beamdog were lacking the original developers' creative art assets (the original data was lost in a flood[5]) and opted for simple2D graphics scalingwith "smoothing", without re-rendering the game's sprites. The results were a certain "fuzziness", or lack of "crispness", compared to the original game's graphics.[citation needed]This does not affect real-time rendered polygonal isometric video games, however, as changing their display resolutions or aspect ratios is trivial, in comparison.

Differences from "true" isometric projection

edit

The projection commonly used in video games deviates slightly from "true" isometric due to the limitations ofraster graphics.Lines in thexandydirections would not follow a neat pixel pattern if drawn in the required 30° to the horizontal. While modern computers can eliminate this problem usinganti-aliasing,earlier computer graphics did not support enough colors or possess enough CPU power to accomplish this. Instead, a 2:1 pixel pattern ratio would be used to draw thexandyaxis lines, resulting in these axes following a ≈26.565° (arctan(1/2)) angle to the horizontal. (Game systems that do not usesquare pixelscould, however, yield different angles, including "true" isometric.) Therefore, this form of projection is more accurately described as a variation ofdimetric projection,since only two of the three angles between the axes are equal to each other, i.e.,(≈116.565°, ≈116.565°, ≈126.870°).

History of isometric video games

edit

Somethree-dimensionalgames were released as early as the 1970s, but the first video games to use the distinct visual style of isometric projection in the meaning described above werearcade gamesin the early 1980s.

1980s

edit

The use of isometric graphics in video games began withData East'sDECO Cassette Systemarcade gameTreasure Island,[6]released in Japan in September 1981,[7]but it was not released internationally until June 1982.[8]The first isometric game to be released internationally wasSega'sZaxxon,which was significantly more popular and influential;[9][10]it was released in Japan in December 1981[11]and internationally in April 1982.[8]Zaxxonis anisometric shooterwhere the player flies a space plane throughscrollinglevels. It is also one of the first video games to display shadows.[9]

Another early isometric game isQ*bert.[12]Warren Davisand Jeff Lee began programming the concept around April 1982. The game's production began in the summer and then released in October or November 1982.[13]Q*bertshows a static pyramid in an isometric perspective, with the player controlling a character which can jump around on the pyramid.[9]

In February 1983,[8]theisometric platform gamearcade gameCongo Bongowas released, running on the same hardware asZaxxon.[14]It allows the player character to traverse non-scrolling isometric levels, including three-dimensional climbing and falling. The same is possible in the arcade titleMarble Madness,released in 1984.

2D (at left) and 3D (at right) coordinates of a typical dimetric video game sprite

In 1983, isometric games were no longer exclusive to the arcade market and also entered home computers, with the release ofBlue Maxfor theAtari 8-bit computersandAnt Attackfor theZX Spectrum.InAnt Attack,the player can move forward in any direction of the scrolling game, offering complete free movement rather than fixed to one axis as withZaxxon.The views can also be changed around a90 degrees axis.[15]The ZX Spectrum magazine,Crash,consequently awarded it 100% in the graphics category for this new technique, known as "Soft Solid 3-D".[16]

A year later, the ZX Spectrum gameKnight Lorewas released. It was generally regarded as a revolutionary title[17]that defined the subsequent genre of isometric adventure games.[18]FollowingKnight Lore,many isometric titles were seen on home computers – to an extent that it once was regarded as being the second most cloned piece of software afterWordStar,according to researcher Jan Krikke.[19]Other examples out of those wereHighway Encounter(1985),Batman(1986),Head Over Heels(1987)[20]andLa Abadía del Crimen(1987). Isometric perspective was not limited to arcade/adventure games, though; for example, the 1989 strategy gamePopulousused isometric perspective.

1990s

edit
A television set drawn in near-isometric 2:1pixel art(enlarged to show the pixel structure)[21]
3D renderingmimicking the video gameFallout's use oftrimetric projectionand ahexagonal grid

Throughout the 1990s several successful games such asSyndicate(1993),SimCity 2000(1994),Civilization II(1996),X-COM(1994), andDiablo(1996) used a fixed isometric perspective. But with the advent of3D accelerationon personal computers and gaming consoles, games previously using a 2D perspective generally started switching to true 3D (andperspective projection) instead. This can be seen in the successors to the above games: for instanceSimCity(2013),Civilization VI(2016),XCOM: Enemy Unknown(2012) andDiablo III(2012) all use 3D polygonal graphics; and whileDiablo II(2000) used fixed-perspective 2D perspective like its predecessor, it optionally allowed for perspective scaling of the sprites in the distance to lend it a "pseudo-3D" appearance.[22]

Also during the 1990s, isometric graphics began being used for Japaneserole-playing video games(JRPGs) onconsole systems,particularlytactical role-playing games,many of which still use isometric graphics today. Examples includeFront Mission(1995),Tactics Ogre(1995) andFinal Fantasy Tactics(1997)—the latter of which used3D graphicsto create an environment where the player could freely rotate the camera. Other titles such asVandal Hearts(1996) andBreath of Fire III(1997) carefully emulated an isometric or parallel view, but actually used perspective projection.

Isometric, or similar, perspectives become popular inrole-playing video games,such asFalloutandBaldur's Gate.In some cases, these role-playing games became defined by their isometric perspective, which allows larger scale battles.[1]

2010s

edit

Isometric projection has seen continued relevance in the new millennium with the release of several newly-crowdfundedrole-playing games onKickstarter.[1]These include theShadowrun Returnsseries (2013-2015) byHarebrained Schemes;thePillars of Eternityseries (2015-2018) andTyranny(2016) byObsidian Entertainment;andTorment: Tides of Numenera(2017) byinXile Entertainment.[citation needed]Both Obsidian Entertainment and inXile Entertainment have employed, or were founded by, former members of Black Isle Studios and Interplay Entertainment. Obsidian Entertainment in particular wanted to "bring back the look and feel of theInfinity Enginegames likeBaldur's Gate,Icewind Dale,andPlanescape: Torment".[1]Lastly, several pseudo-isometric 3D RPGs, such asDivinity: Original Sin(2014),Wasteland 2(2014) andDead State(2014), have been crowdfunded using Kickstarter. These titles differ from the above games, however, in that they useperspective projectioninstead ofparallel projection.[citation needed].There also other examples of modern isometric games, such asProject Zomboid.

edit
Comparison of several types ofgraphical projection.Among 3/4 views, the presence of one or more 90° principal angles is often a good indicator that the perspective used isoblique projection.

The term "isometric perspective" is frequently misapplied to any game with an—usually fixed—angled, overhead view that appears at first to be "isometric". These include the aforementioneddimetrically projectedvideo games; games that usetrimetric projection,such asFallout(1997)[23]andSimCity 4(2003);[24]games that useoblique projection,such asUltima Online(1997)[25]andDivine Divinity(2002);[26]and games that use a combination ofperspective projectionand abird's eye view,such asSilent Storm(2003),[27]Torchlight(2009)[28]andDivinity: Original Sin(2014).[29]

Also, not all "isometric" video games rely solely on pre-rendered 2D sprites. There are, for instance, titles which use polygonal 3D graphics completely, but render their graphics using parallel projection instead of perspective projection, such asSyndicate Wars(1996),Dungeon Keeper(1997) andDepths of Peril(2007); games which use a combination of pre-rendered 2D backgrounds and real-time rendered 3D character models, such asThe Temple of Elemental Evil(2003) andTorment: Tides of Numenera(2017); and games which combine real-time rendered 3D backgrounds with hand-drawn 2D character sprites, such asFinal Fantasy Tactics(1997) andDisgaea: Hour of Darkness(2003).

One advantage of top-downoblique projectionover other near-isometric perspectives, is that objects fit more snugly within non-overlapping square graphical tiles, thereby potentially eliminating the need for an additionalZ-orderin calculations, and requiring fewer pixels.

Mapping screen to world coordinates

edit
Finding world coordinates

One of the most common problems with programming games that use isometric (or more likely dimetric) projections is the ability to map between events that happen on the 2d plane of the screen and the actual location in the isometric space, called world space. A common example is picking the tile that lies right under the cursor when a user clicks. One such method is using the samerotation matricesthat originally produced the isometric view in reverse to turn a point in screen coordinates into a point that would lie on the game board surface before it was rotated. Then, the world x and y values can be calculated by dividing by the tile width and height.

Another way that is less computationally intensive and can have good results if the method is called on every frame, rests on the assumption that a square board was rotated by 45 degrees and then squashed to be half its original height. A virtual grid is overlaid on the projection as shown on the diagram, with axes virtual-x and virtual-y. Clicking any tile on the central axis of the board where (x, y) = (tileMapWidth / 2, y), will produce the same tile value for both world-x and world-y which in this example is 3 (0 indexed). Selecting the tile that lies one position on the right on the virtual grid, actually moves one tile less on the world-y and one tile more on the world-x. This is the formula that calculates world-x by taking the virtual-y and adding the virtual-x from the center of the board. Likewise world-y is calculated by taking virtual-y and subtracting virtual-x. These calculations measure from the central axis, as shown, so the results must be translated by half the board. For example, in the C programming language: 

floatvirtualTileX=screenx/virtualTileWidth;
floatvirtualTileY=screeny/virtualTileHeight;

// some display systems have their origin at the bottom left while the tile map at the top left, so we need to reverse y
floatinverseTileY=numberOfTilesInY-virtualTileY;

floatisoTileX=inverseTileY+(virtualTileX-numberOfTilesInX/2);
floatisoTileY=inverseTileY-(virtualTileX-numberOfTilesInY/2);

This method might seem counter intuitive at first since the coordinates of a virtual grid are taken, rather than the original isometric world, and there is no one-to-one correspondence between virtual tiles and isometric tiles. A tile on the grid will contain more than one isometric tile, and depending on where it is clicked it should map to different coordinates. The key in this method is that the virtual coordinates are floating point numbers rather than integers. A virtual-x and y value can be (3.5, 3.5) which means the center of the third tile. In the diagram on the left, this falls in the 3rd tile on the y in detail. When the virtual-x and y must add up to 4, the world x will also be 4.

Examples

edit

Dimetric projection

edit

Oblique projection

edit

Perspective projection

edit

See also

edit

References

edit
  1. ^abcdefghijkSignor, Jeremy (2014-12-19)."Retronauts: The Continued Relevance of Isometric Games".usgamer.net.Gamer Network. Archived fromthe originalon 2015-08-09.Retrieved2017-04-01.
  2. ^ab Vas, Gergo (2013-03-18)."The Best-Looking Isometric Games".kotaku.Gizmodo Media Group.Retrieved2017-04-01.
  3. ^Note: the blue vectors point towards the camera positions. The red arcs represent the rotations around the horizontal and vertical axes. The white boxes match the ones shown in the images at the top of the article. Notice how in the left image the camera vector passes through the two opposing vertices of the cube.
  4. ^Vas, Gergo (2013-05-10)."Video Games With The Most Memorable Pre-Rendered Backgrounds".Kotaku.Gizmodo Media Group.Retrieved2017-04-01.
  5. ^Grayson, Nathan (2016-04-01)."The Struggle To Bring Back Baldur's Gate After 17 Years".Kotaku.Gizmodo Media Group.Retrieved2017-04-11.It was a big challenge because all of the Baldur's Gate original assets like the 3D models that make up these sprites, the 3D models for the levels in the original game, these archives were lost.
  6. ^Treasure Islandat theKiller List of Videogames
  7. ^"Treasure Island (Registration Number PA0000187784)".United States Copyright Office.Retrieved5 May2021.
  8. ^abcAkagi, Masumi (October 13, 2006).アーケードTVゲームリスト quốc nội • hải ngoại biên (1971-2005)[Arcade TV Game List: Domestic • Overseas Edition (1971-2005)] (in Japanese). Japan: Amusement News Agency. pp. 35, 115, 131.ISBN978-4990251215.
  9. ^abcPerron, Bernard; Wolf, Mark J. P. (12 November 2008).The Video Game Theory Reader 2.Taylor & Francis. p. 158.ISBN978-0-415-96282-7.Retrieved13 November2022.
  10. ^Zaxxonat theKiller List of Videogames
  11. ^"Zaxxon (Registration Number PA0000135301)".United States Copyright Office.Retrieved5 May2021.
  12. ^Q*bertat theKiller List of Videogames
  13. ^Davis, Warren."The Creation of Q*Bert".Coinop.org.Retrieved26 September2011.
  14. ^Congo Bongoat theKiller List of Videogames
  15. ^"Sculptin the new shape of Spectrum games".Sinclair User(21). December 1983.Retrieved2009-03-02.
  16. ^"Soft Solid 3D Ant Attack".CRASH(1). February 1984.Retrieved2008-09-29.
  17. ^"Ultimate Play the Game – Company Lookback".Retro Micro Games Action – The Best of gamesTM Retro Volume 1.Highbury Entertainment. 2006. p. 25.
  18. ^Steven Collins."Game Graphics During the 8-bit Computer Era".Computer Graphics Newsletters.SIGGRAPH. Archived fromthe originalon 2012-09-09.Retrieved2007-08-16.
  19. ^Krikke, J. (July–August 2000). "Axonometry: a matter of perspective".IEEE Computer Graphics and Applications.20(4): 7–11.doi:10.1109/38.851742."Knight Lorewas said to be the second most cloned piece of software after the word- processing programWord Star."
  20. ^"Looking for an old angle".CRASH(51). April 1988.Retrieved2008-09-29.
  21. ^Note: The 2:1 pixel pattern in the near-isometric image allows smoother lines than in the isometric one.
  22. ^"Diablo II Nears Completion As Blizzard Prepares For Final Phase Of Beta Testing".FindArticles.BNET Business Network.Marketwire.May 2000. Archived fromthe originalon 2012-07-10.Retrieved2008-09-29.
  23. ^Green, Jeff (2000-02-29)."GameSpot Preview: Arcanum".GameSpot.CNET Networks, Inc.Retrieved2008-01-10.
  24. ^Butts, Steve (2003-09-09)."SimCity 4: Rush Hour Preview".IGN PC.IGN Entertainment, Inc.Archived fromthe originalon September 20, 2003.Retrieved2008-01-10.
  25. ^Greely, Dave; Ben Sawyer (1997-08-19)."Has Origin Created the First True Online Game World?".Gamasutra.CMP Media LLC.Retrieved2007-12-17.
  26. ^Walker, Trey (2002-07-12)."Divine Divinity goes gold".GameSpot.CBS Interactive.Retrieved2017-04-11.
  27. ^O'Hagan, Steve (2008-08-07)."PC Previews: Silent Storm".ComputerAndVideoGames.Future Publishing Limited.Retrieved2007-12-13.
  28. ^McDougall, Jaz (November 4, 2009)."Torchlight Review".Games Radar.Retrieved2009-11-06.
  29. ^Hamilton, Kirk (2014-07-03)."I'm Glad They're Still Making Games Like Divinity: Original Sin".Kotaku.Gizmodo Media Group.Retrieved2017-04-11.
edit
Wikimedia Commons has media related toIsometric video game screenshots.
Retrieved from "https://en.wikipedia.org/w/index.php?title=Isometric_video_game_graphics&oldid=1253982086"