Altios
Figma x Flutterflow
UX Design
0 -> 1
Role
Product Designer, Builder
Timeline
4 Months
team
me
platform
Web
The Real Problem
I shipped a feature with a front-end engineer last year. The Figma file had 37 frames. The implementation took eleven days. On day eleven we sat down to QA and counted 23 places where the built version disagreed with the file — padding off by 2px, a hover state nobody had drawn, a focus ring drawn but never built, a component that existed in three slightly different versions because three designers had touched it on three different days.
None of this was anyone's fault. It was the medium.
I asked nine designers and seven engineers what their last design-to-code handoff felt like. The framing varied. The structure didn't:
"By the time it's in the codebase, it's a third thing. Not what I designed and not what we agreed."
"I spend more time translating decisions than making them."
"The Figma file is a screenshot of an idea. The codebase is the idea. The gap is where the product gets worse."
The category — Figma, Sketch, Webflow, Framer, Penpot — shares one architectural assumption: the design file and the code are two different artifacts that need to be kept in sync. Plugins, tokens, MCP servers, AI agents — every tool in the last five years has tried to narrow the gap between them. None has questioned that there is a gap.
Altios questions it.
Finding the Fix
I mapped what a designer and an engineer actually do across a one-week feature: the designer specifies, the engineer interprets, the designer reviews, the engineer corrects, the designer re-specifies. Roughly 60% of the elapsed time is translation cost. The output is not a product. The output is a consensus that everyone hopes resembles the product.
The translation cost is the dominant cost in modern product development. Not capture, not iteration, not review.
Three architectural moves followed:
1. Canvas-code duality as the default medium. One object, two views. The visual canvas and the underlying code are the same artifact, edited from either side, with no export step. The screenshot stops being the deliverable; the medium becomes the deliverable.
2. Visual flow as the navigation primitive. Files-and-folders is the wrong model for a product. Products are graphs — screens connect to screens, components nest in components, states branch into states. Altios's home view is the graph, not the file list. You navigate by following edges.
3. Components carry their own logic. A button is not a rectangle with a label and a hex code. A button is a rectangle, a label, a hex code, a hover behavior, a disabled state, a click handler, and the four places it currently lives. In Altios, the component is one object with all of that attached. Pulling it into a screen pulls in the behavior.
What Actually Happened
Three things changed during the concept exploration:
The AI partner's posture. Early mockups treated AI as a generator — "make me a hero section." Designers reviewing the concept hated it. One said: "I don't want a roommate who keeps moving my furniture." I redesigned AI as a collaborator that proposes, narrates, and asks, but does not act until invited. Same capability underneath; the relationship changed.
The dual-view default. I shipped concept mockups with canvas and code side-by-side. Engineers liked it. Designers found it overwhelming. The compromise: dual-view is one keystroke away, but the default is single-pane with a code peek that surfaces on hover over any element. The full split is for the moments that need it, not for the steady state.
The graph view's information density. First pass showed every screen, every component, every state, every connection. It looked like a circuit diagram. I added zoom semantics — at high zoom you see screens, at medium zoom you see flows, at low zoom you see the product. The same view became three views depending on the question you were asking.
What Changed
The canvas-code duality is the load-bearing premise. Every reviewer who engaged with the concept came back to the same observation: the moment you stop treating the visual and the code as two artifacts, half the product-team friction in their week stops being a category.
The graph navigation was the most contested decision and the most defended after a week of use in clickable prototypes. Reviewers pushed back on day one ("where are my files?") and asked for it in other tools by week two.
The component-with-logic model is what makes the rest of the concept coherent. A canvas-code duality without behavioral components is still two artifacts in a trench coat; the component is what makes them genuinely one object.
"This is the first design tool concept I've seen that doesn't assume the engineer is downstream."
What I Had to Work With
Solo concept, evenings only, no engineering partner to prototype against. Validation came from sixteen reviewer interviews — nine designers, seven engineers — and three clickable Figma prototypes. No shipped product.
Conceptual only. The decisions Altios makes are architectural arguments, not engineering ones. A real implementation would surface tradeoffs I haven't seen and would force me to retract things I currently believe.
Designing a tool for a workflow I live inside was the strongest signal and the most dangerous trap. The designers and engineers I interviewed work on web product teams of four to twelve people. Altios would be wrong for a Pixar shader artist and probably wrong for a solo indie game developer. The premise is load-bearing for the audience and irrelevant outside it.
What I'd Do Differently
Build a working prototype of the canvas-code duality on a single component before designing the rest of the concept. The whole argument lives or dies on whether that one interaction feels right, and I designed around it instead of into it.
Cut the AI partner from the v1 concept. It's the feature reviewers spent the most time on and the feature that adds the least to the core premise. Canvas-code duality stands without AI. AI without canvas-code duality is what every other tool already ships.
Write the one-sentence premise before drawing screens. "The canvas and the code are the same object" is eight words and would have killed two screens that survived the first month on visual merit alone.
What I Learned
Architecture beats features. The product is one premise — the canvas and the code are the same object — and every feature in the concept is either a proof of it or a distraction from it.
Conceptual work is real work. A concept that names the right premise changes how the people who reviewed it think about their day, even without a shipped product. Three reviewers reorganized their team's handoff process based on the conversations. The concept did work before any code existed.
Translation cost is invisible until it's named. Engineers and designers know the handoff is painful. Nobody calls the pain by its right name, so nobody designs against it. Naming the cost was a larger contribution than any of the features I drew.
Serving one workflow well requires failing another deliberately. Altios is not for marketing-page builders, not for prototype-only designers, not for engineers working from a spec doc. It is for product teams where the same person, or two people in close contact, own the round trip. That's the audience the concept earns. Everything else would be a worse Figma.
