diff --git a/src/main.zig b/src/main.zig
index be735b8..f877f82 100644
--- a/src/main.zig
+++ b/src/main.zig
@@ -28,22 +28,31 @@ pub fn main() !void {
         // skip own executable name
         _ = arg_it.skip();
     }
+    // tui creation
+    errdefer |err| log.err("Application Error: {any}", .{err});
 
     var threaded_io: std.Io.Threaded = .init(allocator);
     errdefer threaded_io.deinit();
     const io = threaded_io.io();
-    errdefer |err| log.err("Application Error: {any}", .{err});
 
     var renderer = zterm.Renderer.Buffered.init(allocator);
     defer renderer.deinit();
 
     var app: App = .init(io, .init);
 
-    var root = try tui_diff.Container(App, allocator);
+    var element_root: tui_diff.elements.Root(App) = .init;
+    var element_tree: tui_diff.elements.Tree(App) = .init;
+    var changes: [3]tui_diff.elements.Change(App) = @splat(.init);
+    var scrollable_diffs = try tui_diff.elements.Diff(App, allocator, &changes);
+    // NOTE scrollable should provide deinit function (*zterm*)
+    // -> `Container` of `Scrollable` does not pass through the `minSize` request to its children!
+
+    var root = try tui_diff.Container(App, allocator, &element_root, &element_tree, &scrollable_diffs);
     defer root.deinit(); // also de-initializes the children
 
     try app.start();
     defer app.stop() catch |err| log.err("Failed to stop application: {any}", .{err});
+    // defer app.model.deinit();
 
     // event loop
     loop: while (true) {
diff --git a/src/model.zig b/src/model.zig
index b319090..b402c51 100644
--- a/src/model.zig
+++ b/src/model.zig
@@ -1,9 +1,32 @@
 //! Model of the `zterm` application.
 
 // TODO planned features:
+// - create change sets (i.e. parse diff headers and provide contents) is the multiarray that what I need?
+// - create `elements.Change` structs which each point to every change associated to a given file (for each file)
 
 // FIX known issues:
 
-const Model = @This();
+content: []const u8,
+changes: std.MultiArrayList(Change) = .empty,
+render_mode: enum {
+    side_by_side,
+    stacked,
+} = .stacked,
 
-pub const init: @This() = .{};
+// TODO alloc-free parsing? (similar to how I've implemented the parser for `smd`?)
+pub const init: Model = .{
+    .content = &.{},
+};
+
+pub const Index = struct {
+    idx: usize,
+    len: usize,
+};
+
+pub const Change = struct {
+    file: Index,
+    diff: Index,
+};
+
+const Model = @This();
+const std = @import("std");
diff --git a/src/root.zig b/src/root.zig
index 451b1ca..3d2c246 100644
--- a/src/root.zig
+++ b/src/root.zig
@@ -6,15 +6,24 @@
 
 pub const Event = union(enum) {};
 
-pub fn Container(App: type, gpa: Allocator) !App.Container {
-    // TODO create container structure
-    // -> might require some additional arguments
-    return try .init(gpa, .{}, .{});
+pub fn Container(App: type, gpa: Allocator, element: *elements.Root(App), tree: *elements.Tree(App), diffs: *App.Scrollable) !App.Container {
+    var root: App.Container = try .init(gpa, .{
+        .layout = .{
+            .direction = .horizontal,
+            .separator = .{
+                .enabled = true,
+            },
+        },
+    }, element.element());
+    try root.append(try .init(gpa, .{}, tree.element()));
+    try root.append(try .init(gpa, .{}, diffs.element()));
+    return root;
 }
 
 const std = @import("std");
 const Allocator = std.mem.Allocator;
 
+pub const elements = @import("elements.zig");
 pub const Model = @import("model.zig");
 
 test {