Skip to content
Draft
Show file tree
Hide file tree
Changes from 4 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 5 additions & 1 deletion frontend/src/constants/mainLayout.ts
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,11 @@ export const defaultTabs: Tab[] = [
external: false,
dropdown: {
show: false,
children: [{ name: 'Documentation', route: '/documentation', external: false }],
children: [
{ name: 'Documentation', route: '/documentation', external: false },
{ name: 'Standards Overview', route: '/standards', external: false },
{ name: 'Workflow Guidance', route: '/guidance', external: false },

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is "Data Ingest Guidnace" or "Data Upload Guidance" more accessible to users? I wonder if that will be easier for the non-expert user to quickly understand.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

+1 to adding extra words to describe which type of workflow this documentation is about (sometimes people have a lot of 'workflows' floating around for all kinds of things)

],
},
},
{ name: 'Tools', route: '/tools', external: false },
Expand Down
76 changes: 76 additions & 0 deletions frontend/src/pages/OverviewStandardsPage.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,76 @@
<template>
<q-page class="column items-center">
<PageTitle title="Standards" subtitle="EMBER interoperability & reproducibility" />

<div class="q-mx-xl full-width max-w-screen-lg">
<q-card flat class="q-mt-lg">
<q-card-section>
<div class="text-h4 q-mb-md">Overview</div>
<p>
EMBER adopts community standards to enable interoperability and reproducibility across multimodal neuroscience datasets.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

EMBER has adopted?

This page outlines the data and metadata standards integrated by EMBER, workflow guidance for users, validation tools,
and EMBER-specific conventions.
</p>
</q-card-section>
</q-card>

<q-expansion-item label="Data Standards (NWB, BIDS)" icon="schema" class="q-mt-md">
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I really like the expandable format & the icons! Very clean and easy to read!

Minor UI nitpick: It wasn't immediately obvious to me that these were dropdowns (partially I think b/c I have a large screen and the dropdown icon is all the way on the right, away from the words)
I'm not sure what the best solution is here, but here are some ideas:

  • adding a border about the expansion items?
  • making the expansion componenent smaller (i.e. not the full width)

feel free to play around and see what looks best to you!

<div class="q-pa-md">
<p>EMBER integrates widely used community standards for data organization:</p>
<ul>
<li><strong>NWB:</strong> for neurophysiology (ephys, behavior, optophysiology)</li>

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

do we want to hightlight suggested extensions? NDX-pose and NDX-wearables would make sense to start?

<li><strong>BIDS:</strong> for MRI, EEG/MEG/iEEG, microscopy, derivatives</li>
</ul>
</div>
</q-expansion-item>

<q-expansion-item label="Metadata Standards" icon="list_alt" class="q-mt-sm">
<div class="q-pa-md">
<p>EMBER enforces core metadata fields and encourages controlled vocabularies/ontologies:</p>
<ul>
<li>Required fields: project, subject/session IDs, modality, acquisition date</li>
<li>Controlled vocabularies: species, anatomy, device names</li>
<li>Ontologies: Uberon (anatomy), NCBI Taxonomy, behavior/task ontologies</li>
</ul>
</div>
</q-expansion-item>

<q-expansion-item label="Workflow Guidance" icon="directions" class="q-mt-sm">

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

update name per above? think about it!

<div class="q-pa-md">
<ol>
<li>Organize/convert data into NWB or BIDS formats</li>
<li>Populate metadata fields (use controlled vocabularies where possible)</li>
<li>Run local validators and fix errors/warnings</li>
<li>Prepare ancillary files (README, code, notes)</li>
<li>Upload via EMBER‑DANDI</li>
</ol>
<p class="text-caption">Restricted workflows will be added once finalized.</p>
</div>
</q-expansion-item>

<q-expansion-item label="Validation Tools & Services" icon="verified" class="q-mt-sm">
<div class="q-pa-md">
<ul>
<li>NWB Validator: checks file structure and metadata</li>
<li>BIDS Validator: checks directory layout, filenames, sidecars</li>
<li>EMBER‑DANDI server‑side checks during upload</li>
</ul>
</div>
</q-expansion-item>

<q-expansion-item label="EMBER‑Specific Conventions" icon="description" class="q-mt-sm q-mb-xl">
<div class="q-pa-md">
<ul>
<li>Naming rules: dataset IDs, subject/session formats (lowercase + underscores)</li>
<li>Schema snippets: JSON/YAML examples for common metadata blocks</li>
<li>Templates: starter JSON sidecars and field checklists</li>
</ul>
</div>
</q-expansion-item>
</div>
</q-page>
</template>

