Your project is quite impressive. And welcome to the world of computer graphics! I'd consider taking inspiration from the following sources: 1. GUI toolkits l

Your project is quite impressive. And welcome to the world of computer graphics! I'd consider taking inspiration from the following sources: 1. GUI toolkits like QT QML [1] or Android [2]. These typically build a hierarchical tree of different components (eg: start with a root window, which contains panes, which in turn contain text and buttons). Each component may contain different properties (eg: font, color), and properties may be inherited from the parent component. Advantages: + preserves semantics of component properties and how they are linked to each other (eg: the caption is below the image) Disadvantages: - complexity: building a layout/constraint engine can be difficult, or alternatively you can use absolute positioning with relative offsets which can be tedious to use (in this case the layer-based approach below might make more sense). [1] https://en.wikipedia.org/wiki/QML https://en.wikipedia.org/wiki/QML [2] https://developer.android.com/guide/topics/ui/declaring-layout https://developer.android.com/guide/topics/ui/declaring-layo... 2. Graphical editor programs like Gimp or Photoshop, or Adobe Flash. These build up a screen as a collection of vertically stacked layers or assets (eg: graphics, text, etc) with attached properties and optionally bounding boxes. Higher layers/assets occlude the content of the layers below them, so you would need to implement some kind of visibility logic. Advantages: + simplicity + you can use identifiers for assets, and therefore don't need to perform pixel-by-pixel comparisons. Disadvantages: - may lose some information about how different components are related to each other Also, rather than a raster pixel-based representation, it might make sense to use a vector representation internally [3]. The most popular vector representation is SVG. The full spec is very verbose, so you probably only want to implement a small subset of it. This would permit you to specify properties like line thickness, color, striped/dotted patterns. At render time, you could convert the (proportional) fonts to vectors as well for consistency, and then rasterize the entire scene when rendering to a display surface. But for testing, it would be better to use the scene graph / vector format which is easier for users to reason about. [3] https://en.wikipedia.org/wiki/Vector_graphics https://en.wikipedia.org/wiki/Vector_graphics [4] http://blog.leahhanson.us/post/recursecenter2016/haiku_icons.html http://blog.leahhanson.us/post/recursecenter2016/haiku_icons... But perhaps this is over-complicating things.