Pixel-Art Worlds on iPhone: What the 16-Bit Masters Knew

A Final Fantasy VI party member is 16 by 24 pixels, drawn in 12 usable colours in battle, with 46 poses built from at most 181 tiles, and the same sprite walks the field, the world map, and every battle.¹ Pokémon Emerald draws every town from 16-by-16 “metatiles” of two layers each, with a map cell of 16 bits: ten for the tile, two for collision, four for elevation.² Celeste renders its whole world at 320 by 180 and multiplies by six.³ Those three numbers hold the craft: fix a cell, fix a palette, fix a canvas, and then draw inside them. Our own app, Kiradex, has a pixel plaza rendered in RealityKit, and when I held it against that record it failed on most counts: a 28-tile set in ad-hoc flat colour with no ramps, no outlines rule, no occlusion, a two-frame walk. So I did the research properly: six sourced reports on the SNES era, Pokémon’s tile systems read from the decompilations, the modern masters, the craft, the Apple rendering path, and collecting games as social worlds. What follows is the guide I wished I had, with the numbers, the measured recipe for crisp pixel art on a 3× iPhone screen and both displays of iPhone Duo, and the first results of rebuilding our world by rule.

TL;DR

• The masters worked from the constraint outward. The SNES gave its 16-colour tiles eight background and eight sprite palettes of 15 colours, 8-by-8 tiles, and 32 sprites per scanline; Square’s answer was one 16-by-24 cell, a pose library, and tile sharing.⁴¹ The Game Boy gave four shades, and Pokémon Red’s tilesets held 96 tiles; Game Freak’s answer was 32-by-32 blocks and a priority bit that hides your feet in tall grass with zero extra art.⁵⁶
• Three decisions make a pixel world read as one place: a single light direction and shadow hue (the Seiken Densetsu 3 team shaded in deep blues and purples instead of black), one outline rule applied to every sprite (FF VI’s silhouette is 93 percent near-black at its edge; Secret of Mana’s has no black at all), and hue-shifted colour ramps instead of lighter-and-darker swatches.³³⁸⁹
• The modern tier list for lighting is affordable at the bottom and ruinous at the top. Moonlighter fakes light with overlaid sprites; Celeste draws lights as masks in one 2048-pixel atlas; Eastward hand-paints a bump map for every asset; HD-2D costs “more than you’d think,” in its producer’s words, and players switch its depth of field off.^10111213
• On Apple platforms, stay in RealityKit for a 2D world that holds one real 3D object, and turn its AR defaults off. Every pixel-art need has a documented API (a nearest sampler, no mipmaps, an opacity threshold, a UV transform per frame), but RealityView applies motion blur and HDR tone mapping by default, and the recipe switches those off along with depth of field, grain and antialiasing.¹⁴¹⁵¹⁶ Our walkers were blurred mid-step until we did.
• Integer scaling on iPhone is arithmetic you do in pixels, not points. At 3×, one texel at six pixels is 2 points, so a 16-texel tile is 32 points; the iPhone 18 Pro Max shows 10.3 by 22.4 tiles at eight per texel, the open iPhone Duo 29.7 by 20.9 at six, and no current iPhone height divides by 320, so “exactly 20 tiles tall” always means bars.¹⁷
• Own art, drawn by rule, is the clean path. The Copyright Office’s January 2025 report says “prompts do not alone provide sufficient control” for a copyright, and style is not protected but specific tiles and characters are; so we built a forge that draws every tile from one 58-colour palette and hand-set rules, and the first field and the rebuilt plaza are at the end.¹⁸¹⁹

1. What the 16-bit masters were working against

The Super Nintendo had no framebuffer. Its picture processor had to emit a pixel every 186 nanoseconds from video memory that answered in 100, so it fetched eight pixels ahead from a map of 8-by-8 tiles and built sprites into a line buffer during horizontal blanking.⁴ Everything the artists did descends from that. For 16-colour tiles, the 256-entry colour memory split into eight background palettes and eight sprite palettes of 15 colours plus a transparent index; backgrounds used the first half of colour memory and sprites the second.²¹ Sprites came in 8, 16, 32, and 64 pixel squares, two sizes live at once, 128 of them in object memory, and no more than 32 sprites or 34 eight-pixel slivers on any one scanline before the rest dropped out.²¹ Backgrounds in the mode most RPGs used (Mode 1) were two 16-colour layers and one four-colour layer, and Mode 7 was a single 1,024-by-1,024-pixel tilemap of 256 tiles²² that an affine transform could tilt per scanline into a horizon.²³ Video memory was 64 KB in all, shared by tile maps, background tiles, and sprite tiles.²⁰

Memory on the cartridge was the other wall. Final Fantasy IV shipped on 8 megabits, Final Fantasy V on 16, Final Fantasy VI on 24, and Chrono Trigger on 32 after a late expansion from 24; Chrono Trigger’s director Takashi Tokita put the first number in scale, “you could fit four FFIV’s into this cart,” and of the added eight megabits its designer Yasuhiko Kamata said “about 6 of the 8 megs was used for graphics.”²⁴²⁵ Hironobu Sakaguchi described FF V’s last months as the staff “stealing whatever space they could from each other.”²⁶

Watch on YouTube ↗

What the constraints forced

The pose budget is the number I keep returning to. The sprite editor lists 17 animations and 13 static poses for each FF VI character, 46 unique poses in all and about 92 with flips, built from six tiles a pose and heavy sharing between poses; the walk and the other three-pose animations play 1-2-1-3, so the displayed cycle is four frames.¹ Yoshinori Kitase said FF VI had “more than double the patterns” of FF V, which is what let one sprite serve the field and the battle.⁷ Expression came from frames, not pixels.

Shibuya’s method

