===============================================
Modern Design View and Dark Theme in Workflows
===============================================

Overview
--------
The **Modern Design View** introduces an enhanced user interface in Workflows, focusing on improved usability, visualization, and personalization. It also includes support for a **Dark Theme** and seamless theme switching.

This update provides a more intuitive and visually engaging workflow experience.


Enabling Modern Design View
---------------------------
A new setting is available under **Design** in Workflows called **"Modern"**.

To enable:

1. Navigate to **Workflows**.
2. Open **Settings**.
3. Locate the **Design** option.
4. Select **Modern**.

Once enabled, the Workflow interface updates to the Modern view.

.. thumbnail:: /_images/Images/modernviewdesigndark.png
   :title:

   Modern Design setting

.. centered:: :sup:`Modern Design setting`

|

Execution Visualization in Modern View
--------------------------------------
The Modern Design View enhances workflow execution visibility with dynamic animations and visual cues.

**Key Capabilities:**

- **Animated Execution Flow**
  - Workflow path is dynamically highlighted during execution
  - Smooth animations show data movement across nodes

- **Active Worker Highlighting**
  - Currently executing worker is visually emphasized
  - Helps users quickly identify execution progress
  
   

Worker Highlighting
-------------------
Workers in execution are clearly highlighted to improve tracking and debugging.

- Active worker is visually distinct
- Improves clarity in complex workflows
- Enables quick identification of execution stage

Flow Animation
--------------
The workflow execution path is animated to provide better insight into data flow.

- Smooth transitions between nodes
- Visual representation of execution sequence
- Enhanced understanding of workflow logic


.. thumbnail:: /_images/Images/executionmodernview.png
   :title:

   Workflow execution

.. centered:: :sup:`Workflow execution`

| 

Theme Support in Modern View
---------------------------
The Modern View includes built-in support for both Light and Dark themes.

**Theme Switching:**

- Users can seamlessly switch between:
  - **Light Theme**
  - **Dark Theme**

- A toggle switch is available for quick switching
- No reload required for theme changes

Dark Theme Experience
---------------------
The Dark Theme enhances usability, especially in low-light environments.

**Features:**

- Optimized contrast for readability
- Reduced eye strain
- Consistent styling across workflow components

.. thumbnail:: /_images/Images/darkthemeswitchingworkflows.png
   :title:

   Dark Theme Experience

.. centered:: :sup:`Dark Theme Experience`

| 

Animated Workflow in Dark View.

.. thumbnail:: /_images/Images/darkviewanimation.png
   :title:

   Dark Theme Experience

.. centered:: :sup:`Dark Theme Experience`

| 

Worker View

.. thumbnail:: /_images/Images/workerviewdarkmode.png
   :title:

   Worker View

.. centered:: :sup:`Worker View`

| 


Additional Features
-------------------
- **AutoPlay Mode**
  - Enables automated workflow execution playback
  - Useful for demonstrations and analysis
  
.. thumbnail:: /_images/Images/autoplayviewdarkmode.png
   :title:

   AutoPlay Mode

.. centered:: :sup:`AutoPlay Mode`

| 
  
  

Benefits
--------
- More intuitive and modern interface
- Enhanced execution visualization
- Improved usability with Dark Theme
- Seamless personalization with theme switching
- Better clarity in complex workflows

Conclusion
----------
The Modern Design View represents a significant improvement in workflow usability and visualization.

- Provides a more intuitive user experience
- Enhances efficiency through better visual feedback
- Supports personalization with Light and Dark themes