feat: offer the job, not the machine — the range IS the module

"Shape One Range" has three controls and no honest way to nominate one of
them as the knob that matters. The copy nominated *how much*, which is
incoherent: boosting an unspecified frequency means nothing. The range is
the first decision, not the second — `plans/audio-fx-ux/README.md`
§"The hole in the single-knob rule", where B is named as the answer.

So the add menu offers the decision instead of the machine. Five jobs —
Tame Boominess, Reduce Mud, Reduce Boxiness, Add Clarity, Soften
Harshness — each a peaking filter with its frequency already chosen, low
to high, which is the order an author hears them in. Picking the module
is picking the range, so one knob is honest rather than a simplification
hiding the real choice. `peaking` is no longer offered as itself: two
doors to the same effect, one of them the incoherent one, is worse than
either alone.

Every job is one the preset catalogue already ships, at the settings it
ships it with — a test asserts that. The list names the vocabulary the
presets were written in rather than inventing a second one beside it, and
a job nobody's preset does would be a guess about what authors want.

It needs no new node field. `label` already names a node for the work it
does, so a job node and a preset node are indistinguishable afterwards —
which is right, because they are the same idea. It also dissolves the
duplicate-name problem at the root rather than papering it: Clean Voice
reads Remove Rumble · Reduce Mud · Even Out Loudness · Add Clarity · Peak
Ceiling, and nothing repeats.

Underneath it is an ordinary peaking node. Details opens on the same
three controls it always had, and the frequency is a starting point
rather than a cage.

Falsified: offering `peaking` alongside its jobs fails the menu test.

Note for the next session: adding a core subpath needs `bun run build` in
packages/core, not just the subpath sync. Studio's PropertyPanel tests
resolve `@hyperframes/core/*` through the `node` condition, which points
at `dist/` — so a new module resolves in the FX tests and fails in those
with a "does the file exist?" that looks like a config error.

core 1750 passing (112 files), studio 3687 passing / 18 todo.

Author: vanceingalls

packages/core/package-subpaths.json

@@ -98,6 +98,12 @@
       "types": "./dist/audioFxCopy.d.ts",
       "environments": ["browser", "bun", "node"]
     },
+    "./audio-fx-jobs": {
+      "source": "./src/audioFxJobs.ts",
+      "runtime": "./dist/audioFxJobs.js",
+      "types": "./dist/audioFxJobs.d.ts",
+      "environments": ["browser", "bun", "node"]
+    },
     "./audio-fx-eq": {
       "source": "./src/audioFxEq.ts",
       "runtime": "./dist/audioFxEq.js",

packages/core/package.json

@@ -112,6 +112,12 @@
       "import": "./src/audioFxCopy.ts",
       "types": "./src/audioFxCopy.ts"
     },
+    "./audio-fx-jobs": {
+      "bun": "./src/audioFxJobs.ts",
+      "node": "./dist/audioFxJobs.js",
+      "import": "./src/audioFxJobs.ts",
+      "types": "./src/audioFxJobs.ts"
+    },
     "./audio-fx-eq": {
       "bun": "./src/audioFxEq.ts",
       "node": "./dist/audioFxEq.js",
@@ -420,6 +426,10 @@
         "import": "./dist/audioFxCopy.js",
         "types": "./dist/audioFxCopy.d.ts"
       },