Kazuko Shibuya drew the sprites for Final Fantasy I through VI and directed the Pixel Remaster re-draws. Her account of the work is the clearest statement of method in the record. On where a sprite starts: “As a rule, I would say I start with surfaces rather than lines,” and then “I start by filling out lots of big areas roughly then sort of refine them down, like sculpting.”⁸ On readability: “Players have to tell the characters apart, so I look at the design and include only the most distinctive features.”²⁹ On why FF IV’s 16-by-16 sprites had no outlines: “each pixel was a matter of life or death so I didn’t have any leeway to think about using them in the outlines.”⁸ Sakaguchi added the consequence for animation: “they cannot lift their arms up very far, so the only way to make them express happiness is to spin around!”⁸

Watch on YouTube ↗

The illustrator and the pixel artist were different people with a text message between them. Sakaguchi: “When we order illustrations from Mr. Amano, we do it with text descriptions.”⁸ For Chrono Trigger, Akira Toriyama “only did the character illustrations and concept art,” and he never drew the rear views; the sprite team’s Uchiyama said, “We just had to guess.”³⁰ Tetsuya Nomura drew FF VI’s final boss in a sketchbook “screen by screen,” scanned it, and built the sprite from the scan.³¹ By 1994 the pipeline was already hybrid: magic effects were modelled in a separate 3D tool and then overlaid.³²

The three looks, measured

Writers call FF VI, Chrono Trigger, and Secret of Mana “the SNES look” as if it were one thing. It is three, and the difference is mostly outline policy. We took one lead character per game from a fan archive of per-animation rips, verified each was an exact 2× upscale, and classified every edge pixel of the standing frame as near-black (every channel at or below 40 of 255), mid-dark, or light.⁹

The softer edge was a stated intent in the Mana series. Koichi Ishii, on Seiken Densetsu 3: “For shadows and the like, we’re using deep blues and purples instead of shades of black, to impart a sense of softness,” and his sprite and background artists worked together so figures sat in the scene: “If you completely ignore the background when you’re creating the sprites, then the sense of orientation of the scene gets completely messed up.”³³ Chrono Trigger sat between, by design; its development kept the picture’s luminosity “between that of Secret of Mana and the Final Fantasy series.”³⁴ One rule, applied to every sprite in the game, is what makes a cast look like a cast.

The remaster lesson

The Pixel Remaster (2021 to 2022) kept the 16-by-24 base and gave it leeway above and to the sides so arms could extend and capes flutter; for FF VI Shibuya finally got the pixel she had wanted in 1994: “At the time, I desperately wished I could have just one more pixel on top. My wish came true in this remaster.”³⁵ The art was redone “with the intention of displaying it on an LCD screen,” because the originals were plotted for a CRT’s smear.³⁵ The controversy that followed was about typography, not sprites: the launch font was a thin modern face, and the pixel font that followed took about 7,500 Japanese characters to make.³⁶ The cautionary contrast is the 2014 mobile port of FF VI, whose smoothed redraws Kotaku described as looking “as if they’d been accidentally thrown in a washing machine.”³⁷ Draw for the screen you ship on, and treat the font as art.

2. Pokémon’s tile system, generation by generation

Square’s artists had sixteen colours and a 24-megabit cartridge. Game Freak’s had four shades and a Game Boy, and the system they built to cope is the clearest teaching example in the medium, because every generation of it is now readable in the pret decompilations. I read the numbers that follow from the source files, not from fan wikis.³⁸

The Game Boy draws a 160-by-144 screen from 8-by-8 tiles at two bits per pixel, four shades, with 40 hardware objects and no more than ten on any scanline.³⁹ Pokémon Red loads a tileset of up to 96 tiles, builds the world from 32-by-32 “blocks” of four-by-four tiles, and stores a town as one byte per block; no blockset in the game exceeds 128 blocks. Pallet Town is 10 by 9 blocks, which is 320 by 288 pixels, exactly two screens wide and two high.⁴⁰ Collision is a list of the 8-by-8 tile IDs you may stand on; the engine tests one tile, the lower-left of the cell in front of you.⁴¹ Water is a single tile whose sixteen bytes are bit-rotated one pixel right for four updates and left for four; flowers are one tile swapped between three stored frames in the pattern 1-1-2-3; the whole animation system fires about every twenty frames.⁴² A character is four 8-by-8 objects, drawn as six frames, a standing pose and a step pose for each of three facings, with right-facing frames made by flipping left, and for up and down the walk cycle is stand, step, stand, step-flipped, so one drawn step frame yields both legs.⁴³ The trick I like most costs nothing: when a sprite stands on the tileset’s grass tile, the engine sets the background-priority bit on its two lower objects, and the grass draws over the legs.⁶

Watch on YouTube ↗

Gold, Silver and Crystal kept the block format and spent the Game Boy Color’s new hardware on two things. Tilesets grew to 192 tiles across two VRAM banks, and every tile took one of eight named palettes (GRAY, RED, GREEN, WATER, YELLOW, BROWN, ROOF, TEXT). The palettes were defined separately for morning, day, night, dark and indoors, so time of day in Johto is a 64-byte palette reload, not a second set of art.⁴⁴ Collision moved to one typed byte per 16-by-16 quadrant of each block (FLOOR, WALL, TALL_GRASS, WATER, DOOR, LADDER and so on), which is the real reason Gen 2 plays as a 16-pixel game while storing 32-pixel blocks.⁴⁴ Variety came from palettes: the five “people” palettes share the same skin tone and differ only in one colour, so one sheet recoloured five ways populates a town.⁴⁵

