Skip to article
James Dimachkie
Menu
Behind this website

How this place came to be

James DimachkieBehind this website, design and development5 min read

I used AI to explore and build this portfolio. This account follows the early ink experiments, the directions I rejected and the paper workshop that became the film.

An overhead study of a camera rail connecting four different paper rooms.

Four decisions behind the site

I widened the brief, kept the drawn world when a reconstruction lost it, gave the camera a continuous journey, and checked the page after the tools said it was finished. The archive below shows the alternatives behind those choices.

My role, and the tools’ role

I directed the briefs, chose between alternatives, corrected interpretations, and decided what belonged. AI systems assisted with design exploration, writing, implementation, and review. Higgsfield generated the workshop illustrations and film. The later valley illustration was generated separately. I explored layouts in Figma and Wonder; the site uses React and TanStack Start.

Checking playback and phone framing

The phone framing follows the subject through the same timeline. Chapter posters come from their corresponding film frames. At the end, the text clears so the whole workshop can be seen before the projects begin. The illustrations elsewhere have their own subjects, with small gestures that wait until the reader reaches them.

Scroll playback required changes to timing and video encoding. The resulting files were larger, so the film now loads only when a visitor opens it. The note on verification follows one failure that ordinary file checks missed.

The film follows native scrolling, with chapter controls and reduced-motion support. Work, notes, and contact remain directly accessible.

The question behind the site

I wanted the site to show how I work, as well as what I make. The early brief was a site for my independent web work. It needed to explain what I could help with and show the judgment behind the result. The brief eventually widened to include software, research, creative experiments, and writing.

The surviving drafts run from late July to September 2026. They include image concepts, working prototypes, design canvases, and exported sites. Looking back through them, I can see the same problem being approached in different ways: how much of the machinery should a visitor have to understand?

July 29, Competing concepts

The first visual concepts

Nine full-page mockups survive from the first export series. They tried flowing lines, print registration, interface repair, and the production system itself as visual subjects. The examples below show two of those competing proposals.

The written handoff recommended combining a clear structure, visual restraint, and one concentrated transformation. I kept returning to warm paper, blue ink, an accent that marks a decision and a page that stays readable around the illustration.

A working prototype took the repair metaphor literally: the visitor could break the page, and a swarm of dots carried the pieces home. It was an interaction experiment that preceded the ink-character direction.

July 30–31, Drawings and prototypes

Trying the ink drawings

I moved from the swarm to a small drawn world: a determined figure, an enormous tangle, and objects for making, inspecting, and remembering. Other prototypes tried telling the story through typography. One replayed the site’s own making as part of the page; I did not keep that direction.

Color took a few attempts. Periwinkle alone felt too sparse, but filling everything with accents overwhelmed the drawing. I settled on sparse hints of coral and yellow throughout. Those small decisions helped the illustrations feel like a family without making every scene look identical.

An early blue-ink drawing of a determined figure pulling an enormous tangled ball, with periwinkle on the figure’s shirt.
Original ink-world asset, July 2026. The tangle and small cast predate the current film. Open full image

Late July–early August, The building

Deciding what the building added

The second direction imagined the back of a website as a building full of work. Working labs explored a loupe, lighting, a continuous tower, and a crew inhabiting its floors. Keeping the polished front separate from the machinery behind it began to feel like a gimmick. I asked for the building and the page to be brought together.

That led to a merged hero, responsive studies, and a fuller Figma composition. A separate reconstruction replaced the illustrated world with diagrammatic scaffolding. I rejected it: the brief was to refine the world I had chosen. A later architecture study was also rejected. Neither became the accepted design.

I then questioned the premise again: the whole website could not be about the building at the expense of the work. Five new Wonder concepts put the projects first. A combined proposal led to a static foundation, with the building deliberately set aside.

An original browser-shaped cutaway building with workers researching, making, inspecting, and filing work on different floors.
“Backside of the UI” subject study, July 31. The building made the work behind a finished page visible. Open full image

August 4–6, Exporting and combining

Combining the exported site and film

After the Prompt began as a separate experience about the system behind the work, intended as a deeper route behind the freelance homepage. Its Claude Design export was organized into acts about translating a brief, making, reviewing, and keeping a record. It also explored an industrial process-film direction. I chose the exported site as the baseline to work from.

A Higgsfield web-builder version returned to the illustrated world and brought it into film. The local implementation combined that film with parts of the earlier story and camera movement.

The first film implementation replayed the whole journey in every chapter. Dividing it into continuous sections gave the story a direction. A new final movement pulled back to reveal the building as one connected machine. Portrait versions and matching still frames made the same sequence usable on a phone.

September 5, A broader portfolio

Making the camera move through the workshop

In September, I changed the brief from web-builder marketing to a broader home for my work with AI. The site gained individual work and writing pages. The paper world stayed, with rooms for exploring, making, inspecting, and remembering, connected by a red thread.

The first new films stayed close to a notebook. They had the right materials, but scrolling through them did not feel like going anywhere. I wanted more world-building and a camera with a journey. Two new films were compared; the selected one connected the spaces more convincingly.

One abrupt cut still broke the continuity. A separate transition, guided by the frames on either side, turned it into a movement around the maker’s shoulder. That edit became the nineteen-second journey preserved in the optional film here.

A frame from the current film reveals the connected paper workshop and its rooms as one cutaway world.
A frame from the current film’s final reveal. The camera now has a whole world to travel through. Open full image

What the site became

That version brought the work and writing together with an illustrated opening and readable project pages. I kept the loose drawing style through the revisions, while asking what each finished piece actually showed. The workshop film is now optional, under Inside the atelier.

This account was reconstructed from the saved drafts, decision notes, exports, and implementation history. It documents the making of the site, with the dead ends included.

Return to the website’s story