<script setup lang="ts">
import PageTitle from 'src/components/PageTitle.vue';
</script>
77 changes: 77 additions & 0 deletions frontend/src/pages/WorkflowGuidancePage.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,77 @@
<template>
<q-page class="column items-center">
<PageTitle title="Workflow Guidance" subtitle="Steps for ingest, validation, and data submission" />

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

again, consider renaiming?


<div class="q-mx-xl full-width max-w-screen-lg">
<q-card flat class="q-mt-lg">
<q-card-section>
<div class="text-h4 q-mb-md">Overview</div>
<p>
This page provides detailed workflow guidance for preparing, validating, and submitting data to the EMBER ecosystem.
It is intended to help users follow a consistent process to ensure interoperability, reproducibility, and compliance
with community standards.
</p>
</q-card-section>
</q-card>

<q-expansion-item label="Step 1: Organize Data" icon="folder" class="q-mt-md">
<div class="q-pa-md">
<p>Convert or organize raw data into recognized community formats where possible:</p>
<ul>
<li>Use NWB for neurophysiology and behavioral time series</li>

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

link to example script using pynwb? link to nwb guide as GUI option?

<li>Use BIDS for imaging, EEG/MEG/iEEG, and derivatives</li>

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Add link to examples/how to from BIDS?

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

<li>Maintain consistent folder structures and naming conventions</li>

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

do we have specific recommendations here?

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I would just defer/copy & paste from Oliver's document to try to avoid duplication or writing something potentially inconsistent

</ul>
</div>
</q-expansion-item>

<q-expansion-item label="Step 2: Populate Metadata" icon="list_alt" class="q-mt-sm">
<div class="q-pa-md">
<p>Fill in required metadata fields and, where possible, use controlled vocabularies and ontologies:</p>
<ul>
<li>Project, dataset, subject, and session identifiers</li>
<li>Species, anatomy, device, and modality information</li>
<li>Acquisition dates, license, and contributors</li>
</ul>
</div>
</q-expansion-item>

<q-expansion-item label="Step 3: Validate Data" icon="verified" class="q-mt-sm">

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

provide example commands or links, and expected output for each vaildator? can probably link to or copy paste from relevant documentation?

<div class="q-pa-md">
<p>Run validation tools to confirm compliance:</p>
<ul>
<li><strong>NWB Validator</strong>: checks internal structure and metadata completeness</li>
<li><strong>BIDS Validator</strong>: checks directory layout, filenames, and sidecars</li>
<li><strong>EMBER-DANDI Checks</strong>: automated validation during upload</li>
</ul>
<p class="text-caption">Address any validation errors or warnings before submission.</p>
</div>
</q-expansion-item>

<q-expansion-item label="Step 4: Prepare Ancillary Files" icon="description" class="q-mt-sm">

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

do we have good examples to point to? maybe one of the existing project we've formatted, or from Dandi?

<div class="q-pa-md">
<ul>
<li>README files describing dataset contents and organization</li>
<li>Methodological notes or data processing scripts</li>
<li>Supplementary documentation (e.g., experimental protocols)</li>
</ul>
</div>
</q-expansion-item>

<q-expansion-item label="Step 5: Submit to EMBER" icon="cloud_upload" class="q-mt-sm q-mb-xl">
<div class="q-pa-md">
<ol>
<li>Ensure you have registered for EMBER-DANDI with your GitHub account</li>
<li>Use the DANDI CLI or UI to upload validated datasets</li>

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

link to dandi cli code or add examples!

<li>Retain validation logs and ancillary files with the dataset</li>
</ol>
<p class="text-caption">Restricted workflows (e.g., sensitive or controlled-access data) will be added once finalized.</p>
</div>
</q-expansion-item>
</div>
</q-page>
</template>

<script setup lang="ts">
import PageTitle from 'src/components/PageTitle.vue';
</script>
8 changes: 8 additions & 0 deletions frontend/src/router/routes.ts
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,10 @@ const routes: RouteRecordRaw[] = [
path: 'projects',
component: () => import('pages/ProjectsPage.vue'),
},
{
path: 'standards',
component: () => import('pages/OverviewStandardsPage.vue'),
},
{
path: 'documentation',
component: () => import('pages/DocumentationPage.vue'),
Expand All @@ -18,6 +22,10 @@ const routes: RouteRecordRaw[] = [
path: 'getting-started',
component: () => import('pages/GettingStartedPage.vue'),
},
{
path: 'guidance',
component: () => import('pages/WorkflowGuidancePage.vue'),
},
{
path: 'tools',
component: () => import('pages/ToolsPage.vue'),
Expand Down
Loading