Ruby, Sapphire and Emerald are the mature model, and the one a modern engine should copy. A tileset is 512 primary tiles shared by the whole region plus 512 secondary tiles per town, with thirteen 16-colour palettes between them. A metatile is sixteen bytes: eight GBA screen entries, two layers of two-by-two tiles, each entry carrying a tile ID, two flip bits and a palette. Its attribute word adds an eight-bit behaviour (tall grass, ledge, door, PC, 240 values in all) and a layer type: Normal, where the top layer covers sprites; Covered, where nothing does; Split, where the player walks between the two.² A map cell is sixteen bits, ten for the metatile, two for collision, four for elevation, and elevation 15 lets a bridge be walked over and under.⁴⁶ The overworld uses three hardware background layers for the map, scrolled together, and a fourth, fixed, for text, so a roof or canopy occludes the player by being on the layer with higher priority rather than by any sorting.² Littleroot is 20 by 20 metatiles, Petalburg 30 by 30, Rustboro 40 by 60, Lilycove 80 by 40.⁴⁷

Characters became 16 by 32, one hardware sprite each, in a 144-by-32 sheet of nine frames: three facings and two steps per direction, east flipped from west. The walk plays step, stand, step, stand at eight ticks each, which is the bob everyone remembers.⁴⁸ Tile animation runs off a frame counter: flowers on tick 0 of every sixteen, water on tick 1, the sand edge on tick 2, the waterfall on tick 3 and the land-water edge on tick 4, so the five DMA writes never land on the same frame.⁴⁹ Reflections are a copy of the sprite at the lowest priority, flipped by an affine matrix, with a swapped palette, offset by the sprite’s height minus two. Shadows exist only while a sprite is airborne, on a ledge hop or a bike jump. Tall grass is now a five-frame sprite spawned on the cell and layered over the player’s lower half.⁵⁰

Sources for the table are the pret repositories cited in this section.^4044248

Two more things from the record. The Game Boy Color card game, which is the closest ancestor to a card collector’s world, draws every card illustration at 64 by 48 pixels in a four-colour palette of its own, embedded with the tiles and assigned to one palette slot when displayed, so Charizard gets cream, orange, red and near-black while an energy card gets white, two olive greys and a near-black.⁵¹ The rule is not the size; the rule is one quantised palette per card, one fixed frame, one zoom level. And Ken Sugimori’s account of the discipline is the one to pin above the desk: “Pixel art is incredibly deep. If you change the location of just one pixel in a sprite, it can give an entirely different impression.”⁵² His sprites were, in his words, “easy to understand” symbols of more complex designs, because the screen was small and the storage smaller.⁵³ Red and Green shipped with about four programmers and fewer than ten artists.⁵⁴

3. The modern masters, and what “triple-A pixel art” costs

Since 2010 the best pixel-art games have been made by teams of one to twenty-five on hardware with no limits, so every constraint they kept was a choice. Their choices cluster.

They fix a canvas that integer-scales. Celeste’s 320 by 180 multiplies by six to 1080p; Pedro Medeiros: “That’s what I call my game canvas.”³ Sea of Stars renders at 640 by 360, and its “Pixel Perfect” option, as a player explains on the studio’s Steam FAQ thread, “will add a black border around the display so that the pixels will appear crisp rather than blurry.”⁵⁵ Animal Well is 320 by 180 and turns its scanline filter off when the viewport is too small to draw scanlines honestly.⁵⁶ Hyper Light Drifter is 480 by 270; Alx Preston: “Our game is 480p. It’s low resolution, and very intentionally so.”⁵⁷ Shovel Knight chose 400 by 240 to match the NES’s 240 visible lines, so, in Yacht Club’s words, “each Shovel Knight pixel is really 4.5×4.5 pixels at 1080p.”⁵⁸ Godot’s documentation now recommends 640 by 360 as the baseline because it scales to 720p, 1080p, 1440p and 4K without bars.⁵⁹

They never mix pixel densities. Medeiros’s rule for scaling: “you can only do this in 100% increments of the original image,” and when two densities are unavoidable, “elements at 100% and others at 200%, but never at 150%.”⁶⁰ Celeste goes further and keeps three “worlds” that never leak into one another: “Game, UI, and Map. Pixel art, high resolution, and 3D, respectively.”³ The UI is its own layer at its own scale, composited after the world is upscaled. Octopath Traveler on the first Switch rendered its world at 576p in handheld while keeping the UI at 720p, the same separation by a different route.⁶¹

They choose a lighting tier and pay for it. At the bottom, Moonlighter has no dynamic lighting at all; night in its town is “the superposition of sprites to give the impression of light.”¹⁰ One step up, Celeste draws every light as a mask into one 2,048-pixel texture, a grid of 64 slots with one colour channel per light, so 256 lights fit one texture and occluders cut their shadows out of the spotlight before the shader multiplies colour by mask.¹¹ Above that, Eastward is “a 3D game with a 2D perspective,” and its team “hand painted in the bump map one by one” for every asset so real lights could shade flat sprites.¹² Animal Well’s Billy Basso rejected engine point lights because their smooth gradients clash with pixel art, wrote his own rim-light shader, and runs a full-screen fluid simulation for smoke and water.⁶² Dead Cells gets normal maps free by rendering 3D models “in a very small size and without antialiasing” and shading them with a toon shader.⁶³ At the top, Sea of Stars spent its first six months building lighting that “appeared visually consistent with the pixel art,” and HD-2D puts sprite billboards in a lit Unreal scene with depth of field, bloom, colour grading, lens flares and vignette.⁶⁴⁶⁵ Tomoya Asano, who produces the HD-2D games, says it “costs more than you’d think.”¹³ And the players of Octopath Traveler II switch the depth of field and bloom off because “the edges of the screen would blur out hiding paths.”¹³

Watch on YouTube ↗

They animate with fewer frames than you think, and move colours instead. Dead Cells characters are fifty pixels tall, and Motion Twin’s 3D animation workflow had hit 30 frames a second on its earlier prototype, ScarKrow, before the pixelation step was added for Dead Cells.⁶³ Sub-pixel animation is the craft’s quiet weapon: to move a small sprite a small distance, “don’t move the sprite,” the tutorial says, “move its colors,” and six faded colours were enough to read a breath on its 50-pixel character.⁶⁶ Octopath mass-produced motions with Photoshop’s Puppet Warp and then corrected pixels by hand.⁶⁵ Animal Well animates its creatures procedurally, each limb on its own path, and Basso avoids squash-and-stretch and screen shake on purpose.⁶⁷

