👋 Welcome to the ShapeDiver tutorial library!
Introduction
In this library, you will find Grasshopper definitions demonstrating various ShapeDiver features. Before you get started, here are some helpful links:
- ❓ What is ShapeDiver?
- 👤 Create an account to the platform and start exploring.
- 🦗 Download the latest version of the ShapeDiver plugin for Grasshopper.
- ⬆️ Start uploading Grasshopper definitions to your account and generate online applications instantly!
How to use the tutorials
Each definition of this library doubles as a tutorial with in-depth explanations of the various steps to get a specific plugin functionality up and running:
Browse the various sections to read a description of what each tutorial covers, and a hint about the tutorial level:
★ ☆ ☆ : Beginner
★ ★ ☆ : Intermediate
★ ★ ★ : Expert
💡 Use the navigation on the left to browse sections.
The definitions are regularly updated to the latest version of the ShapeDiver plugin and ready to be uploaded to the ShapeDiver platform, but you can of course use them to get started and start developing your own designs.
Let’s get started!
Basics
| Ref | Description | ShapeDiver links | Grasshopper definition | Level |
|---|---|---|---|---|
| 1A | Basic example without the ShapeDiver plugin | Model | Download | ★ ☆ ☆ |
| 1B | Basic example with the ShapeDiver plugin | Model | Download | ★ ☆ ☆ |
Inputs
| Ref | Resources | Description | ShapeDiver links | Grasshopper definition | Level |
|---|---|---|---|---|---|
| 2A | 📖 | Direct Text Input | Model | Download | ★ ☆ ☆ |
| 2B | 📖 🎥 | File Imports | Model | Download | ★ ☆ ☆ |
| 2C | Use attributes to import properties and user text | Model | Download / Input | ★ ★ ☆ | |
| 2D | 📖 🎥 | Selection Input 1 - Basic Tutorial | App | Download | ★ ☆ ☆ |
| 2E | 📖 🎥 | Selection Input 2 - Influence Geometry and Context | App | Download | ★ ★ ☆ |
| 2F | 📖 | Gumball Input 1 - Basic Tutorial | App | Download | ★ ☆ ☆ |
| 2G | 📖 🎥 | Gumball Input 2 - Loop Transformations | App | Download | ★ ★ ☆ |
| 2H | 📖 | Gumball Input 3 - Dynamic Transformable Objects | App | Download | ★ ★ ★ |
| 2I | 📖 🎥 | Points Input 1 - Basic Tutorial | App | Download | ★ ★ ☆ |
| 2J | 📖 🎥 | Points Input 2 - Geometry Constraints | App | Download | ★ ★ ☆ |
| 2K | Create Image Pickers using Value List Settings | App | Download | ★ ★ ☆ | |
| 2L | Create and Override Slider Settings | App | Download | ★ ☆ ☆ |
Outputs
| Ref | Resources | Description | ShapeDiver links | Grasshopper definition | Level |
|---|---|---|---|---|---|
| 3A | 📖 | Export Components - Basic Tutorial | Model | Download | ★ ☆ ☆ |
| 3B | 📖 | Use attributes to export document properties | Model | Download | ★ ☆ ☆ |
| 3E | 📖 | Direct Data Output - All data types | Download | ★ ☆ ☆ | |
| 3H | 📖 | Export archives with multiple files | Model | Download | ★ ☆ ☆ |
Display
| Ref | Description | ShapeDiver links | Grasshopper definition | Level |
|---|---|---|---|---|
| 4A | Display Basic Tutorial - Overview | Model | Download | ★ ☆ ☆ |
| 4B | Materials Presets | Model | Download | ★ ☆ ☆ |
| 4C | Rendering Guide: Make Models Look Great Online | App | Download / START / After Chapter 2 / After Chapter 3 / After Chapter 4 / FINAL | ★ ★ ☆ |
Images
| Ref | Description | ShapeDiver links | Grasshopper definition | Level |
|---|---|---|---|---|
| 5A | Introduction to Grasshopper Bitmaps | Model | Download | ★ ☆ ☆ |
| 5B | ShapeDiver Image Sampler | Model | Download | ★ ☆ ☆ |
| 5C | ShapeDiver Image to Mesh | Model | Download | ★ ☆ ☆ |
| 5D | Use the Squid plugin to generate Bitmaps | Model | Download | ★ ★ ☆ |
| 5Dbis | Use the Squid plugin to generate Pdfs | Model | Download | ★ ★ ☆ |
JSON
| Ref | Description | ShapeDiver links | Grasshopper definition | Level |
|---|---|---|---|---|
| 6A | Introduction to JSON object manipulation | Download | ★ ☆ ☆ |
Attributes
| Ref | Resources | Description | ShapeDiver links | Grasshopper definition | Level |
|---|---|---|---|---|---|
| 7A | 📖 | Attribute Visualization 1 - Basic Tutorial | Model / App | Download | ★ ☆ ☆ |
Plugins & Integrations
| Ref | Resources | Description | ShapeDiver links | Grasshopper definition | Level |
|---|---|---|---|---|---|
| 8A | 📖 🎥 | Publish data to a Speckle model | App | Download | ★ ☆ ☆ |
| 8B | 📖 🎥 | Load data from a Speckle model | App | Download | ★ ☆ ☆ |
| 8C | 📖 | Exchange data with a Skema project | App | Download | ★ ☆ ☆ |
| 8D | 📖 🎥 | Create a Shopify configurator | App | Download | ★ ☆ ☆ |
App Builder
Some examples using App Builder.
Full workflows
| Ref | Description | ShapeDiver links | Grasshopper definition | Files | Level |
|---|---|---|---|---|---|
| 11A | App Builder 1 - Basic Tutorial | Model / App | Download | ★ ☆ ☆ | |
| 11B | App Builder 2 - Contextual UI | Model / App | Download | Input | ★ ☆ ☆ |
| 11C | App Builder 3 - Link Exports with Image Widgets | Model / App | Download / Input | ★ ★ ☆ | |
| 11D | App Builder 4 - Charts and Graphs | Model / App | Download | ★ ★ ★ |
Components
| Ref | Description | ShapeDiver links | Grasshopper definition | Level |
|---|---|---|---|---|
| 11E | Parameter and Export Controls | Model / App | Download | ★ ☆ ☆ |
| 11F | Action Control | Model / App | Download | ★ ☆ ☆ |
| 11G | Accordion and Stack Widgets | Model / App | Download | ★ ☆ ☆ |
Interaction inputs in App Builder
| Ref | Resources | Description | ShapeDiver links | Grasshopper definition | Level |
|---|---|---|---|---|---|
| 2D | 📖 🎥 | Selection Input 1 - Basic Tutorial | App | Download | ★ ☆ ☆ |
| 2E | 📖 🎥 | Selection Input 2 - Influence Geometry and Context | App | Download | ★ ★ ☆ |
| 2F | 📖 | Gumball Input 1 - Basic Tutorial | Model / App | Download | ★ ☆ ☆ |
| 2G | 📖 🎥 | Gumball Input 2 - Loop Transformations | Model / App | Download | ★ ★ ☆ |
| 2H | 📖 | Gumball Input 3 - Dynamic Transformable Objects | Model / App | Download | ★ ★ ★ |
| 2I | 📖 🎥 | Points Input 1 - Basic Tutorial | Model / App | Download | ★ ★ ☆ |
| 2J | 📖 🎥 | Points Input 2 - Geometry Constraints | Model / App | Download | ★ ★ ☆ |
Desktop Clients
ShapeDiver Apps can interact with so-called “Desktop Clients”, allowing to send and receive geometry from local software environments in real-time. So far, Rhino and Adobe Illustrator are supported as desktlop clients, as well as some custom integratiosn with industry-specific software. Get in touch if you would like us to support other desktop clients.
| Ref | Description | ShapeDiver links | Grasshopper definition | Level |
|---|---|---|---|---|
| 12A | Desktop Clients 1 - Basic Tutorial | Model / App | Download | ★ ☆ ☆ |
Webinar examples
| Ref | Description | ShapeDiver links | Grasshopper definition | Level |
|---|---|---|---|---|
| 2410A | 🎥 Fall ’24 Update: Barcelona Neighborhood Analysis (Interactions components and Dynamic Parameters) | Model / App | Download | ★ ★ ☆ |
| 2410B | 🎥 Fall ’24 Update: Modular cabinets configurator (Interactions components and Dynamic Parameters) | Model / App | Download | ★ ★ ★ |
| 2503A | 🎥 Spring ’25 Update: Speckle pavillion | Model / App | Download | ★ ★ ☆ |
| 2503B | 🎥 Spring ’25 Update: Shopify workflow | Model / App | Download | ★ ★ ☆ |
| 2605 | 🎥 Food4Rhino ’26 Update | App | Download | ★ ★ ☆ |
Beta features
The features showcased in the following models are already available in App Builder but the corresponding Grasshopper components are not yet available in the plugin. Instead, the features are included using prototype JSON objects.
Note that the final components and component flow might differ from the current JSON version of these definitions.
Some of the examples below make use of the JSwan Grasshopper plugin (version 1.2.0).
Dynamic inputs
| Ref | Description | ShapeDiver links | Grasshopper definition | Level |
|---|---|---|---|---|
| BETA | Beta - Dynamic Sliders | Model / App | Download | ★ ★ ☆ |
| BETA | Beta - Dynamic Value Lists | Model / App | Download | ★ ★ ☆ |
| BETA | Beta - Dynamic Points Input | Model / App | Download | ★ ★ ☆ |
Misc
| Ref | Description | ShapeDiver links | Grasshopper definition | Level |
|---|---|---|---|---|
| BETA | Beta - Searchable Value Lists | Model / App | Download | ★ ☆ ☆ |
| BETA | Beta - Multiline Text Inputs | Model / App | Download | ★ ☆ ☆ |
| BETA | Control Instances of other ShapeDiver Models | App | Download / Parametric Box | ★ ★ ☆ |
| BETA | Containers with 3D Anchors in the Scene | Model / App | Download | ★ ★ ☆ |
| BETA | Containers with 2D Anchors on the Screen | Model / App | Download | ★ ★ ☆ |
| BETA | Beta - Play a Sound | Model / App | Download | ★ ☆ ☆ |
| BETA | Beta - Loop Model State Values back to Grasshopper | Model / App | Download | ★ ☆ ☆ |
| BETA | Beta - Loop Screenshot back to Grasshopper | Model / App | Download | ★ ☆ ☆ |
| BETA | Beta - Form widget | Model / App | Download | ★ ☆ ☆ |
| BETA | Beta - Camera Action | Model / App | Download | ★ ★ ☆ |
| BETA | Beta - Saved States Widget | Model / App | Download | ★ ☆ ☆ |