+      "./audio-fx-jobs": {
+        "import": "./dist/audioFxJobs.js",
+        "types": "./dist/audioFxJobs.d.ts"
+      },
       "./audio-fx-eq": {
         "import": "./dist/audioFxEq.js",
         "types": "./dist/audioFxEq.d.ts"

packages/core/src/audioFxJobs.test.ts

@@ -0,0 +1,63 @@
+import { describe, expect, it } from "vitest";
+import { getAudioFxDef } from "./audioFx.js";
+import { HF_AUDIO_FX_PRESETS } from "./audioFxPresets.js";
+import { audioFxJobNode, getAudioFxJob, HF_AUDIO_FX_JOBS } from "./audioFxJobs.js";
+
+const EMPTY = { version: 1 as const, nodes: [] };
+
+describe("named jobs", () => {
+  it("makes an ordinary effect node, named for the work", () => {
+    const job = getAudioFxJob("reduce-mud");
+    if (!job) throw new Error("no such job");
+    const node = audioFxJobNode(job, EMPTY);
+    // Ordinary underneath: the author can open it and find the filter they could
+    // have added by hand, at the frequency the job picked for them.
+    expect(node.type).toBe("peaking");
+    expect(node.params?.frequency).toBe(250);
+    expect(node.label).toBe("Reduce Mud");
+    expect(node.enabled).toBe(true);
+    expect(node.id).toBeTruthy();
+  });
+
+  it("gives every job a value for every parameter its effect declares", () => {
+    // A job names a range and leaves the rest alone, so the omitted parameters
+    // have to come from the registry — a node missing `q` renders at whatever
+    // the graph builder falls back to rather than what the panel shows.
+    for (const job of HF_AUDIO_FX_JOBS) {
+      const def = getAudioFxDef(job.type);
+      expect(def, `${job.id} names an effect that does not exist`).toBeDefined();
+      const node = audioFxJobNode(job, EMPTY);
+      for (const param of def?.params ?? []) {
+        expect(node.params?.[param.key], `${job.id} has no ${param.key}`).toBeDefined();
+      }
+    }
+  });
+
+  it("mints an id that does not collide with what is already there", () => {
+    const job = getAudioFxJob("add-clarity");
+    if (!job) throw new Error("no such job");
+    const first = audioFxJobNode(job, EMPTY);
+    const second = audioFxJobNode(job, { version: 1, nodes: [first] });
+    // Two of the same job is a real thing to want, and a shared id would give
+    // them each other's automation lanes.
+    expect(second.id).not.toBe(first.id);
+  });
+
+  it("names jobs the preset catalogue already ships", () => {
+    // The point of the list is to name the vocabulary the presets were written
+    // in, not to invent a second one beside it. A job nobody's preset uses is a
+    // guess about what authors want; one a preset uses has already been chosen.
+    const shipped = new Set(
+      HF_AUDIO_FX_PRESETS.flatMap((preset) => preset.nodes.map((node) => node.label)),
+    );
+    for (const job of HF_AUDIO_FX_JOBS) {
+      expect(shipped, `${job.label} is not a job any preset does`).toContain(job.label);
+    }
+  });
+
+  it("has an id for every job and no duplicates", () => {
+    const ids = HF_AUDIO_FX_JOBS.map((job) => job.id);
+    expect(new Set(ids).size).toBe(ids.length);
+    for (const id of ids) expect(getAudioFxJob(id)?.id).toBe(id);
+  });
+});

packages/core/src/audioFxJobs.ts

@@ -0,0 +1,117 @@
+/**
+ * Named jobs: the range IS the module.
+ *
+ * "Shape One Range" has three controls — where, how much, how wide — and no
+ * honest way to nominate one of them as the knob that matters. Nominating *how
+ * much* is incoherent, because boosting an unspecified frequency means nothing:
+ * the range is the first decision, not the second.
+ *
+ * So the menu offers the decision instead of the machine. Each job is a peaking
+ * filter with its frequency already chosen — Reduce Mud, Add Clarity, Soften
+ * Harshness — and picking the module IS picking the range, which makes one knob
+ * honest rather than a simplification hiding the real choice. It also dissolves
+ * the duplicate-name problem at the root: a preset that cuts mud and then lifts
+ * clarity used to read "Shape One Range" twice with nothing to tell them apart.
+ *
+ * Every job here is one the preset catalogue already ships, at the settings it
+ * ships them with, so this names the vocabulary the presets were written in
+ * rather than inventing a second one. Reasoning in
+ * `plans/audio-fx-ux/README.md` §"The hole in the single-knob rule".
+ *
+ * The frequency is a starting point, not a cage — it is an ordinary peaking node
+ * underneath, and Details opens on the same three controls it always had.
+ */
+
+import {
+  defaultAudioFxParams,
+  mintAudioFxNodeId,
+  normalizeAudioFxParams,
+  type HfAudioFxChain,
+  type HfAudioFxNode,
+  type HfAudioFxParamValues,
+} from "./audioFx.js";
+
+export interface HfAudioFxJob {
+  id: string;
+  /** What the rack calls the node this makes. */
+  label: string;
+  /** The complaint that leads here, in the author's words. */
+  does: string;
+  /** The registry effect underneath. */
+  type: string;
+  /** Where it acts, and how hard — the decision the author is spared. */
+  params: HfAudioFxParamValues;
+}
+
+/**
+ * Ordered low to high, which is the order an author hears them in: weight and
+ * mud at the bottom, clarity and harshness at the top.
+ */
+export const HF_AUDIO_FX_JOBS: readonly HfAudioFxJob[] = [
+  {
+    id: "tame-boominess",
+    label: "Tame Boominess",
+    does: "Too much chest — it booms.",
+    type: "peaking",
+    params: { frequency: 200, gain: -4, q: 1.4 },
+  },
+  {
+    id: "reduce-mud",
+    label: "Reduce Mud",
+    does: "Muffled, like it is behind cardboard.",
+    type: "peaking",
+    params: { frequency: 250, gain: -3, q: 1.2 },
+  },
+  {
+    id: "reduce-boxiness",
+    label: "Reduce Boxiness",
+    does: "Sounds like a small room, or a box.",
+    type: "peaking",
+    params: { frequency: 400, gain: -3, q: 1.4 },
+  },
+  {
+    id: "add-clarity",
+    label: "Add Clarity",
+    does: "Words are hard to make out.",
+    type: "peaking",
+    params: { frequency: 3000, gain: 2.5, q: 1 },
+  },
+  {
+    id: "soften-harshness",
+    label: "Soften Harshness",
+    does: "Harsh and tiring to listen to.",
+    type: "peaking",
+    params: { frequency: 3200, gain: -3, q: 1.6 },
+  },
+];
+
+export function getAudioFxJob(id: string): HfAudioFxJob | undefined {
+  return HF_AUDIO_FX_JOBS.find((job) => job.id === id);
+}
+
+/** Effect ids the job list covers, which the add menu offers as jobs instead. */
+export const HF_AUDIO_FX_JOB_TYPES: ReadonlySet<string> = new Set(
+  HF_AUDIO_FX_JOBS.map((job) => job.type),
+);
+
+/**
+ * The node a job adds: an ordinary effect carrying the job's name.
+ *
+ * `label` is the field a preset already uses to name a node for the work it
+ * does, so a job needs nothing new — and a job node and a preset node are
+ * indistinguishable afterwards, which is right. They are the same idea.
+ */
+export function audioFxJobNode(job: HfAudioFxJob, chain: HfAudioFxChain): HfAudioFxNode {
+  return {
+    type: job.type,
+    id: mintAudioFxNodeId(chain),
+    enabled: true,
+    label: job.label,
+    // Through the registry, so a job cannot ship a value the effect would clamp
+    // or a key it does not have.
+    params: normalizeAudioFxParams(job.type, {
+      ...defaultAudioFxParams(job.type),
+      ...job.params,
+    }),
+  };
+}

packages/studio/src/components/editor/propertyPanelFxSection.test.tsx

@@ -9,6 +9,7 @@ import {
 } from "@hyperframes/core/audio-fx";
 import { DEFAULT_CARVE } from "@hyperframes/core/audio-carve";
 import { EFFECT_COPY, PRESET_PROBLEM } from "@hyperframes/core/audio-fx-copy";
+import { HF_AUDIO_FX_JOBS, HF_AUDIO_FX_JOB_TYPES } from "@hyperframes/core/audio-fx-jobs";
 import { getAudioFxPreset } from "@hyperframes/core/audio-fx-presets";
 
 /**
@@ -150,11 +151,59 @@ describe("FxSection chain", () => {
     const items = Array.from(host.querySelectorAll(".hf-fx-add-item")).map((e) =>
       e.textContent?.trim(),
     );
-    expect(items).toHaveLength(HF_AUDIO_FX.length);
-    // By the name the RACK will use, not the registry's — picking "High-pass"
-    // and getting a module called "Remove Rumble" is the inconsistency this
-    // whole layer exists to remove.
-    for (const def of HF_AUDIO_FX) expect(items).toContain(EFFECT_COPY[def.id]?.title);
+    // Every effect is reachable, but not every one under its own name: the jobs
+    // stand in for the effect they are made of, because picking `peaking` is
+    // picking a machine and leaving the real decision for afterwards.
+    const standIns = HF_AUDIO_FX.filter((d) => HF_AUDIO_FX_JOB_TYPES.has(d.id));
+    expect(items).toHaveLength(HF_AUDIO_FX.length - standIns.length + HF_AUDIO_FX_JOBS.length);
+    for (const def of HF_AUDIO_FX) {
+      if (HF_AUDIO_FX_JOB_TYPES.has(def.id)) {
+        // Not offered as itself, and it must not be — two doors to the same
+        // effect, one of them the incoherent one, is worse than either alone.
+        expect(items).not.toContain(EFFECT_COPY[def.id]?.title);
+        continue;
+      }
+      // By the name the RACK will use, not the registry's — picking "High-pass"
+      // and getting a module called "Remove Rumble" is the inconsistency this
+      // whole layer exists to remove.
+      expect(items).toContain(EFFECT_COPY[def.id]?.title);
+    }
+    for (const job of HF_AUDIO_FX_JOBS) expect(items).toContain(job.label);
+  });
+
+  it("adds a job as an ordinary effect, already named and already aimed", () => {
+    // The range IS the module: one knob is honest here because the decision the
+    // knob depends on has already been made.
+    const { host, onChainChange } = mount({ chain: { version: 1, nodes: [] } });
+    click(host.querySelector(".hf-fx-add"));
+    click(byText(host, ".hf-fx-add-item", "Reduce Mud"));
+
+    const next = onChainChange.mock.calls[0]?.[0] as HfAudioFxChain;
+    expect(next.nodes).toHaveLength(1);
+    expect(next.nodes[0]?.type).toBe("peaking");
+    expect(next.nodes[0]?.label).toBe("Reduce Mud");
+    expect(next.nodes[0]?.params?.frequency).toBe(250);
+  });
+
+  it("shows two jobs over the same effect as the different things they are", () => {
+    // The whole point. Read down the rack, "Shape One Range" twice was two rows
+    // an author could not tell apart — and one of them was cutting while the
+    // other was boosting.
+    const { host } = mount({
+      chain: {
+        version: 1,
+        nodes: [
+          { type: "peaking", label: "Reduce Mud", params: { frequency: 250, gain: -3, q: 1.2 } },
+          { type: "peaking", label: "Add Clarity", params: { frequency: 3000, gain: 2.5, q: 1 } },
+        ],
+      } as unknown as HfAudioFxChain,
+    });
+    const names = Array.from(host.querySelectorAll(".hf-fx-node-name")).map((e) =>
+      e.textContent?.trim(),
+    );
+    expect(names).toContain("Reduce Mud");
+    expect(names).toContain("Add Clarity");
+    expect(names).not.toContain(EFFECT_COPY.peaking?.title);
   });
 
   it("adds an effect seeded with its declared defaults", () => {

packages/studio/src/components/editor/propertyPanelFxSection.tsx

@@ -8,6 +8,7 @@
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import {
   defaultAudioFxParams,
+  getAudioFxDef,
   HF_AUDIO_FX,
   mintAudioFxNodeId,
   type HfAudioFxChain,
@@ -25,6 +26,12 @@ import {
   setAudioEqBandGain,
 } from "@hyperframes/core/audio-fx-eq";
 import { EFFECT_COPY } from "@hyperframes/core/audio-fx-copy";
+import {
+  audioFxJobNode,
+  HF_AUDIO_FX_JOBS,
+  HF_AUDIO_FX_JOB_TYPES,
+  type HfAudioFxJob,
+} from "@hyperframes/core/audio-fx-jobs";
 import { FxPresetMenu } from "./propertyPanelFxPresetMenu.js";
 import { FxEqModule } from "./propertyPanelFxEqModule.js";
 import { FxCarveModule, type AudioTrackOption } from "./propertyPanelFxCarveModule.js";
@@ -133,8 +140,20 @@ export function FxSection({
   const [picking, setPicking] = useState(false);
   const [openNode, setOpenNode] = useState<number | null>(0);
 
+  /**
+   * The add menu, with the jobs standing in for the effect they are made of.
+   *
+   * `peaking` is not offered as itself: picking it is picking a machine and
+   * leaving the real decision — which range — for afterwards. The jobs are that
+   * decision, already made. See `audioFxJobs.ts`.
+   */
   const grouped = useMemo(
-    () => GROUP_ORDER.map((g) => ({ group: g, defs: HF_AUDIO_FX.filter((d) => d.group === g) })),
+    () =>
+      GROUP_ORDER.map((g) => ({
+        group: g,
+        defs: HF_AUDIO_FX.filter((d) => d.group === g && !HF_AUDIO_FX_JOB_TYPES.has(d.id)),
+        jobs: HF_AUDIO_FX_JOBS.filter((job) => getAudioFxDef(job.type)?.group === g),
+      })),
     [],
   );
 
@@ -242,6 +261,25 @@ export function FxSection({
     [],
   );
 
+  /** The same, for a job — an ordinary node that arrives already named and aimed. */
+  const withJob = useCallback(
+    (base: HfAudioFxChain, job: HfAudioFxJob): HfAudioFxChain => ({
+      ...base,
+      nodes: [...base.nodes, audioFxJobNode(job, base)],
+    }),
+    [],
+  );
+
+  const addJob = useCallback(
+    (job: HfAudioFxJob) => {
+      auditionBase.current = null;
+      mutate(withJob(chain, job).nodes);
+      setOpenNode(chain.nodes.length);
+      setAdding(false);
+    },
+    [chain, mutate, withJob],
+  );
+
   const addEffect = useCallback(
     (type: string) => {
       auditionBase.current = null;
@@ -475,11 +513,30 @@ export function FxSection({
               Tone (EQ)
             </button>
           </div>
-          {grouped.map(({ group, defs }) => (
+          {grouped.map(({ group, defs, jobs }) => (
             <div key={group} className="hf-fx-add-group flex flex-wrap items-center gap-1">
               <span className="hf-fx-add-group-label w-full font-mono text-[9px] uppercase tracking-wide text-panel-text-4">
                 {GROUP_LABEL[group]}
               </span>
+              {jobs.map((job) => (
+                <button
+                  key={job.id}
+                  type="button"
+                  // Same class as any other entry: a job IS an effect, and one
+                  // that looked special would read as a preset rather than as
+                  // the thing the author is about to add.
+                  className="hf-fx-add-item rounded-[3px] bg-panel-surface px-1.5 py-0.5 text-[10px] text-panel-text-1 hover:text-panel-text-0"
+                  title={job.does}
+                  onClick={() => addJob(job)}
+                  onMouseEnter={() => {
+                    onAuditionLevel?.(false);
+                    audition((base) => withJob(base, job));
+                  }}
+                  onFocus={() => audition((base) => withJob(base, job))}
+                >
+                  {job.label}
+                </button>
+              ))}
               {defs.map((d) => (
                 <button
                   key={d.id}