They lock a palette and share it. Raymond Schlitter’s method is ramps of nine swatches with a 20-degree hue shift per step and 45 degrees between ramps, desaturating at the bright end because otherwise “you’ll end up with intense eye burning colors.”⁶⁸ Cassette Beasts keeps 120 monsters coherent “by sharing the same pool of around 20 colours,” like an action-figure line with a fixed set of plastics.⁶⁹ Shovel Knight allows four or five colours plus transparency per sprite where the NES allowed three.⁵⁸ The community’s fixed palettes (Resurrect 64, Apollo, Endesga 32) exist because the discipline works.⁷⁰

They size the art to the team. Stardew Valley is one person and 16-by-16 tiles; Eric Barone on his next game: “Sticking with the 16×16 tile size helps keep the amount of art manageable for a game with such a big scope.”⁷¹ Sabotage Studio grew from seven people on The Messenger to about twenty-five on Sea of Stars.⁷² Animal Well is one person, seven years, a custom C++ engine, 33 megabytes, and a world of exactly 256 rooms because room IDs are one byte.⁷³ Eastward’s studio grew from its three founders to about twelve full-time people, with more than 200 characters, animated in Aseprite.⁷⁴ The Switch 2 removed the old handheld compromise: a 1080p handheld screen and 1080p or 4K TV output, so 320-by-180 and 640-by-360 canvases can be integer in either mode, and 4K output is capped at 60 frames.⁷⁵

4. The craft, as rules with numbers

What follows is the grammar of a three-quarter top-down town, as the practitioners state it. Where I have turned a practice into a number for our own use, I say so.

1. The view is an orthographic tilt, not a perspective. The LPC style guide puts the camera at “roughly 60 degrees” with no perspective; Schlitter describes the same view as looking at a house from 45 degrees above, where “you see about 3/4 of both the roof and facade,” and adds the governing clause: “uniformity takes priority over realism.”⁷⁶⁷⁷ Verticals stay vertical, the front face is foreshortened, the roof is not rotated, and every object obeys the same rules.
2. The grid is 16; the authoring rhythm is 32. Schlitter: “16x16px is probably the most common size and is sure to do your pixels justice.”⁷⁸ Stardew and the GBA games agree; Pokémon’s Game Boy blocks and LPC’s grid are 32. Author tiles and collide on 16, and design houses and large trees in pairs of tiles.
3. Layers solve the tall-tile problem. Stardew’s map layers, back to front, are Back (terrain), Buildings (collision), Paths, Front (“drawn on top of the player if the player is North of them but behind the player if the player is south”) and AlwaysFront.⁷⁹ Pokémon’s Normal, Covered and Split metatile types are the same idea with the sorting done by hardware priority.²
4. A terrain transition is 47 tiles. A blob set is “a 47 tile subset of a 2-edge 2-corner Wang tileset”; the bit weights are north 1, north-east 2, east 4, south-east 8, south 16, south-west 32, west 64, north-west 128, and a corner counts only when both of its edges do, which collapses 256 masks to 47 silhouettes.⁸⁰⁸¹ Fences and hedges are 16-tile edge sets. Tiled’s terrain sets and LDtk’s rule groups both implement these directly.⁸²⁸³
5. Trees are leaf bundles over a trunk, with the shadow underneath. Schlitter builds canopies from bundles whose base unit is “a small 2x2px square,” with “4 or 5 colors per bundle,” and places his trees “in staggered overlapping rows to create a solid forest pattern.” On shadows he is practical first: “It’s most practical for game design to center the shadow directly under the tree,” though he likes to “cast it off to one side for a more dynamic look”; shadows should be “subtle and not cast out long in any particular direction,” and of the drop shadows under his walls, “they should not exceed a tile in length.”⁸⁴
6. Colour is ramps, not swatches. Hue-shift toward warm as a ramp brightens and toward cool as it darkens, 20 degrees a step at most; saturation peaks mid-ramp.⁶⁸ LPC’s rule in three words: “No pure colors!”; shadows “towards the closest purple,” highlights “towards the closest yellow.”⁷⁶ Per sprite, Schlitter recommends “only about 5 colors” until shading is confident, and Cure’s law holds: “If you can’t make a good sprite in 4 colors, using 40 colors isn’t going to help.”⁸⁵⁸⁶
7. One outline rule, applied everywhere. LPC: world outlines “a darker version of the current color, or a dark color generally, not black”; character outlines “black or near black, no selective outlining.”⁷⁶ The SNES table in section 1 shows what happens when a studio picks differently; the point is to pick once.
8. Name the three mistakes and grep for them. Jaggies, a pixel out of a line’s rhythm; banding, “when neighbor pixels end at the same x or y coordinate on the underlying grid”; pillow shading, concentric bands that ignore the light.⁸⁶ Anti-alias only long shallow steps, never 45-degree or straight lines, and keep the softening inside the sprite’s own colours rather than against whatever lies behind it, since the game decides the backdrop.⁸⁶⁸⁷ Dithering on a 16-pixel world almost never: some sprites, as Pixel Parmesan puts it, “are simply too small to dither relative to the amount of detail they can possibly contain.”⁸⁸
9. Characters: three drawn directions, a four-step walk, an idle that moves. Stardew’s farmer is 16 by 32, drawn in a fixed order (body, pants, shirt, accessories, hair, hat, arms) with hats in 20-by-20 cells; the walk is four steps of three unique frames.⁸⁹⁹⁰ Pokémon Emerald’s is step, stand, step, stand.⁴⁸ Schlitter: the head “takes up a third to half of the total sprite,” draw up, down and side and mirror the side, and for idles, “It doesn’t even have to make sense, just move.”⁹¹⁹²
10. Text is art. Bitmap fonts render at integer multiples only; Daniel Linssen’s m5x7 page says “use font size 16, 32, 48, etc”.⁹³ Pokémon Emerald’s text-window frame is a 24-by-24 image, three by three hardware tiles, which is a nine-slice, and Aseprite’s slices carry the nine-patch centre into the export JSON.⁹⁴⁹⁵
11. Juice, in a calm world, is weather. The reference talks on screen shake and hit-stop were built around a shooter and a Breakout clone; a collector’s town wants Stardew’s weather vocabulary (sun, rain, storm, wind with pollen or leaves, snow) and footsteps that come from a tile property rather than new art.⁹⁶⁹⁷⁹⁸
12. The pipeline is a build step. Aseprite’s command line exports packed sheets with JSON (--sheet-type packed --shape-padding 2 --extrude --format json-array --list-tags --list-slices), and the two-pixel padding plus extrusion guards each frame’s edges against bleeding from the frame beside it.⁹⁹¹⁰⁰

