Skip to main content
The Explore Section
Updated over a week ago

Play's Explore Section is a compilation of example projects we’ve created using various layouts and interactions. You can find the Explore Section in the macOS Lobby, split between two tabs: Gallery and Templates. All projects in both tabs can be duplicated into your team where you can edit and customize the project. Just double-click on a project to duplicate it to your drafts or projects, depending on your plan.

Gallery

The Gallery tab contains the existing demo projects that were previously in the Explore/Learn section. We’ll continue adding more full demo projects to the Gallery, and we’d love your suggestions.

Featured Projects

You'll find three featured demo projects at the top of the Learn section. These projects include multiple pages and many interactions, so you can see how powerful prototypes in Play can be.

Each of these projects has a button that says "Copy to My Drafts" that, when pressed, will create a duplicate version of the project in your drafts that you can look around and edit.

Links to Get Started

Under the featured projects are several links to resources for beginners.

The Learn the Basics card will duplicate our starter project into your drafts. This project walks you through the basics of Play in the app.

The Play 101 card will take you to our course on Circle. You'll learn the basics by watching videos and following along with our Play 101 project.

The Video Tutorials card will take you to our YouTube channel where you'll find short, helpful videos about tons of topics in Play.

Explore Tutorials

Under the links to get started, there are a ton of demo projects, each tackling a specific interaction. Some projects in this section have a video tutorial and step-by-step walkthrough, so you can understand how the interaction works. You'll find the tutorial video is embedded into the demo project and the article is linked.

When you click on one of the demo projects, a version of it will be copied to your drafts. You can edit the project and follow along with the tutorial there.

Templates

The Template tab focuses on common UI patterns and interactions. These projects are basic, focused on isolating one interaction to help you understand the specific concept. The Templates tab also includes our first iteration of Play Library, which is a set of common UI components that we’ve pre-built.

Touch

  1. Touch up & down

  2. Move To Touch

  3. Accordions

  4. Invert Instance

  5. Press to expand

Scroll

  1. Parallax scroll

  2. Scroll Effects

  3. Set Scroll · Anchors

  4. Change Header on Scroll

  5. Scroll To · Set Property

  6. Scroll Progress Bar

Pan & Drag

  1. Drag Around

  2. Swipe Actions

Sensors & Camera

  1. Haptics

  2. Take Photo

  3. Access Photo Library

  4. Gyroscope 3D Card

  5. Gyroscope Rotate (level)

Maps

  1. Map + List

  2. Map + Carousel

Navigation

  1. Tab Bar + 4 Pages

  2. Open Sheet

Drawers & Overlays

  1. Bottom Drawer

  2. Swipe In menu

Both the templates and Play Library components can be copied into a project and customized.

Did this answer your question?