# doany.ai Onboarding — Premium UX Critique **Prepared for:** Executive Review, 2026-04-13 **Audited by:** Product Design Review **Severity scale:** Critical / High / Medium / Low --- ## Executive Summary The current onboarding suffers from 10 structural issues that collectively signal "free-tier SaaS" rather than the premium positioning doany.ai requires. The 34% completion rate is a direct consequence of cognitive overload on step 1 (8 fields + checkbox before any value is delivered), zero feedback on user actions, and broken trust signals (plaintext password, invisible terms text, no error recovery). **The core problem is not cosmetic — it's architectural.** The flow asks for everything before delivering anything. Premium onboarding inverts this: lead with value, defer data collection, reward progress. --- ## Critique By Principle ### 1. Cognitive Overload — Step 1 Form Wall | | | |---|---| | **Observation** | Step 1 presents 8 form fields + checkbox + CTA simultaneously. The user sees a wall of inputs before understanding what doany.ai does for them. | | **Principle** | Progressive disclosure & cognitive load reduction. Users process 3-4 chunks of information at a time (Miller's Law). | | **Impact** | 66% abandonment. Users who came curious leave overwhelmed. The form communicates "we need things from you" instead of "here's what we'll do for you." | | **Alternative** | Reduce step 1 to email + password only. Move company/role/team-size to a later personalization step. Defer confirm-password (use show/hide toggle instead). | | **Trade-off** | Fewer data points captured upfront, but dramatically higher completion. Missing fields can be collected progressively post-onboarding. | | **Severity** | **Critical** | ### 2. No Progress Indicator | | | |---|---| | **Observation** | Users navigate 4 steps with zero indication of position or remaining effort. | | **Principle** | Goal-gradient effect — users accelerate as they perceive proximity to completion. Without a progress signal, each step feels equally distant from "done." | | **Impact** | Anxiety and drop-off increase at each step. Users can't make an informed decision about whether to continue. | | **Alternative** | Segmented progress bar with step labels. Show current step highlighted with completed steps checked. | | **Trade-off** | Minimal implementation cost. Pure upside. | | **Severity** | **High** | ### 3. Inconsistent Visual System | | | |---|---| | **Observation** | Button colors change per step: orange (#ff6633) on step 1, green (#28a745) on step 3, blue (#007bff) on step 4. Heading sizes vary (20px, 18px, 16px). Text colors are arbitrary (#888, #666, #555, #999, #aaa, #ccc, #bbb). | | **Principle** | Systematic coherence (Ive Principle #4). Every element must belong to a unified system. Random color/size variation signals that no designer touched this. | | **Impact** | Erodes trust. Executives, investors, and design-literate users register inconsistency subconsciously as "unfinished product." | | **Alternative** | Single primary color for all CTAs. Typographic scale with semantic meaning. Neutral palette with clear hierarchy (900/600/400 for text levels). | | **Trade-off** | None. This is table stakes. | | **Severity** | **Critical** | ### 4. Low Contrast / Invisible Text | | | |---|---| | **Observation** | Labels are #999 on white (contrast ratio ~2.8:1). Terms text is #bbb (~1.9:1). Step 3 description is #ccc (~1.6:1). All fail WCAG AA (minimum 4.5:1). | | **Principle** | Accessibility as standard, not afterthought (Ive Principle #8). | | **Impact** | Legally non-compliant (ADA/WCAG). Functionally unreadable for ~15% of users with mild vision impairment. The terms checkbox — a legal requirement — is nearly invisible. | | **Alternative** | Labels at #4B5563 (neutral-600, ratio 7.1:1). Secondary text at #6B7280 (ratio 5.4:1). Never below 4.5:1 for any text. | | **Trade-off** | Slightly more visual weight on labels, but that's desirable — labels should be readable. | | **Severity** | **Critical** | ### 5. No Loading States | | | |---|---| | **Observation** | Clicking "Sign Up" triggers no visible feedback. No spinner, no disabled state, no progress indication. | | **Principle** | Feedback imediato — every action must have a visual response. The 100ms threshold for perceived instantaneity is well-documented (Nielsen). | | **Impact** | Users click repeatedly, potentially triggering duplicate submissions. The product feels broken/frozen. This is the #1 signal of amateur engineering. | | **Alternative** | Button shows spinner + "Creating account..." on click. Button becomes disabled. Subtle progress animation on the card. | | **Trade-off** | None. Pure upside. | | **Severity** | **Critical** | ### 6. Empty State is Depressing | | | |---|---| | **Observation** | Post-onboarding shows: "No projects yet." in #ccc, centered, with nothing else. No illustration, no CTA, no guidance. | | **Principle** | Empty states are the highest-leverage moment in product design. The user just invested effort completing onboarding — this is when excitement peaks. A dead-end kills momentum. | | **Impact** | Users who successfully onboarded now feel abandoned. "No projects yet" reads as accusatory — it's the user's fault the screen is empty. | | **Alternative** | Illustration + "Your workspace is ready. Create your first project to get started." + prominent CTA + optional quick-start templates. | | **Trade-off** | Requires illustration asset. SVG inline illustration is sufficient for the prototype. | | **Severity** | **High** | ### 7. No Error States | | | |---|---| | **Observation** | No validation, no error messages, no error styling. Invalid email, empty fields, network failures — all silent. | | **Principle** | Error prevention first, then clear recovery. Users must never wonder "did that work?" | | **Impact** | Users submit incomplete forms, hit API errors silently, and blame themselves. Support tickets increase. Trust collapses. | | **Alternative** | Inline validation with contextual error messages below each field. Network error banner with retry. Field-level error highlighting (red border + message). | | **Trade-off** | More JS logic, but this is non-negotiable for production. | | **Severity** | **Critical** | ### 8. Broken Keyboard Navigation / Accessibility | | | |---|---| | **Observation** | No focus-visible styles. CTAs are `
` elements (not `