Watch on YouTube ↗

5. The Apple way: three architectures, one recipe, and the arithmetic

Our problem has two halves that pull against each other. The world wants integer-scaled, nearest-sampled, unlit texels placed on whole pixels. The one thing in it that is real, the collector’s favourite card, wants to be a shaded 3D object that rises out of the flat world and is covered by the shelf it sits on, which means it must live in the same depth buffer as the tiles. Any design that composites the card as a second layer loses that occlusion and fakes the moment. Three Apple architectures can hold both halves, with different costs.

For a pure 2D game SpriteKit is still the fastest path, and it is maintained, not deprecated. For a world that needs one true 3D object, RealityKit is the right engine, and every pixel-art requirement has a documented API. Metal is the escape hatch for the two things RealityKit cannot promise, 120 Hz and panel-exact scaling; the documented step is RealityRenderer, which renders the same entities into your own texture for a nearest upscale pass you present yourself.¹¹⁰

The recipe

// One texel is k device pixels, with k a whole number. Pixels, not points.
let pixelsTall = Float(size.height * displayScale)
let k = max(1, (pixelsTall / (20 * 16)).rounded(.down))   // aim for about 20 tiles tall
let worldTall = pixelsTall / k                            // world units are texels
var camera = OrthographicCameraComponent()
camera.scale = worldTall / 2                        // measured: scale is half the view's height
cameraEntity.components.set(camera)

// Nearest sampling, no mipmaps, alpha test instead of blending.
let sampler = MTLSamplerDescriptor()
sampler.minFilter = .nearest
sampler.magFilter = .nearest
sampler.mipFilter = .notMipmapped
let texture = try TextureResource(image: sheet, options: .init(semantic: .color, mipmapsMode: .none))
var material = UnlitMaterial()
material.color = .init(tint: .white, texture: .init(texture, sampler: .init(sampler)))
material.opacityThreshold = 0.5
material.textureCoordinateTransform = .init(
    offset: [Float(col) / Float(cols), 1 - Float(row + 1) / Float(rows)],
    scale: [1 / Float(cols), 1 / Float(rows)], rotation: 0)

// Switch the AR defaults off.
content.renderingEffects.motionBlur = .disabled
content.renderingEffects.depthOfField = .disabled
content.renderingEffects.cameraGrain = .disabled
content.renderingEffects.antialiasing = .none
content.renderingEffects.dynamicRange = .standard

Three notes on that code. Apple documents OrthographicCameraComponent.scale only as “A floating-point value the camera uses to scale entities”; the half-height relationship is ours, measured on the simulator (320 world units spanned 746.67 points at 3× with seven pixels per texel, which is 320 × 7 ÷ 3).¹⁰⁴ opacityThreshold is the cut-out path pixel art wants: “RealityKit discards pixels with opacity values less than the opacityThreshold” and renders the rest fully opaque, so there is no edge blending and no sort-order problem.¹⁵ And the defaults matter more than any sampler: RealityView “applies an effect that introduces motion blur for virtual objects” and “a high dynamic range effect, along with tone mapping” unless you turn them off.¹⁶ Our walkers were smeared mid-step until we did. Every sprite’s x and y and the camera are rounded to whole world units each frame, after easing, so no texel sits between pixels, while depth and the 3D card’s motion stay continuous; and because of the forum-reported projection bug we compute the tap’s world point ourselves from the camera position, k and the display scale rather than asking RealityKit.¹⁰⁵¹⁰⁷

The scaling arithmetic

The 3× scale factor has no relationship to a 16-pixel grid; what matters is the pixel count. With 16-texel tiles and a target of about twenty tiles top to bottom, k = floor(pixelsTall ÷ 320). Two strategies follow from the remainder: fit as many tiles as fit (wide screens see more world, no bars), or hold exactly twenty tall and give the rest to bars. Every row below is computed from Apple’s spec pages and the Xcode 27 simulator profiles.¹⁷¹¹⁸

None of these heights divides by 320, so on current devices “exactly twenty tiles” always means bars; 2868 ÷ 320 = 8.96 on the 18 Pro Max is the closest any of them comes to a clean 9. The HIG asks games to “look good and behave well at various aspect ratios” and to “Design for the full-screen experience,” which argues for showing more world rather than bars, and that is what we do in the plaza, while rooms shown whole centre themselves instead.¹¹⁵ At k = 8 on a 3× display a five-texel font is 13.3 points and at k = 6 it is 10 points, under the HIG’s 11-point minimum, so the dialogue text lives in SwiftUI at UI scale rather than in the world.¹¹⁵ For pixel-art icons and nine-slice frames inside that SwiftUI chrome, Image.interpolation(.none) keeps them crisp.¹¹⁶

