DOCSEARCHbyAlgolia
Submit Docs

UXP Photoshop Plugin Samples

repository·main·Indexed 43 days ago

https://github.com/adobedocs/uxp-photoshop-plugin-samples

A collection of sample plugins built using the Unified Extensibility Platform (UXP) for Adobe Photoshop. Includes implementation patterns for cross-compatible JS (Photoshop and XD), Firebase Firestore integration, vanilla JavaScript starters, invisible plugins, and communication examples using WebSockets and Electron helper apps.

Tokens
37.7K
Snippets
132
Records
174
Agent score
55%

What's inside UXP Photoshop Plugin Samples

  2. Overview of UXP Photoshop Plugin Samples

    main
    This repository provides a collection of sample plugins designed to help developers learn how to build plugins for Adobe Photoshop using the Unified Extensibility Platform (UXP). The samples cover various technologies, frameworks, and API integrations, ranging from vanilla JavaScript to React, Vue, Svelte, and WebAssembly.

  6. Core features of the React Starter Plugin

    main

    The React Starter Plugin serves as a template for building Photoshop plugins with React. It demonstrates the following implementation patterns:

    • Entrypoints: How to define and set up multiple panels using entrypoints.setup.
    • Menus: How to implement flyout menus.
    • UI Components: How to use Spectrum UXP widgets (e.g., creating a color picker) within a React environment.

  7. Understand the JSZip Sample functionality

    main

    This sample demonstrates how to integrate the JSZip library within a Photoshop UXP plugin. It provides three primary functional demos:

    • IMPORT ZIP FILE: Imports a .zip file containing images and automatically opens them in Photoshop.
    • EXPORT ARTBOARDS AS ZIP: Exports all artboards in the current Photoshop project into a single .zip file.
    • SAVE FILES TO ZIP: Allows the user to select multiple files and export them into a .zip archive.

  11. Understand the OAuth workflow for Photoshop plugins

    main

    Implementing OAuth in a Photoshop plugin requires three distinct components: the Photoshop plugin itself, a server (e.g., a local Node.js server), and the service provider's OAuth endpoints (e.g., Dropbox API).

    Because plugins cannot directly handle the OAuth redirect callback in a secure way, the workflow follows this pattern:

    1. Session Initialization: The plugin requests a session ID from your server.
    2. Browser Redirection: The plugin opens the user's default browser to a URL on your server.
    3. OAuth Handshake: Your server manages the full OAuth code grant workflow with the service provider.
    4. Token Storage: Once the user grants permission, the server saves the access token paired with the session ID.
    5. Polling: The plugin polls your server to check if the access token is ready for that specific session ID.
    6. API Access: Once the server provides the token, the plugin uses it to make authenticated calls to the service API.