How Tekyous works

2a. Questionnaire mode vs. Sandbox mode

When you open the builder, you choose between two modes of working:

2b. Toolbar

The toolbar sits above the canvas and is the main control surface for the builder.

• →Mode indicator - Shows if you are using Questionnaire or Sandbox mode. If it's the recommendation engine running through the Questionnaire, then there's an extra button available to see the rationale behind suggested tools (Stack overview). Furthermore, if a recommendation has a multiple types then we can switch between them using an additional button as well.
• →Clear all - Clears the whole selection on the canvas. Sits behind double-click as it should be used with caution - what was on the canvas just gets erased.
• →Organise - Groups cards into category or subcategory columns automatically with a single-click.
• →Lock - Freezes all card positions so nothing moves accidentally.
• →Export / Import - Export downloads the canvas state as a JSON file; Import restores a previously saved file.
• →AI Chat - A preview of an AI chat feature, which will be implemented post-MVP. Right now the chat window pops up, but it's locked.
• →Help - Opens the compact how-to guide covering the main features of the builder.

2c. Canvas interactions

The canvas is interactive - you can drag tool cards around to arrange your diagram, zoom in and out with the scroll wheel, and pan by dragging the background.

• →Click a tool card - Highlights the selected node, shows quick suggestions and swap option, also opens the tool detail panel (detail panel is described in the section below).

  

• →Click + Add tool button - Triggers the tool picker side panel, allowing you to add any tool to the canvas without limiting yourself to suggestions or alternatives.

  

• →Tool drag - Reposition any tool card freely on the canvas by dragging it.
• →Scroll - Zoom in and out on the canvas with the scroll wheel.
• →Drag the background - Pan the canvas to navigate large stacks by dragging the empty background.

2d. Canvas behaviour

Beyond direct input, the canvas responds to the state of your stack - it supports two layout types, and tool cards show visual cues depending on how they were added.

• →Organised layout - Tools are grouped into category columns, so each tool sits under its assigned category. This is the default layout when using Questionnaire mode or a predefined Sandbox stack, and can also be triggered at any time with the Organise button in the toolbar. Additionally, we can also use a detailed layout with subcategories grouping - they can be split vertically or horizontally.

  

  

  

• →Free layout - Tools sit wherever you place them - there is no category grouping. This is the default for free Sandbox sessions, and it also takes effect when you move tools out of their columns in an organised layout.

  

• →Tool selection state - When you click a tool card, it becomes selected and its border highlights to show it is active. The tool detail panel opens on the right to reflect the selection.

  

  

  

  

• →Selection grid - Available in Questionnaire mode once an experience level and project type are selected. A collapsible overlay in the top-left corner of the canvas - click the icon to expand a grid showing all recommended tools organised by category and subcategory. Each tool displays its icon and name; the one currently on the canvas is highlighted in amber. Click any tool to add it to the canvas or remove it if it is already there, making it a quick way to scan the full ranked pool and swap alternatives without opening any side panel.

  

• →Stack changes notice - The questionnaire produces a list of suggested tools, but you can swap any of them or add tools freely. All deviations from the original recommendation are tracked and displayed on the canvas.

  

  

• →Enforced tool state - Some tools are added automatically because a relationship requires them - for example, AI Builder tools using a predefined tech stack only. Enforced tools cannot be removed independently from the canvas as long as the enforcer tool is still present there.

  

2e. Tool detail panel

Clicking any tool card on the canvas opens the tool detail panel on the right side. The panel has two tabs: Description - covering the tool's summary, scores (learning curve, flexibility), and pricing - and Relationships, which lists related tools drawn from the database.

2f. Tool picker panel

The tool picker panel is a searchable drawer that gives you access to the entire tools catalogue. You can filter by category or search by name, and add any tool directly to your canvas.

2g. Stack Hints panel

Once tools are on the canvas, the Hints panel appears at the bottom. It analyses your stack in real time and surfaces contextual hints - compatibility problems, missing dependencies, or suggestions for tools that commonly pair well with what you already have.

• →Each hint shows which tools triggered it, with action buttons to add a suggested tool, remove a conflicting one, or browse a relevant category.
• →Click the panel header to expand or collapse the list. It auto-expands briefly when new hints arrive.
• →Use the eye icon to suppress all hints if you want a distraction-free canvas.