Onboarding overhaul: slim wizard, progress widget, guided activation UX

Setup Wizard: reduced from 10 steps to 5 (Company Info → QB Migration →
Pricing Defaults → Named Ovens → Notifications). Removed Doc Numbering,
Job Settings, Payment Terms, Pricing Tiers, and Team Members steps — these
all have sensible defaults and are accessible any time in Company Settings.
Wizard now completes in ~5 minutes instead of 15–20.

Dashboard progress widget (new): "Get the most out of your shop" checklist
appears for Company Admins after wizard completion. Tracks six post-setup
activation tasks with dynamic progress badge, motivating subtitle copy,
collapsed-state persistence via localStorage, and a full completion state
("Your shop is fully set up 🎉") that replaces the checklist at 100%.
The next recommended step is highlighted with a solid CTA button and a
subtle blue row tint. Completed steps show encouraging green subtext instead
of just "Done". Widget disappears from controller when AllDone would have
caused a silent vanish — now renders the completion state instead.

Guided activation (Daily Board): rewrote the BoardIntroStep callout to lead
with "This is your shop in real time" and a plain-English description of the
board's purpose. Added a separate InstructionText field to
GuidedActivationCalloutViewModel so the "Move this job to the next stage"
action prompt renders as a distinct bold line with an arrow icon rather than
being buried in the body copy. After the stage change, the confirmation
callout now reads "Nice — your workflow just updated" to reinforce what just
happened before prompting the invoice step.

All copy passes the "shop owner, not SaaS" test: no technical jargon,
benefit-driven descriptions, natural language throughout.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-04-28 21:10:47 -04:00
parent 4d27a378ac
commit 8aae30765f
30 changed files with 10870 additions and 333 deletions
@@ -2,6 +2,7 @@
@{
ViewData["Title"] = "Setup Complete!";
var progress = ViewBag.Progress as WizardProgressDto ?? new WizardProgressDto();
var showGuidedActivationCta = (bool?)ViewBag.ShowGuidedActivationCta ?? false;
}
@section Styles {
@@ -79,24 +80,28 @@
<p style="color:rgba(255,255,255,0.8);font-size:1.05rem;max-width:500px;margin:0 auto 1.5rem;">
Your setup is complete. @progress.DoneSteps.Count of @WizardProgressDto.TotalSteps steps were configured — your shop is ready to roll.
</p>
<a asp-controller="Dashboard" asp-action="Index" class="btn btn-light btn-lg px-5 fw-semibold">
<i class="bi bi-house me-2"></i>Go to Dashboard
</a>
@if (showGuidedActivationCta)
{
<a asp-controller="GuidedActivation" asp-action="Start" class="btn btn-light btn-lg px-5 fw-semibold">
<i class="bi bi-play-circle me-2"></i>Start First Workflow
</a>
}
else
{
<a asp-controller="Dashboard" asp-action="Index" class="btn btn-light btn-lg px-5 fw-semibold">
<i class="bi bi-house me-2"></i>Go to Dashboard
</a>
}
</div>
@{
var stepLabels = new Dictionary<int, (string Label, string Icon)>
{
{ 1, ("Company Profile", "bi-building") },
{ 2, ("QB Migration", "bi-arrow-left-right") },
{ 3, ("Operating Costs", "bi-currency-dollar") },
{ 4, ("Shop Ovens", "bi-fire") },
{ 5, ("Doc Numbering", "bi-palette") },
{ 6, ("Job Settings", "bi-diagram-3") },
{ 7, ("Payment Terms", "bi-file-earmark-text") },
{ 8, ("Pricing Tiers", "bi-percent") },
{ 9, ("Notifications", "bi-bell") },
{ 10, ("Team Members", "bi-people") },
{ 1, ("Company Profile", "bi-building") },
{ 2, ("QB Migration", "bi-arrow-left-right") },
{ 3, ("Operating Costs", "bi-currency-dollar") },
{ 4, ("Shop Ovens", "bi-fire") },
{ 5, ("Notifications", "bi-bell") },
};
}
@@ -146,7 +151,16 @@
<a asp-controller="CompanySettings" asp-action="Index" class="btn btn-outline-primary">
<i class="bi bi-gear me-1"></i>Open Company Settings
</a>
<a asp-controller="Dashboard" asp-action="Index" class="btn btn-primary">
<i class="bi bi-house me-1"></i>Go to Dashboard
</a>
@if (showGuidedActivationCta)
{
<a asp-controller="GuidedActivation" asp-action="Start" class="btn btn-primary">
<i class="bi bi-play-circle me-1"></i>Start First Workflow
</a>
}
else
{
<a asp-controller="Dashboard" asp-action="Index" class="btn btn-primary">
<i class="bi bi-house me-1"></i>Go to Dashboard
</a>
}
</div>