Team Retro is a collaborative retrospective board application designed to help teams conduct structured retrospective sessions. The application guides participants through collecting ideas, organizing them into groups, voting on priorities, and creating action items. Built with modern web technologies (Angular 19 and Firebase), it enables real-time collaboration while providing facilitators with tools to effectively manage the retrospective process.
- Provide a structured approach to team retrospectives
- Enable real-time collaboration among team members
- Support both in-person and remote retrospective sessions
- Guide teams through the standard retrospective workflow
- Make facilitation easier with dedicated tools and features
- Deliver a responsive experience that works across devices
- Creates and configures retrospective boards
- Controls the flow through different phases
- Has administrative privileges (edit, delete any content)
- Can view participant status and completion
- Manages board access and visibility
- Contributes ideas during submission phase
- Helps organize ideas into logical groups
- Votes on priorities
- Creates and is assigned action items
- Can only edit/delete their own content (with exceptions)
- View-only access to the board
- Cannot contribute ideas, create groups, vote, or create action items
- Can see real-time updates as they happen
A key architectural consideration is separating the concept of a Board (the persistent container) from a Session (the time-bound collaborative event):
- Board: A persistent container for categories, ideas, groups, and action items
- Session: A time-bound collaborative event with phases, participant tracking, and settings
This separation allows for:
- Pre-session idea collection
- Multiple sessions using the same board over time
- Preserving historical data while starting fresh sessions
Retrospectives follow a structured sequence of phases:
- Pre-Session: Board creation and configuration
- Pre-Submission: Session begins, participants see the board but submission isn't open
- Submission: Participants add ideas to categories
- Post-Submission: Ideas are locked from editing
- Grouping: Ideas are organized into logical groups
- Post-Grouping: Groups are locked from changes
- Voting: Participants allocate votes to ideas/groups
- Finished: Results are displayed and action items created
Both ideas and groups can be voted on, sharing common behaviors and properties. This concept of "votable entities" is important for:
- Consistent vote allocation logic
- Unified display of voting results
- Shared permission handling
The application should provide true real-time collaboration where:
- All changes are instantly visible to all participants
- Multiple people can work simultaneously
- User presence is indicated (who's online, who's done)
- Conflicts are automatically resolved
- Any authenticated user can create a board
- Board requires a title and optional description
- Creator configures:
- Board visibility (public, private, hidden)
- Categories with custom names, icons, and colors
- Whether pre-session submissions are allowed
- Whether to keep submissions anonymous until the end
- Maximum ideas per participant (default: unlimited)
- Facilitator controls phase transitions
- Each phase has its own UI and interaction model
- Participant status is tracked for each phase
- Optional timers can be set for time-boxing phases
- All participants see the same phase at the same time
- Participants enter ideas within categories
- Ideas are color-coded based on original category
- Participants mark themselves as "done" when finished
- Facilitators can see who is still submitting
- If enabled, ideas remain anonymous until the final phase
- Ideas can be dragged and dropped to form groups
- Groups can be named and reorganized
- Any participant can create and modify groups
- AI clustering can suggest initial groupings (optional)
- Empty groups persist until deleted
- Facilitator configures voting parameters:
- Total votes per participant
- Whether multiple votes per item are allowed
- Whether to allow voting on ideas, groups, or both
- Maximum votes per category (if desired)
- Participants allocate their votes
- System prevents exceeding vote limits
- Visual indicators show remaining votes
- Created during the Finished phase
- Include description, assignee, and optional due date
- Linked to specific ideas or groups
- Status can be tracked (pending, in-progress, completed)
- Can be exported for follow-up
- Special view for displaying during live sessions
- Shows current phase, timer, and participant status
- Does not show input fields or controls
- Can be opened in a separate window while facilitator participates
- Supports "step through" feature for reviewing results by category
The data model should balance real-time collaboration needs with scalability concerns:
- Consider collection hierarchy that reflects domain relationships
- Use sub-collections for related data (ideas, groups, action items)
- Carefully design document structure to minimize contention
- Consider how to model votable entities (ideas and groups)
- Design data structure to support efficient queries and real-time updates
To ensure the application performs well at scale:
- Avoid hotspots in data access patterns
- Consider document size and update frequency
- Design for efficient querying
- Implement appropriate security rules
For effective collaboration:
- Use Firestore's real-time capabilities with appropriate listeners
- Implement optimistic UI updates for responsiveness
- Design conflict resolution strategies
- Balance client-side state with server state
- Handle offline scenarios and reconnection
The application should use modern Angular patterns:
- Leverage Angular Signals for reactive state management
- Use computed values for derived state
- Create service-based state management
- Follow unidirectional data flow principles
- Balance local component state with shared app state
- Participant view should work well on mobile devices
- Facilitator view optimized for larger screens
- Adaptive layouts that respond to screen size
- Touch-friendly interactions for all core features
- Clean, minimal interface that puts focus on content
- Clear visual hierarchy to guide attention
- Consistent use of color and typography
- Visual cues for current phase and status
- Material Design patterns for familiarity and usability
- Intuitive drag-and-drop interfaces
- Clear visual feedback for all interactions
- Appropriate animations for state transitions
- Error prevention through constraints and validation
- Helpful guidance throughout the process
- Integration with project management tools
- Export to Google Workspace (Docs, Sheets)
- Email notifications for action items
- Calendar integration for scheduled retrospectives
- Advanced analytics and retrospective trends
- Template library for common retrospective formats
- Multi-team retrospectives
- Custom branding and theming
- Advanced export options (PDF, presentations)