Workspace Tour
The PrototypeTool workspace is organized around three main areas: the dashboard for managing projects and team activity, the project editor for building prototypes, and the preview mode for testing and sharing interactive experiences.
This tour covers the key areas and their functions so you can navigate confidently from your first session.
Navigating the PrototypeTool workspace
The workspace is the top-level container for everything your team creates. All projects, shared components, design tokens, and team settings live within it. When you log in, you land on the dashboard, which shows recent projects, team activity, and quick-access actions.
The workspace organization supports both individual and team workflows. Private drafts stay in your personal section until you share them. Shared projects are organized into team folders. Archived projects are accessible but hidden from the active view to reduce clutter.
The command palette (accessible via keyboard shortcut) is the fastest way to navigate. Type any project name, screen name, or component name and jump directly to it. Most experienced users rely on the command palette more than the sidebar for navigation.
Exploring workspace features
- The dashboard shows recent projects, pinned projects, and a team activity feed. Customize the layout by pinning your most-used projects and collapsing sections you rarely check.
- The project editor opens when you select a project. The canvas occupies the center, the component panel sits on the left, and the properties panel is on the right. The bottom bar holds the states panel and the timeline.
- The component panel lists all components available to the current project — local components, workspace library components, and built-in primitives. Search and filter to find components quickly.
- The properties panel shows configuration for the selected element. Here you set dimensions, colors, text properties, triggers, conditions, and variable bindings. Different element types show different property sections.
- Preview mode renders the prototype as end users would experience it. The editor interface disappears, and you interact with the prototype directly. Use the debug overlay to see variable values and triggered events during preview.
- The share dialog generates links for different audiences — interactive preview for testers, comment-enabled view for reviewers, and read-only view for stakeholders. Each link type has its own permission level.
Workspace organization pitfalls
- Not creating project folders from the start. A flat list of twenty projects becomes unmanageable quickly. Organize by team, product area, or project phase from day one.
- Ignoring the archive feature and keeping completed or abandoned projects in the active view. Archive projects that are no longer being edited to keep the dashboard focused.
- Not using the search function for navigation. Browsing through folder trees is slow. Use the command palette or search bar for faster access.
- Creating multiple workspaces when team folders would suffice. Multiple workspaces prevent component and design system sharing. Use one workspace with team-level organization.
- Not configuring notification preferences. Default notifications for all workspace activity create noise. Customize notifications to receive alerts only for projects and events relevant to your role.
Measuring workspace utilization
- Active project ratio: The percentage of workspace projects edited within the last thirty days. A low ratio suggests too many dormant projects cluttering the workspace.
- Search-to-browse ratio: How often team members use search versus folder browsing to find projects. Higher search usage indicates either good search habits or poor folder organization.
- Component library usage: How many projects reference shared workspace components versus creating local duplicates. Higher library usage indicates effective centralization.
- Archive rate: The percentage of completed projects that are archived within one week of their final review. Prompt archiving keeps the workspace clean.
When to reorganize your workspace
- When team members report difficulty finding projects or components, indicating the current organization has outgrown its structure.
- When a new team joins the workspace and needs their own project folder and component library sections.
- After a major product release when many prototype projects transition from active to reference-only status and should be archived.
- When the component library has grown large enough to need subcategories, versioning, or a contribution process that the current structure does not support.
Key concepts
- Dashboard: The main workspace view showing recent projects, team activity, and quick-access links to common actions.
- Project panel: The sidebar within a project that organizes screens, components, variables, and interaction rules.
- Preview mode: A view that renders the prototype as end users would experience it, without editor controls visible.
FAQ
- Can I customize the dashboard layout? Yes. Pin frequently used projects and rearrange sections to match your workflow.
- How do I navigate between projects quickly? Use the command palette (keyboard shortcut) to search and jump to any project, screen, or component by name.
- What do the activity indicators on the dashboard mean? They show recent edits, comments, and decisions across your workspace. Use them to quickly find where active work is happening.
Next steps
Open your workspace and walk through each area described above. Create one prototype screen, add an annotation, and invite a colleague to comment. This hands-on walkthrough builds familiarity faster than reading alone.