BUILD LOG · 003

I Didn’t Want a Pretty Portfolio. I Wanted a Decision Machine.

From portfolio to interactive system: how I turned Approach and Work into an experience that makes conditions, decisions, capabilities, and evidence visible.

  • Interaction design
  • GSAP
  • Accessibility

The problem was not a lack of design

The portfolio could already show projects and explain my profile. The limit was different: important routes could still feel like pages placed next to one another, rather than parts of a shared criterion.

I wanted the interface to answer a more useful question than “does it look good?”: how do I take in a need, which conditions do I review, and what evidence supports the work I can deliver?

The decision: make navigation continuous

Home became an origin point. Its two exits are not isolated buttons: they lead to process or evidence. Composition, branches, and focus states exist so those two decisions can be understood before a visitor clicks.

The goal was not motion for its own sake. Every signal had to reinforce a real relationship: origin, channel, and destination.

Approach: INPUT → CONTROL → FLOW

In Approach, the valve makes it possible to show that a project does not go directly from a request to an interface. Context enters first; scope, information, and access are reviewed next; only then can the flow continue.

The three controls do not stand in for fictional metrics. They are honest conditions that commonly change the work: a route narrows, a source needs validation, or an integration is blocked by pending access. HTML keeps the controls real; the material machine and SVG only make their consequence visible.

Work: capability → route commit → evidence terminals

In Work, the selected capability commits a route and reveals the evidence that supports it. The split between applied and laboratory work does not try to make projects with different contexts look equal. It separates deliveries, self-directed work, and technical exploration without presenting experiments as clients.

Industrial evidence remains reserved where it should. I do not compensate for confidentiality with fake screens: the work type is described without publishing data, client names, PLCs, endpoints, or private interfaces.

AI was a tool, not automatic authorship

I use AI to explore alternatives, audit interfaces, prototype, and review technical problems. It still takes defining constraints, comparing the result against the real site, and deciding what to keep. The useful work was not asking for an image or an effect; it was iterating until each element had a purpose.

The tension that remained visible

Industrial aesthetics could make reading harder. Animation could hide hierarchy. Material assets could become too heavy. That is why the system keeps readable HTML, native controls, direct routes, reduced motion, and a version that makes sense without JavaScript. The visual layer is allowed to improve the experience, not hide its content.

Next steps

The system now makes it possible to review the portfolio as a whole: identity, process, and evidence. The next step is not adding complexity by inertia. It is observing it in use, correcting real friction, and adding evidence only when there is work that can be presented honestly.