The iPhone Duo’s inner display is the one place the arithmetic is not finished. Apple’s spec sheet gives the panel as 1878 by 2670 pixels; the simulator profile gives the logical framebuffer as 2007 by 2853 at scale 3.0, so UIKit renders 669 by 951 points at 3× and the compositor must downsample by about 0.936 to the glass, which is exactly the behaviour Apple’s Technical Q&A QA1909 describes for Plus-class phones. That puts UIScreen.nativeScale near 2.807, and six logical pixels per texel become about 5.6 panel pixels.^17112120 The plaza looks right in the simulator, which shows the logical framebuffer, and will be very slightly soft on hardware; only a Metal-owned drawable at nativeBounds avoids it, and the first step is to log nativeScale on a device. The outer display divides cleanly (1398 ÷ 466 = 3.0).

Two bugs we found, and one capture artefact

The card viewer went black on its second and third openings while its scene was identical, frame for frame, to the first. The cause was an opacity animation on a SwiftUI view that contained the RealityView’s Metal layer; animating .opacity across that boundary left the layer unpainted. The fix was to stop animating the view and fade a black veil overlay out instead. Under a loaded simulator the first paint still arrives late, by as much as twelve seconds, so our UI walk reads the last of a series of timed brightness samples rather than the first.

The second was in our tools, not the renderer. When you capture the Duo simulator’s inner display from the host (xcrun simctl io <udid> screenshot --display=primary-1), the image refreshes only when Core Animation re-composites; RealityKit frames alone do not trigger it, so a walking player looks frozen in the captures while moving on screen. Capturing from inside the test bundle via XCUIScreen.screens[1] shows the truth. Both of these cost a day each and neither is in any document I could find, which is the reason they are here.

6. The case study: judging our plaza, then rebuilding it by rule

Here is the honest audit of Kiradex World as it shipped in TestFlight build 18, held against sections 1 to 4. The ground was a 28-tile set of ad-hoc colours typed into text grids, flat colour with no ramps and no agreed light. The collector was a 48-by-96 sheet with a two-frame walk, no idle, no shadow, and an outline policy that changed per sprite. There was no overhead layer, so nothing could pass behind a canopy or under a roof; no autotiles, so every lawn-to-path edge was a ruler; no elevation. The engine underneath was sound (one mesh for the map, nearest sampling, integer scale, the card in the same depth buffer), and the art on top of it would have embarrassed a Game Boy.

The brief

The spec that follows is ours, derived from the sourced practices above; where a number is a recommendation rather than a fact, it is a recommendation.

• Projection and grid. Orthographic three-quarter view, one light from the top left, verticals vertical. Tiles 16 by 16; houses and large trees on a 32-pixel rhythm; rooms 10-by-8 to 12-by-9 tiles; the town between Petalburg’s 30 by 30 and Rustboro’s 40 by 60.
• Layers, in draw order. Ground (autotiled lawn, path, plaza stone, water), detail (variants, flowers, baked shadows), objects (y-sorted by their base: people, benches, lamps, trunks, facades, with collision), overhead (roofs, canopies, railings, always above people), lights (additive lamp sprites, swapped at dusk), weather, and the UI at its own scale. Stardew’s five layers, with Pokémon’s Normal case, the top layer over the player, as the overhead.
• Autotiles. 47-tile blob sets for lawn-to-path, lawn-to-water, lawn-to-cliff and plaza-to-path; 16-tile edge sets for fences and hedges; three lawn variants weighted so the repetition hides. Water four frames at 250 ms (Emerald’s eight steps at sixteen ticks is the reference cadence); flowers two frames; lamps two states plus a night flicker.
• Palette. One master palette, 48 to 64 colours in six to eight hue-shifted ramps, saturation peaking mid-ramp, no pure colours, interiors from the cooler half. At most eight colours per sprite and six per tile. Dusk and night as one multiply tint over the world plus hand-drawn emissive variants for lamps, windows and the kiosk sign.
• Characters. A 16-wide, 24-tall figure in a 16-by-32 cell, head nine to ten pixels, one-pixel eyes, no mouth, feet on the bottom tile so y-sorting uses the base, eight pixels of headroom for hats and the raised card. Three drawn directions and a mirrored fourth, with a drawn right-facing set only for the card raise because a held card is asymmetric. Walk four frames at 125 ms; idle a two-frame one-pixel bob; raise-card three frames (anticipation, raise, hold). Paper-doll layers in Stardew’s order, each a full sheet on the body’s grid, hats anchored per direction. A 12-by-4 blob shadow under every person and tree.
• Outlines. Near-black on characters, dark local colour on the world, never inside a tile.
• Text. m5x7 at integer multiples in a 24-by-24 nine-slice box, two lines, typewriter reveal, a two-frame advance arrow. The one deliberate exception to the pixel density is the collector’s real card: the shaded 3D card the engine already raises over the player, three tiles tall, in the same scene. The small card in the raised hand is a sprite on the held layer, and the two never pretend to be the same object.

The forge

We are not drawing this art in an image editor, and we are not generating it from prompts. The U.S. Copyright Office’s January 2025 report concludes that “prompts do not alone provide sufficient control” for authorship, and a tileset without an author is a tileset anyone may lift from the app; the same report protects “creative modifications of the outputs” and work where AI assists rather than stands in.¹⁸ Circular 33 puts ideas, procedures, systems and methods of operation outside copyright, which is where a projection, a tile size and a layer scheme live, while specific tiles and sprites are protected expression, and names are protected, if at all, as trademarks; so the clean path is to own every pixel’s provenance.¹⁹ Our forge is a small Python program under scripts/forge/ that draws every tile and sprite from hand-set rules against one master palette. The palette module builds 58 colours in fourteen hue-shifted ramps and exports a GIMP palette file for review. The raster is indexed: a sprite is a grid of colour names, and a pixel can only ever be a palette entry or one of nine marker colours the app recolours per collector. The terrain module draws lawn, packed earth, flagstones and water, then generates all 47 blob transitions by painting the outer terrain over the inner one along a wobbling boundary with rounded outer corners and a rim colour. Every random choice is a fixed hash of its position, so a rebuild is identical byte for byte, and every rule is a line of code a person wrote and can defend.

