# Tai Labs design exploration

## Recommendation

Start from **Studio** for the strongest balance: learning feels calm and valuable, the people remain visible, and business workspaces feel credible. Use Club's conversation-first community home and Horizon's film-led storytelling where enterprise awareness matters.

## Three directions

| Concept | Landing page | Community home | Business workspace | Trade-off |
| --- | --- | --- | --- | --- |
| Horizon | Full-bleed London film, ambitious headline, mint accents, prominent proof | A cinematic weekly challenge leads into a practical feed | Quiet neutral surfaces, clear aggregates and programme progress | Most enterprise confidence; imagery needs restraint inside the product |
| Studio | Split editorial layout, arched architectural image, floating learning card | Large learning cards followed by discussions | Natural extension of the same learning system | Best balance; less immediately social than Club |
| Club | Warm yellow, expressive serif headline, visible conversation cards | Community feed and shared challenge first | Structured team data inside a warmer shell | Strongest belonging; playful moments should stay out of critical reporting |

## Product architecture

One public brand front door, with community as the primary invitation. Programmes and the career accelerator are discoverable from that front door. A distinct business path leads to readiness discovery, custom role-based training and consulting. A business learner can participate in the public community, but private company content never leaks into that feed.

| Audience | Primary task | Priority components |
| --- | --- | --- |
| Community member | Find useful people, ask questions, build and share | Conversation feed, composer, topic filters, workshop reservation, contributor list, learning entry point |
| Career accelerator participant | Develop skills and evidence for the next role | Bootcamp → internship → career coaching, applied project brief, portfolio structure, mentoring preparation |
| Business learner | Complete relevant learning and apply it to work | Assigned programme, lesson progress, practice exercise, readiness check-in, private team discussion |
| Team manager | Understand capability gaps and move the programme forward | Aggregate check-ins, completion and projects, department filter, custom programmes, transformation roadmap |

The prototype audience selector is a review control, not an authorization design. Production needs authenticated users, organisation membership, role-based access checks on the server, and separate public/private data boundaries.

## Engagement loop

Find a relevant room → ask or share → receive useful feedback → apply it in a project → share the result. Keep learning and live sessions next to conversations so members have a clear next action. Reward usefulness, not empty activity. The contributor list demonstrates this direction; it is not a validated ranking algorithm.

## Proof and claims

The current homepage states **10,000+ professionals trained** and **4.8/5 across 100+ verified reviews**. This is training reach, not a claim about active community membership. Do not present fictional large room counts. Client marks (Modern Health, WireApps and MPB) remain distinct from employers of people trained (Google, Microsoft, Amazon and Capital One).

Published cases substantiate: Modern Health, three workshop tracks; WireApps, 50+ engineers; MPB, a two-day programme. Alumni outcomes are summaries from Tai Labs, not invented quotations or outcome guarantees.

## Craft and references

Applied the user-requested Apple Design skill from Emil Kowalski's repository: platform typography, immediate press feedback, deliberate hierarchy, consistent spatial relationships, restrained motion, keyboard focus, modal dismissal, reduced motion, reduced transparency and increased contrast support. The user explicitly requested city video, so Horizon includes it with a pause control and static fallback despite the skill's general preference to avoid large moving backgrounds.

Generous course cards, restrained navigation, private learning workspaces and clear progress come from the best learning platforms. Confident enterprise storytelling, a legible social feed with rooms, live sessions and contributor context, and the London film as brand atmosphere are drawn from reference sites reviewed during the study.

The alumni portrait story is a custom vanilla-JavaScript adaptation of Manu Arora's MIT Animated Testimonials component listed on 21st.dev. The original component is included for provenance. The pixel reveal is original canvas code inspired by the public Sora Labs pattern on 21st.dev; no gated component source was copied.

## Implementation

Static HTML/CSS/JavaScript with local media. No package installation or external runtime is needed. All local state resets on reload. The readiness check-in uses experience, goal and barrier answers to suggest a practice step. It deliberately does not claim to produce a scientifically validated score. Manager percentages are calculated from the illustrative department data, including when filtered.

Production integration needs authentication, server-side tenant isolation, content management, persisted learning progress, moderation, real event scheduling, programme administration and an agreed readiness methodology. The mock forms do not transmit data. Corporate assessment responses should remain private, with aggregate reporting designed around an appropriate minimum reporting group.

## Sources

- https://tailabs.ai/
- https://tailabs.ai/case-studies/modern-health
- https://tailabs.ai/case-studies/wireapps
- https://tailabs.ai/case-studies/mpb
- https://github.com/emilkowalski/skills/tree/main/skills/apple-design
- https://21st.dev/@manuarora700/components/animated-testimonials
- https://ui.aceternity.com/registry/animated-testimonials.json
- https://21st.dev/@soralabs/components/pixelated-image-reveal
- https://mixkit.co/free-stock-video/buildings-in-the-city-of-london-4265/

Prepared September 2026. Prototype proof follows published Tai Labs claims, not an independent audit.

## Onboarding and growth extension

See [ONBOARDING-AND-GROWTH.md](ONBOARDING-AND-GROWTH.md) and the concept-specific guides in `concepts/`. The prototype now includes first visits, intent-based onboarding, direct business acquisition, invitations, verification previews, contextual membership upgrades and commercial recovery states. The current free team workspace is kept distinct from quoted custom training.
