Template:PT3 MAX WIN - Revision history

Mparadis at 21:39, 17 December 2024

2024-12-17T21:39:51Z

Patrick at 22:15, 17 October 2023

2023-10-17T22:15:33Z

← Older revision		Revision as of 22:15, 17 October 2023
Line 7:		Line 7:
	<div class="phd-panels">		<div class="phd-panels">
	<div class="phd-panel phd-flex-column-align-center phd-flex-column-justify-middle">		<div class="phd-panel phd-flex-column-align-center phd-flex-column-justify-middle">
	<div class="phd-lazy-image" data-src="https://~~www~~.phidgets.com/decks/PT3_MAX_WIN/200x-/50/max.jpg"></div>		<div class="phd-lazy-image" data-src="https://cdn.phidgets.com/decks/PT3_MAX_WIN/200x-/50/max.jpg"></div>
	</div>		</div>
	<div class="phd-panel phd-flex-column-align-left phd-flex-column-justify-top">		<div class="phd-panel phd-flex-column-align-left phd-flex-column-justify-top">
Line 31:		Line 31:
	<p>Next, download and unpack the Phidgets Max/MSP library:</p>		<p>Next, download and unpack the Phidgets Max/MSP library:</p>

	<p>● <span>[https://~~www~~.phidgets.com/downloads/phidget22/libraries/windows/Phidget22MaxMSP.zip Phidget Max/MSP library]</span></p>		<p>● <span>[https://cdn.phidgets.com/downloads/phidget22/libraries/windows/Phidget22MaxMSP.zip Phidget Max/MSP library]</span></p>
	</div>		</div>

Line 44:		Line 44:
	</ul>		</ul>

	<div class="phd-lazy-image" data-src="https://~~www~~.phidgets.com/decks/PT3_MAX_WIN/-x290/50/Max_externals.png"></div>		<div class="phd-lazy-image" data-src="https://cdn.phidgets.com/decks/PT3_MAX_WIN/-x290/50/Max_externals.png"></div>
	</div>		</div>

Line 54:		Line 54:
	</p>		</p>

	<div class="phd-lazy-image" data-src="https://~~www~~.phidgets.com/decks/PT3_MAX_WIN/-x290/50/Max_filepreferences.png"></div>		<div class="phd-lazy-image" data-src="https://cdn.phidgets.com/decks/PT3_MAX_WIN/-x290/50/Max_filepreferences.png"></div>
	</div>		</div>

Line 65:		Line 65:
	</p>		</p>

	<div class="phd-lazy-image" data-src="https://~~www~~.phidgets.com/decks/PT3_MAX_WIN/Max_folder.png"></div>		<div class="phd-lazy-image" data-src="https://cdn.phidgets.com/decks/PT3_MAX_WIN/Max_folder.png"></div>
	</div>		</div>

Line 76:		Line 76:
	</p>		</p>

	<div class="phd-lazy-image" data-src="https://~~www~~.phidgets.com/decks/PT3_MAX_WIN/-x325/50/Max_examples.png"></div>		<div class="phd-lazy-image" data-src="https://cdn.phidgets.com/decks/PT3_MAX_WIN/-x325/50/Max_examples.png"></div>
	</div>		</div>

Line 84:		Line 84:
	<p>From here, select an example that will work with your Phidget and open it in Max/MSP. You can run the example by simply pressing the <b>start</b> button:</p>		<p>From here, select an example that will work with your Phidget and open it in Max/MSP. You can run the example by simply pressing the <b>start</b> button:</p>

	<div class="phd-lazy-image" data-src="https://~~www~~.phidgets.com/decks/PT3_MAX_WIN/-x270/50/Max_run.png"></div>		<div class="phd-lazy-image" data-src="https://cdn.phidgets.com/decks/PT3_MAX_WIN/-x270/50/Max_run.png"></div>

	<p>		<p>
Line 114:		Line 114:
	<div class="phd-panels">		<div class="phd-panels">
	<div class="phd-panel phd-flex-column-align-center phd-flex-column-justify-top">		<div class="phd-panel phd-flex-column-align-center phd-flex-column-justify-top">
	<div class="phd-lazy-image" data-src="https://~~www~~.phidgets.com/decks/PT3_MAX_WIN/-x300/50/MSP_Example.png"></div>		<div class="phd-lazy-image" data-src="https://cdn.phidgets.com/decks/PT3_MAX_WIN/-x300/50/MSP_Example.png"></div>
	</div>		</div>
	<div class="phd-panel phd-flex-column-align-left phd-flex-column-justify-top">		<div class="phd-panel phd-flex-column-align-left phd-flex-column-justify-top">
Line 135:		Line 135:
	</p>		</p>

	<div class="phd-lazy-image" data-src="https://~~www~~.phidgets.com/decks/PT3_MAX_WIN/MaxMSP_GetSerial.png"></div>		<div class="phd-lazy-image" data-src="https://cdn.phidgets.com/decks/PT3_MAX_WIN/MaxMSP_GetSerial.png"></div>

	<p>		<p>
Line 143:		Line 143:
	</p>		</p>

	<div class="phd-lazy-image" data-src="https://~~www~~.phidgets.com/decks/PT3_MAX_WIN/MaxMSP_GetVoltage.png"></div>		<div class="phd-lazy-image" data-src="https://cdn.phidgets.com/decks/PT3_MAX_WIN/MaxMSP_GetVoltage.png"></div>
	</div>		</div>

Line 194:		Line 194:
	<p>In the case of a Voltage Input, we name it <b>PhidgetVoltageInput</b>:</p>		<p>In the case of a Voltage Input, we name it <b>PhidgetVoltageInput</b>:</p>

	<div class="phd-lazy-image" data-src="https://~~www~~.phidgets.com/decks/PT3_MAX_WIN/MaxMSP_VoltageInput_generic.png"></div>		<div class="phd-lazy-image" data-src="https://cdn.phidgets.com/decks/PT3_MAX_WIN/MaxMSP_VoltageInput_generic.png"></div>

	<p>		<p>
Line 202:		Line 202:
	</p>		</p>

	<div class="phd-lazy-image" data-src="https://~~www~~.phidgets.com/decks/PT3_MAX_WIN/MaxMSP_GetVoltage.png"></div>		<div class="phd-lazy-image" data-src="https://cdn.phidgets.com/decks/PT3_MAX_WIN/MaxMSP_GetVoltage.png"></div>
	</div>		</div>

Line 236:		Line 236:
	<p>For instance, to open a VoltageInput with serial number 349428, you would use:</p>		<p>For instance, to open a VoltageInput with serial number 349428, you would use:</p>

	<div class="phd-lazy-image" data-src="https://~~www~~.phidgets.com/decks/PT3_MAX_WIN/MaxMSP_VoltageInput_specific.png"></div>		<div class="phd-lazy-image" data-src="https://cdn.phidgets.com/decks/PT3_MAX_WIN/MaxMSP_VoltageInput_specific.png"></div>

	<p>Some other examples:</p>		<p>Some other examples:</p>
Line 265:		Line 265:
	<p>Next, in your patch you need a <b>PhidgetNet</b> object. To automatically find local networks, send it a message saying <b>enableServerDiscovery</b>.</p>		<p>Next, in your patch you need a <b>PhidgetNet</b> object. To automatically find local networks, send it a message saying <b>enableServerDiscovery</b>.</p>

	<div class="phd-lazy-image" data-src="https://~~www~~.phidgets.com/decks/PT3_MAX_WIN/MaxMSP_Enable_Server_Discovery.png"></div>		<div class="phd-lazy-image" data-src="https://cdn.phidgets.com/decks/PT3_MAX_WIN/MaxMSP_Enable_Server_Discovery.png"></div>

	<p>		<p>
Line 271:		Line 271:
	</p>		</p>

	<div class="phd-lazy-image" data-src="https://~~www~~.phidgets.com/decks/PT3_MAX_WIN/MaxMSP_Remote.png"></div>		<div class="phd-lazy-image" data-src="https://cdn.phidgets.com/decks/PT3_MAX_WIN/MaxMSP_Remote.png"></div>
	</div>		</div>

Line 303:		Line 303:
	</p>		</p>

	<div class="phd-lazy-image" data-src="https://~~www~~.phidgets.com/decks/PT3_MAX_WIN/-x100/50/MaxMSP_get_and_set.png"></div>		<div class="phd-lazy-image" data-src="https://cdn.phidgets.com/decks/PT3_MAX_WIN/-x100/50/MaxMSP_get_and_set.png"></div>

	<p>To sample at a fixed rate, use the start and stop messages to start and stop the data flow, respectively.</p>		<p>To sample at a fixed rate, use the start and stop messages to start and stop the data flow, respectively.</p>

	<div class="phd-lazy-image" data-src="https://~~www~~.phidgets.com/decks/PT3_MAX_WIN/-x65/50/MaxMSP_Start_Stop.png"></div>		<div class="phd-lazy-image" data-src="https://cdn.phidgets.com/decks/PT3_MAX_WIN/-x65/50/MaxMSP_Start_Stop.png"></div>
	</div>		</div>

Line 321:		Line 321:
	</p>		</p>

	<div class="phd-lazy-image" data-src="https://~~www~~.phidgets.com/decks/PT3_MAX_WIN/-x100/50/MaxMSP_Routing.png"></div>		<div class="phd-lazy-image" data-src="https://cdn.phidgets.com/decks/PT3_MAX_WIN/-x100/50/MaxMSP_Routing.png"></div>

	<p>		<p>
Line 328:		Line 328:
	</p>		</p>

	<div class="phd-lazy-image" data-src="https://~~www~~.phidgets.com/decks/PT3_MAX_WIN/-x80/50/MaxMSP_Error_Event.png"></div>		<div class="phd-lazy-image" data-src="https://cdn.phidgets.com/decks/PT3_MAX_WIN/-x80/50/MaxMSP_Error_Event.png"></div>
	</div>		</div>

Mparadis: Created page with "

Language - Max/MSP

..."

2021-03-08T21:45:57Z

Created page with "<div class="phd-slide-deck" data-deck="PT3_MAX_WIN"> <div class="phd-slide-deck-header"><h3>Language - Max/MSP</h3></div> <div class="phd-slides"> <div class="phd-slide"> <h2>..."

New page
<div class="phd-slide-deck" data-deck="PT3_MAX_WIN">
<div class="phd-slide-deck-header"><h3>Language - Max/MSP</h3></div>
<div class="phd-slides">
<div class="phd-slide">
<h2>Windows with Max/MSP</h2>

<div class="phd-panels">
<div class="phd-panel phd-flex-column-align-center phd-flex-column-justify-middle">
<div class="phd-lazy-image" data-src="https://www.phidgets.com/decks/PT3_MAX_WIN/200x-/50/max.jpg"></div>
</div>
<div class="phd-panel phd-flex-column-align-left phd-flex-column-justify-top">
<p>Welcome to using Phidgets with Max/MSP! By using Max/MSP, you will have access to the complete Phidget22 API, including events.</p>
<p>Phidget22 supports Max/MSP versions 6 and up.</p>
</div>
</div>
</div>

<div class="phd-slide">
<h2>Requirements</h2>

<p>First, make sure you have the following installed:</p>

<p>● Phidgets Drivers for Windows (see Part 1 of this user guide)</p>

<p>● <span>[https://cycling74.com/downloads Max/MSP]</span></p>
</div>

<div class="phd-slide">
<h2>Use Our Examples</h2>

<p>Next, download and unpack the Phidgets Max/MSP library:</p>

<p>● <span>[https://www.phidgets.com/downloads/phidget22/libraries/windows/Phidget22MaxMSP.zip Phidget Max/MSP library]</span></p>
</div>

<div class="phd-slide">
<h2>Use Our Examples</h2>

<p>After unpacking the download, navigate to the externals folder. Copy the following folder to your clipboard:</p>

<ul>
<li>For 32-bit Max/MSP, copy the <b>x86 folder</b></li>
<li>For 64-bit Max/MSP, copy the <b>x64 folder</b></li>
</ul>

<div class="phd-lazy-image" data-src="https://www.phidgets.com/decks/PT3_MAX_WIN/-x290/50/Max_externals.png"></div>
</div>

<div class="phd-slide">
<h2>Use Our Examples</h2>

<p>
The folder you copied needs to be placed in a specific location for Max/MSP to reference it. Open Max/MSP and navigate to <b>Options -> File Preferences</b>.
</p>

<div class="phd-lazy-image" data-src="https://www.phidgets.com/decks/PT3_MAX_WIN/-x290/50/Max_filepreferences.png"></div>
</div>

<div class="phd-slide">
<h2>Use Our Examples</h2>

<p>
The folder that you copied earlier needs to be placed in any of the locations listed in <b>File Preferences</b>. Navigate to one of the locations and paste the
folder:
</p>

<div class="phd-lazy-image" data-src="https://www.phidgets.com/decks/PT3_MAX_WIN/Max_folder.png"></div>
</div>

<div class="phd-slide">
<h2>Use Our Examples</h2>

<p>
The Phidget Max/MSP library is now being referenced. Next, navigate to the <b>examples</b> folder located within the Phidget22MaxMSP folder you previously
unpacked:
</p>

<div class="phd-lazy-image" data-src="https://www.phidgets.com/decks/PT3_MAX_WIN/-x325/50/Max_examples.png"></div>
</div>

<div class="phd-slide">
<h2>Use Our Examples</h2>

<p>From here, select an example that will work with your Phidget and open it in Max/MSP. You can run the example by simply pressing the <b>start</b> button:</p>

<div class="phd-lazy-image" data-src="https://www.phidgets.com/decks/PT3_MAX_WIN/-x270/50/Max_run.png"></div>

<p>
The example is now running. Play around with the device and experiment with some of the functionality. When you are ready, the next step is configuring your
project and writing your own code!
</p>
</div>

<div class="phd-slide">
<h2>Write Code</h2>

<p>
You should now have working examples and a project that is configured. This teaching section will help you understand how the examples were written so you can
start writing your own code.
</p>

<p>Remember: your main reference for writing Max/MSP code will be:</p>

<p>● The <span>[https://www.phidgets.com/?view=api Phidget22 API]</span> Manual</p>

<p>● The Max/MSP <span>[https://www.phidgets.com/?view=code_samples&lang=MaxMSP examples]</span></p>
</div>

<div class="phd-slide">
<h2>Write Code</h2>

<p>First, let's explain how to operate the examples. We will take a look at the PhidgetVoltageInput example:</p>

<div class="phd-panels">
<div class="phd-panel phd-flex-column-align-center phd-flex-column-justify-top">
<div class="phd-lazy-image" data-src="https://www.phidgets.com/decks/PT3_MAX_WIN/-x300/50/MSP_Example.png"></div>
</div>
<div class="phd-panel phd-flex-column-align-left phd-flex-column-justify-top">
<p>
For this particular example, the Max object is called <b>PhidgetVoltageInput</b>. Objects/message boxes are connected to the inputs and outputs of this object.
Input objects will either cause a property of the device to change or request for a property to be retrieved. Output objects return the retrieved information.
</p>
<p>All supported functions for Max/MSP can be found in the <span>[https://www.phidgets.com/?view=api Phidget22 API]</span>.</p>
</div>
</div>
</div>

<div class="phd-slide">
<h2>Write Code</h2>

<p>
Try it for yourself! Click on the <b>getDeviceSerialNumber</b> message box to request the Phidget to retrieve the serial number of the device. You should see
the a message in the Max window denoting the serial number of your device. All devices support the getDeviceSerialNumber message, making it an easy way to
determine if the Phidget libraries are correctly set up, and whether the Max/MSP application is connected to your device.
</p>

<div class="phd-lazy-image" data-src="https://www.phidgets.com/decks/PT3_MAX_WIN/MaxMSP_GetSerial.png"></div>

<p>
If your example contains a <b>get[DataType]</b> message box (e.g. <b>getVoltage</b>), click on it to cause the associated data to be output with a relevant
prefix. [DataType] can be data member the object has. A list of available messages and their associated outputs is outlined in the
<span>[https://www.phidgets.com/?view=api Phidget22 API]</span> for your device.
</p>

<div class="phd-lazy-image" data-src="https://www.phidgets.com/decks/PT3_MAX_WIN/MaxMSP_GetVoltage.png"></div>
</div>

<div class="phd-slide">
<h2>Write Code</h2>

<p>
If your example contains the <b>start</b> message box, you can continuously poll for events. Just press the start message box to start sampling. When an event
occurs on a Phidget (i.e. when a sensor detects a change in the measured data), associated data will be output with related prefixes. Press the
<b>stop</b> message box to stop sampling.
</p>

<p>
For the PhidgetDigitalOutput example, there are <b>setDutyCycle</b> and <b>setState</b> message boxes. Changing the numbers will cause the digital output to
change. Your example may contain device specific message boxes to click on. Click them to see what they do!
</p>
</div>

<div class="phd-slide">
<h2>Write Code</h2>

<p>
Your best resource to program in MaxMSP will be our examples. If you aren't familiar with concepts in Phidget programming, you may find our
<span>[https://www.phidgets.com/docs/Phidget_Programming_Basics Phidget Programming Basics]</span> page helpful. It provides a very generic overview of what
traditional languages follow when using Phidgets. For Max users, conceptual details about particular actions (e.g. opening a Phidget) are explained there.
</p>

<p>
Keep in mind when reading these general resources that the Max/MSP libraries may not implement the full Phidgets API - some function calls and Phidget classes
may not be supported.
</p>

<p>
In general, Phidget objects can be placed inside the patcher, and functions can be called on them using appropriately connected messages. We'll go over a basic
setup next.
</p>
</div>

<div class="phd-slide">
<h2>Write Code</h2>

<h3>Step One: Initialize and Open</h3>

<p>
Initializing and opening the device is be done by placing a new object. Other objects handle different Phidgets - a Spatial, a Light Sensor, a Motor Controller,
etc. Only the name of the object changes. You can find the name for the object in the device's .maxhelp file (e.g. VoltageInput.maxhelp). If you are unsure what
the software object for your device is, go to the <b>API</b> tab on its product page on our website.
</p>

<p>In the case of a Voltage Input, we name it <b>PhidgetVoltageInput</b>:</p>

<div class="phd-lazy-image" data-src="https://www.phidgets.com/decks/PT3_MAX_WIN/MaxMSP_VoltageInput_generic.png"></div>

<p>
<b>Important:</b> a local connection will reserve the device until closed. This prevents any other instances from retrieving data from the Phidget, including
other programs. Every Phidget object in Max will automatically try to connect to and reserve a Phidget for itself. As long as a MaxMSP Phidget object is
running, it will continuously try to connect to a Phidget, even trying to reconnect if it gets disconnected.
</p>

<div class="phd-lazy-image" data-src="https://www.phidgets.com/decks/PT3_MAX_WIN/MaxMSP_GetVoltage.png"></div>
</div>

<div class="phd-slide">
<h2>Write Code</h2>

<h3>Specifying a Phidget</h3>

<p>
When the instance is created as with the Voltage Input above, normally it will make a connection to the first device of its type it can find. The Phidget object
can also be declared with a number of specifiers to open a specific Phidget instead.
</p>

<p>Specifiers can be added to the object in the format: <b>PhidgetExternal {Specifiers}</b>. These will be written in the form: <b>specifier=value</b></p>

<p>The full list of specifiers that can be used to identify a Phidget in Max/MSP are as follows:</p>

<ul>
<li><b>serialnumber</b> - The serial number of the device</li>
<li><b>channel</b> - The channel of the device to open</li>
<li><b>hubport</b> - The hub port the device is plugged into (where applicable)</li>
<li><b>ishubport</b> - Specifies whether this channel should be opened on a hub port directly, or on a VINT device attached to a hub port.</li>
<li><b>remote</b> - Forces connection to a remote device over a network, ignoring devices on the local machine</li>
<li><b>local</b> - Forces connection to a device plugged into the local machine, ignoring network devices</li>
</ul>
</div>

<div class="phd-slide">
<h2>Write Code</h2>

<h3>Specifying a Phidget</h3>

<p>For instance, to open a VoltageInput with serial number 349428, you would use:</p>

<div class="phd-lazy-image" data-src="https://www.phidgets.com/decks/PT3_MAX_WIN/MaxMSP_VoltageInput_specific.png"></div>

<p>Some other examples:</p>

<p>Open a Digital Input:</p>

<div class="phd-command-line"><code>PhidgetDigitalInput</code></div>

<p>Open channel 1 of a Digital Input Phidget connected to port 2 of a hub with serial number 35569</p>

<div class="phd-command-line"><code>PhidgetDigitalInput serialnumber=35569 channel=1 hubport=2</code></div>

<p>Open open hub port 2 as a DigitalInput for a hub with serial number 35569</p>

<div class="phd-command-line"><code>PhidgetDigitalInput serialnumber=35569 hubport=2 ishubport=1</code></div>
</div>

<div class="phd-slide">
<h2>Write Code</h2>

<h3>Using a Phidget Over a Network</h3>

<p>
To use the Network Server, first the Phidget needs to be plugged in to a computer that has the Network Server turned on within your local network. (For
information on how to do this, see the Phidget Network Server page in the section on how to use the Network Server for your operating system).
</p>

<p>Next, in your patch you need a <b>PhidgetNet</b> object. To automatically find local networks, send it a message saying <b>enableServerDiscovery</b>.</p>

<div class="phd-lazy-image" data-src="https://www.phidgets.com/decks/PT3_MAX_WIN/MaxMSP_Enable_Server_Discovery.png"></div>

<p>
Then, to connect a Phidget over the network, change the object text to specify it is to connect to a Phidget on a remote server, as per the following example.
</p>

<div class="phd-lazy-image" data-src="https://www.phidgets.com/decks/PT3_MAX_WIN/MaxMSP_Remote.png"></div>
</div>

<div class="phd-slide">
<h2>Write Code</h2>

<h3>Step Two: Wait for Attachment (plugging in) of the Phidget</h3>

<p>
Although this is a required step in many of our other languages (and therefore you may be expecting this if coming from another Phidget language), in MaxMSP you
do not have to add a specific waitForAttachment block.
</p>

<p>
Keep in mind, however, that if your Phidget is not responding within your MaxMSP program, it may simply not be plugged in! Send a getAttached message to a
Phidget object at any time to see if it's attached.
</p>
</div>

<div class="phd-slide">
<h2>Write Code</h2>

<h3>Step Three: Do Things with the Phidget</h3>

<p>Phidget data is accessed either by one-time polling or at a fixed rate via on-board timers for some devices.</p>

<p>
Getting or setting values directly via polling on the Phidget is done through messages linked to the inlet. The object’s inlet can be wired to send commands to
the device, and the outlet used to retrieve the results. You can set values on the Phidget by using the set messages, and some properties can be read with get
messages:
</p>

<div class="phd-lazy-image" data-src="https://www.phidgets.com/decks/PT3_MAX_WIN/-x100/50/MaxMSP_get_and_set.png"></div>

<p>To sample at a fixed rate, use the start and stop messages to start and stop the data flow, respectively.</p>

<div class="phd-lazy-image" data-src="https://www.phidgets.com/decks/PT3_MAX_WIN/-x65/50/MaxMSP_Start_Stop.png"></div>
</div>

<div class="phd-slide">
<h2>Write Code</h2>

<h3>Step Three: Do Things with the Phidget</h3>

<p>
Outlet data is always given a prefix to allow for routing. For instance, the digital input state state change event data is given the prefix <b>stateChange</b>,
and the voltage input voltage change event similarly use <b>voltageChange</b>. The specific prefixes for each set of outlet data is listed on the API page for
that class.
</p>

<div class="phd-lazy-image" data-src="https://www.phidgets.com/decks/PT3_MAX_WIN/-x100/50/MaxMSP_Routing.png"></div>

<p>
The rightmost outlet on the Phidget object outputs error event data. This will send information on error events such as saturation events. To see which error
events may apply to your device, check its API page.
</p>

<div class="phd-lazy-image" data-src="https://www.phidgets.com/decks/PT3_MAX_WIN/-x80/50/MaxMSP_Error_Event.png"></div>
</div>

<div class="phd-slide">
<h2>Write Code</h2>

<h3>Step Four: Close and Delete</h3>

<p>
Although this is a required step in many of our other languages (and therefore you may be expecting this if coming from another Phidget language), in MaxMSP you
do not have to add a specific close and delete block.
</p>

<h3>Special Case: Multiple Phidgets</h3>

<p>
Multiple Phidgets of the same type can easily be used inside a single program, it only requires another Phidget object placed. If two of the same type of
Phidget object are placed, the serial number and channel arguments should always be specified (as well as hub port, if applicable) to ensure that the correct
Phidget gets associated with the correct object.
</p>
</div>

<div class="phd-slide">
<h2>What's Next?</h2>

<p>{{Slide_Deck_PT3_Outro}}</p>
</div>
</div>

<div class="phd-navigation-buttons">
<div class="phd-simple-button phd-to-slide-button" data-navigation-direction="prev">«</div>
<div class="phd-progress-container">
<div class="phd-progress-bar">
<div class="phd-progress-slide-info"></div>
</div>
</div>

<div class="phd-simple-button phd-to-slide-button" data-navigation-direction="next">»</div>
</div>
<div hidden class="phd-hidden-breadcrumb-label" data-label="Max/MSP"></div>
</div>