The first field was the proof the method works at all. The characters and the 28 tiles the engine names followed in the same program the next morning: a 16-by-24 figure in a 16-by-32 cell, drawn as body, hair, hat and held-card layers that keep the marker colours the app swaps for each collector’s look, with a two-frame idle, a four-frame walk and a three-frame card raise; trees as leaf bundles over a trunk with the shadow underneath; a plaster wall that carries no baseboard because the same tile fills the masonry beyond a room and a baseboard stripes the whole screen; water in four frames the ground steps through four times a second. The capture below is the simulator walk that passed with them. The plaza still lays the engine’s 28 named tiles, so its side edges stay straight until the JSON maps bring the blob sets.

Rooms, the hall, props and the larger town follow in the same program, with Aseprite-compatible sheets and JSON out the other end so the Swift loader never changes when the art does.

What the world will do

The art program is in service of mechanics, and the research into collecting games changed the order of work. The showcase is the card: the world stays matte and the real card is the only shaded object, because in Pokémon TCG Pocket a one-card display board and a thirty-card album are showcase enough for a game downloaded more than a hundred million times.¹²⁹ Rooms get a furnishing cap of sixteen, the Secret Base number, because a cap is what turns a shelf into a composition; visits are read-only, a like is once a day, and the room’s total never decreases, which is Club Penguin’s rule for igloos.¹²²¹²⁴ Visitors earn a flag per room with ranks at 30, 100 and 500, the ranks ORAS used to make walking into strangers’ bases the main verb.¹²⁵ A report arrives every Sunday grading the room, with its point sources listed, the Happy Home Academy’s rhythm.¹²³ The weekly hall borrows Stardew’s grange display, not Pokémon’s contests: nine pedestals, a base score, a diversity bonus across eras and sets, item points from the scan record, three thresholds, and judging a stranger can understand at a glance.¹²¹ Chat stays a tree of preset lines (greetings, answers, collecting talk, reactions) with vocabulary unlocked by play, the way Emerald’s Hipster unlocked one Trendy Saying each time record mixing brought him; never typed text, because Club Penguin’s word filter blocked “mom” and still, by its own help pages, let some offensive messages through,¹³³¹²⁴ and the FTC’s 2022 order required Epic to turn voice and text chat off by default for children and teens.^126124131 One small gift per friend per day, with friendship ranks at 1, 7, 30 and 90 days, is Pokémon GO’s ladder.¹²⁷ Patron flair stays on the name-plate and the room skin and never touches a pedestal slot or a judging bonus; the cozy-games paper’s warning that “fanciness can often create social comparison pressure” is the limit.¹²⁸ Nothing random is ever sold.

The engine work that follows the art: layered tile maps loaded from JSON instead of hard-coded rows, animated tiles on a shared cadence, an overhead layer with y-sorted occlusion, paper-doll sprites composed per frame, and the server’s map, NPC and parity tables updated to match.

Since publishing

October 3, 2026, later the same day. The JSON maps landed. The plaza is now a 40-by-30 town the forge exports with its ground autotiled from the blob sets (so the path’s side edges wobble too), the woods drawn twelve tiles out as a second index map, and one map of letters, exported to the app and the server alike, which the app reads for feet and triggers and the server for feet. The same pass added the town’s furniture, drawn by the same rules: a fence that encloses the whole map and turns its corners (a sixteen-piece edge set), hedges, lamp posts whose heads glow after dark beside the kiosk’s screen, a fountain in the square, rocks, bushes, a stump, a crate, a barrel and a signpost; and the ground stopped repeating, with eight lawn variants, four path and four stone. The capture below is the walk that passed with it.

Two things this guide does not settle are getting their own research and their own posts: the people, whose chunky figure still reads as a toy and whose clothes, hair and customization deserve the depth the masters gave them, and the buildings, which are single tiles here and should be modular, multi-tile structures with interiors and floors. When those posts exist, the links will appear here.

Key Takeaways

If you draw the art

• Fix the cell, the palette and the light before the first tile: 16-by-16 tiles, a 16-by-24 figure in a 16-by-32 cell, 48 to 64 colours in hue-shifted ramps, light from the top left. Every master in this guide worked from the constraint outward.
• Pick one outline rule and apply it to the whole cast. FF VI’s 93 percent black edge and Secret of Mana’s zero percent are both coherent; a cast that mixes them is not.⁹
• Spend frames on expression and colours on motion: FF VI’s 46 poses, Emerald’s step-stand-step-stand, and sub-pixel animation that moves colours rather than the sprite.¹⁴⁸⁶⁶
• Transitions are 47 tiles; fences are 16; trees are leaf bundles with the shadow directly beneath. Draw the rule once and let the editor place it.⁸⁰⁸⁴

If you build it on Apple platforms

• Stay in RealityKit when one object must be real 3D in a flat world; it shares the depth buffer, and every pixel-art need has a documented API. Choose SpriteKit for a pure 2D game, and keep RealityRenderer as the Metal escape hatch for 120 Hz and panel-exact pixels.¹⁴¹¹⁰
• Switch the AR defaults off on day one: motion blur and HDR tone mapping are on unless you disable them, and the recipe sets depth of field, camera grain and antialiasing off as well, since each would smear texels.¹⁶
• Do the scale arithmetic in pixels: k = floor(pixelsTall ÷ 320), round every sprite’s x and y and the camera to whole world units, and read UIScreen.nativeScale on real hardware before trusting the simulator, especially on iPhone Duo.¹¹²¹¹⁸
• In our RealityView, animating the containing view’s opacity left it black; fade a veil over it instead. Capture the Duo’s inner display from inside the test bundle, not from the host. Add LSSupportsGameMode so Game Mode “minimizes background activity for smoother gameplay and more consistent frame rates.”¹¹⁷

