Danvas
Danvas
DashboardSupportWelcome

👤 USER DOCS

User Guides

Getting Started

Getting StartedDashboard & OnboardingApp Settings

Tutorials

Tutorial: Setting Up Shift Tasks & ClosersTutorial: Managing Incidents in the InboxTutorial: Tracking Compliance & Sync StatusTutorial: Operational Workflows with the AI AssistantTutorial: Building & Deploying Custom Checklists

Daily Operations (Staff)

Shift Workspace & TasksService Day SetupDaily Line-UpStaff Service Day ReportsForms

Communication & Chat

Messages & AnnouncementsUnified Operations InboxAI Assistant

Manager & Admin Guides

Daily Line-Up SetupStaff SchedulingManaging LocationsNPS and Guest FeedbackCouponsContacts and Guest HistoryManager CloseoutsDaily Line-Up & ComplianceAnalyticsIncident ReportingWhistleblower Concerns & FeedbackAdmin Tools

⚙️ DEVELOPER DOCS

Getting Started

Getting StartedDevelopmentDeployment Guide

Architecture

Architecture OverviewExplanation: AI Integration & Tenant SecurityExplanation: Dynamic Forms Engine DesignExplanation: Compliance Ledger DesignExplanation: Live Sync & Data FreshnessData FlowArchitecture Decision Records

Core Domain

Core DomainDatabase ReferenceLocations DomainAuth & RBACScheduling DomainReports DomainIncidents DomainUnified Operations InboxLive Sync Data FreshnessToast Sync PipelineNotifications DomainCoupons and Guest NPSAudit Log & Compliance ArchitectureDesign Audit FindingsAI Chat IntegrationAnalytics & Tips Integration

Frontend

Frontend ArchitectureFormsLoading SkeletonsComponentsPWA & Offline ShellScreenshots

API Reference

API Reference

Endpoints

POS Sales APIOptimization Data APISchedule Shifts APIEmployee Export APIReports APIIncidents APIAI Chat APIPush Notifications APIWebhooks APICron API

Contributing

ContributingCode Examples

Security

Security & Compliance

Release Notes

What's New

Screenshots

Adding UI screenshots to documentation

Documentation screenshots help users understand the Danvas interface. This guide covers how to add and manage screenshots effectively.

Screenshot Guidelines

Recommended Tools

  • MacOS: Built-in Screenshot (Cmd+Shift+4)
  • Vercel Blob: For image hosting and optimization in the app
  • Local /images/ folder: For docs-specific screenshots

Requirements

RequirementGuidance
FormatPNG or JPEG
Max size5MB
Recommended width1200-1600px
AccessibilityDescribe the visible state in alt text

Adding Screenshots

Place screenshots in apps/docs/public/images/ and reference an existing asset:

![CI checks passed in the deployment workflow](/images/checks-passed.png)

Via URL

For screenshots hosted on Vercel Blob or another approved external source:

![AI Chat interface](https://<your-blob>.public.blob.vercel-storage.com/canvas-forge/chat.png)

Recommended Screenshots

AI Chat

  • Chat interface with tool response
  • Location selector dropdown
  • Form submission confirmation

Forms

  • Form builder interface
  • Field configuration panel
  • Form submission success

Reports

  • Shift report form
  • Manager report with employee reviews
  • Slack notification example

Incidents

  • Incident list view
  • Incident detail with comments
  • Escalation confirmation

Admin

  • User management table
  • Compliance dashboard
  • Analytics overview

Annotations

For tutorial screenshots, add annotations in the image editor before publishing. Keep the source screenshot and the annotated screenshot as separate files when both versions are useful.

Placeholder Strategy

Do not publish a missing image path or a fake CSS placeholder. Add the real asset under apps/docs/public/images/ first, then reference it with descriptive alt text.

Image Optimization

Files under public/images/ are served as static assets. Plain Markdown and <img> references are not automatically transformed into optimized Next.js images; use next/image only in React components that need its optimization pipeline.

PWA & Offline Shell

Installable Danvas shell with safe offline recovery

API Reference

Programmatic access to the Danvas platform

On this page

Screenshot GuidelinesRecommended ToolsRequirementsAdding ScreenshotsVia URLRecommended ScreenshotsAI ChatFormsReportsIncidentsAdminAnnotationsPlaceholder StrategyImage Optimization