Skip to content

Commit 52dedf3

Browse files
rvnminers-A-and-Nrvnminers-A-and-N
authored
feat(ui): polish demo workbench — honest aroma pitch + clearer substitution (#50)
The Track-A workbench is the Flavorman walk-in surface, so make it tell the real story instead of overselling: - Add an "Aroma" card: "Aroma prediction unlocks with YOUR data" — states plainly that the public demo does taste, and a useful aroma model trains on-premise on the customer's licensed/in-house odor data. This is the pitch ("aroma comes with your data"), shown honestly rather than faking smells. - Substitution panel: add a one-line explainer and show neighbors as "NN% match" instead of a raw similarity float. - Tagline: "taste prediction & substitution — before you pour" (no longer claims aroma the demo doesn't do). - Footnote: substitutions are Tanimoto over fingerprints; aroma trains on your data on-prem. Signed-off-by: Austin L. <86896075+rvnminers-A-and-N@users.noreply.github.com>
1 parent 9c900e5 commit 52dedf3

1 file changed

Lines changed: 24 additions & 7 deletions

File tree

‎training/workbench.html‎

Lines changed: 24 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -59,12 +59,19 @@
5959
.err{background:#FBEDE9;border:1px solid #E7C4B8;color:#8A3A22;border-radius:9px;
6060
padding:12px 15px;margin-top:18px;font-size:14px}
6161
.note{font-size:12.5px;color:var(--muted);margin-top:18px;line-height:1.55}
62+
.card-sub{font-size:12.5px;color:var(--muted);margin:0 0 14px;line-height:1.5}
63+
.aroma-card{margin-top:18px;border-color:#BFD8D0;background:linear-gradient(180deg,#F2F8F6,#FFFFFF)}
64+
.aroma-card h2{color:var(--aroma)}
65+
.aroma-lead{font-size:15px;font-weight:600;color:var(--ink);margin-bottom:6px}
66+
.aroma-lead b{color:var(--aroma)}
67+
.aroma-note{font-size:13px;color:var(--muted);margin:0;line-height:1.55;max-width:760px}
68+
.aroma-note b{color:var(--ink)}
6269
</style>
6370
</head>
6471
<body>
6572
<header>
6673
<h1>Flavor Workbench</h1>
67-
<span class="sub">predict taste &amp; aroma before you pour</span>
74+
<span class="sub">taste prediction &amp; substitution — before you pour</span>
6875
</header>
6976
<main>
7077
<div class="bar">
@@ -85,16 +92,26 @@ <h2>Flavor read</h2>
8592
</div>
8693
<div class="card">
8794
<h2>Substitution candidates</h2>
95+
<p class="card-sub">Structurally similar molecules you could swap in — each with its known tastes.</p>
8896
<div id="neighbors"></div>
8997
</div>
9098
</div>
9199

100+
<div class="card aroma-card" id="aromaCard" style="display:none">
101+
<h2>Aroma</h2>
102+
<div class="aroma-lead">Aroma prediction unlocks with <b>your</b> data.</div>
103+
<p class="aroma-note">The public demo predicts <b>taste</b> from open data. A useful
104+
aroma model needs expert-labeled odor data — so we train it <b>on-premise, on your
105+
licensed or in-house data</b>, never leaving your firewall. The pipeline is built and
106+
ready; it lights up the moment the data is yours to use.</p>
107+
</div>
108+
92109
<p class="note" id="footnote" style="display:none">
93110
Bars are model predictions; a <b>measured</b> tag means the molecule is in the
94111
curated data (ground truth, not a guess). Salty is lookup-only and sour is a
95-
rule. Substitutions rank by structural similarity today and sharpen to learned
96-
aroma-space once the aroma model is trained. Results are leads for the bench,
97-
not verdicts.
112+
rule. Substitutions rank by structural similarity (Tanimoto over molecular
113+
fingerprints). Aroma isn't in the public demo — it trains on your licensed or
114+
in-house odor data, on-prem. Results are leads for the bench, not verdicts.
98115
</p>
99116
</main>
100117

@@ -135,7 +152,7 @@ <h2>Substitution candidates</h2>
135152
if(p.error){ throw new Error(p.error); }
136153
render(p, n.neighbors||[]);
137154
}catch(e){
138-
$('results').style.display='none'; $('footnote').style.display='none';
155+
$('results').style.display='none'; $('aromaCard').style.display='none'; $('footnote').style.display='none';
139156
$('err').textContent = e.message; $('err').style.display='block';
140157
}finally{
141158
go.disabled=false; go.textContent='Read flavor';
@@ -170,11 +187,11 @@ <h2>Substitution candidates</h2>
170187
<div class="neighbor">
171188
<div><div class="s">${x.smiles}</div>
172189
<div class="kt">${x.known_tastes.length?x.known_tastes.join(' · '):'—'}</div></div>
173-
<div class="sim">${x.similarity}</div>
190+
<div class="sim">${Math.round(x.similarity*100)}% match</div>
174191
</div>`).join('');
175192
}
176193

177-
$('results').style.display='grid'; $('footnote').style.display='block';
194+
$('results').style.display='grid'; $('aromaCard').style.display='block'; $('footnote').style.display='block';
178195
// animate bar fills
179196
requestAnimationFrame(()=>document.querySelectorAll('.fill')
180197
.forEach(f=>f.style.width=f.dataset.w+'%'));

0 commit comments

Comments
 (0)