If you run the studio

• Match the art scale to the team: Eric Barone keeps 16-by-16 tiles so one person can draw a Stardew-sized world, and Sabotage grew from seven people to about 25 while making Sea of Stars.⁷¹⁷²
• Choose the Moonlighter-to-Celeste lighting tier unless you have six months of engine time; the HD-2D tier “costs more than you’d think” and its own players turn the effects off.¹⁰¹¹¹³
• Own the provenance of every pixel. Purely prompt-generated art is not protectable, by the Copyright Office’s own conclusion, and mixed cases are judged one by one; hand-drawn art, and art drawn by rules a person wrote, keeps a human author’s provenance.¹⁸
• In a world for collectors, make the collected thing the only glossy object, cap the room, grade it on Sundays, let likes only go up, and never type: Daniel Cook’s “Remove chat and you remove 95% of all positive social behavior” is true, which is why the preset lines have to carry the answers a kid would otherwise type.¹³⁰

FAQ

What tile size should a top-down pixel-art game use?

Sixteen by sixteen. It is the cell Pokémon has used since the Game Boy’s 16-pixel walk square, the cell Stardew Valley is built on, and the one Raymond Schlitter calls “the most balanced size to work with.”^4079132 Characters sit in a 16-by-32 cell with the body about 24 pixels tall; houses and large trees are designed in pairs of tiles.

SpriteKit or RealityKit for pixel art on iOS?

SpriteKit for a game with no 3D object: tile maps with adjacency rules, lights with normal maps, and filteringMode = .nearest is the whole fix.¹⁰¹¹⁰² RealityKit when one thing in the scene must be shaded 3D in the same depth buffer as the tiles; an orthographic camera, UnlitMaterial with an explicit blend mode or an opacity threshold, a nearest sampler and no mipmaps are all documented, and iOS 26 adds instancing and a post-processing hook.^104106108109 SpriteKit’s one 3D bridge, SK3DNode, rests on SceneKit, which Apple put into maintenance mode at WWDC25.¹⁰³

How do you get integer scaling on an iPhone screen?

Work in pixels. Multiply the view’s points by displayScale, divide the height by 320 (twenty tiles of sixteen), take the floor, and that is your device pixels per texel: 8 on an iPhone 18 Pro Max, 6 on the open iPhone Duo, the 13-inch iPad Pro and a 4K Apple TV.¹⁷¹¹⁹ Round the camera and every sprite’s x and y to whole world units each frame. Decide whether the remainder becomes more visible world or letterbox bars; no current iPhone height divides by 320. On iPhone Duo’s inner display, check UIScreen.nativeScale on hardware, because the panel’s 1878-by-2670 pixels do not match the 2007-by-2853 framebuffer the simulator shows.¹¹²

Can AI generate the pixel art for a game?

It can generate images; prompts alone do not give you a copyright in what they generate. The U.S. Copyright Office’s 2025 report concludes that purely AI-generated material is not protected and that “prompts do not alone provide sufficient control,” while human creative modifications of an output and AI used “to assist rather than stand in for human creativity” are protected.¹⁸ For a shipping game the practical consequence is that a tileset generated wholesale from prompts, with no human expression added, has no copyright to enforce, and its training provenance is unknowable; where a person did add expression, the Office judges the contribution case by case. Draw it, or write the rules that draw it, and document which is which.

Where is the legal line for a world “inspired by Pokémon”?

Style, method and system are not protected; specific expression is. Circular 33 excludes “any idea, procedure, process, system, method of operation, concept, principle, or discovery” from copyright.¹⁹ A three-quarter town of 16-pixel tiles, two-layer metatiles, a step-stand walk and a 47-tile shoreline is a method. Pallet Town’s tiles, the creatures, the Poké Ball and the type symbols are expression, and the names are trademarks. Kiradex draws every tile and sprite from its own rules in its own palette, and the only Pokémon imagery anywhere in the app is the real card the user scanned.

Why does a terrain transition need exactly 47 tiles?

Because a tile’s appearance depends on eight neighbours (four edges and four corners), which is 256 combinations, but a corner only matters when both of the edges beside it are also present. Collapsing the 256 masks under that rule leaves 47 distinct silhouettes, which is why Tiled’s documentation names “the 47-tile Blob tileset” as the usual reduced form of a mixed set.⁸⁰⁸¹⁸²

How this guide was made. The six research dossiers behind it were compiled with Claude agents on October 2, 2026, and every number in the text was then re-read from the primary source named in the notes: the pret decompilations, Apple’s documentation (through its JSON endpoints), the developers’ own talks and posts, and translated interviews at Shmuplations, Nova Crystallis and Lava Cut Content. The sprite measurements, the scaling arithmetic, the RealityKit camera measurement and the Kiradex forge are my own work and are labelled as such. Where a claim rests on a single source, the note says so.

Related on this site: iPhone Duo for Developers derives the inner display’s point size and the 1.42 ratio the scaling table above rests on; Prepare Your App for iPhone Duo is the worked example of the fold, the reserved regions and the HUD rules the plaza now follows; Xcode 27.1 Beta: Your App in the iPhone Duo Simulator covers the simulator and the Device Hub poses the captures came from; RealityKit and the Spatial Mental Model is the RealityKit grounding for section 5; Metal 4 Essentials covers the API the escape hatch would be built on; and Recreating MacPaint in the Browser is the last time I rebuilt a pixel renderer from a primary source.

Sources