FrameWrx: How do I mask an image or video inside a shape.

Topic

Images can be nested inside any shape. For example, if you add a circle to your canvas and want that to be replaced with a photo, the image would be considered masked inside of that circle. Masking requires that the image or video takes up the entire space of the shape.

In the editor any image or video file can be masked inside of a shape. FrameWrx offers standard shapes in the shapes menu. If you would like to mask an image or video in a custom shape, any vectorized element can be used as a shape. With custom elements created outside of FrameWrx, you can add this to your project and mask an image or video inside of it. 

Environment

  •  Product: 
  • Component: Content Creation, Content Studio Timeline
  • Control System: FrameWrx Content

FrameWrx by Daktronics is a cloud-based content design platform that enables anyone, anywhere to access professionally designed templates to elevate their brand for event production and promotions. This timesaving platform simplifies content creation, maximizing the impact of digital video displays and social communication. Event producers of any ability can access top-level, intentionally designed templates, created by the professional digital artists who provide content for professional stadiums.
MicrosoftTeams-image (17).png

 

Steps

Add a shape

  1. Click on Shapes. 
  2. Click on your desired shape from options. The shape will appear in your layout. 

2024-03-07_16-15-12.png

  1. Select the shape in your layout and click on the media icon.  Or choose the photo or media option in the left menu.
  2. Select the library where you would like to add an image from or upload it directly from your machine.
  3. Add your photo or video.
  4. Scale the image or video.
  5. Click Apply Image.

2024-03-07_16-29-03.png

Once the image has been added, you will have the following options:

  • Reposition: Move the shape.
  • Resize: Scale the image inside of the shape.
  • Filters: Add filters to the image (color overlay, exposure, brightness, etc.)
  • Replace/Remove Image: Change out or take out the image..
  • Constrain Proportions: Maintain height and width proportion of the image.
  • Arrange: Send element to front or back of canvas.
  • Alight to Canvas: Align left, right, or vertical to canvas.
  • Transparency: Change transparency of image.

A placeholder button can be added to any shape to indicate that the image is replaceable for your user. The placeholder button can be found in the left menu.

 

Sports example using a circle and player headshot fill.  

2024-03-07_16-34-29.png

 

KB ID: 000028001


DISCLAIMER: Use of this content may void the equipment warranty, please read the disclaimer prior to performing any service of the equipment.

DAKTRONICS DOES NOT PROMISE THAT THE CONTENT PROVIDED HEREIN IS ERROR-FREE OR THAT ANY DEFECTS WILL BE CORRECTED, OR THAT YOUR USE OF THE CONTENT WILL PROVIDE SPECIFIC RESULTS. THE CONTENT IS DELIVERED ON AN "AS-IS" AND "AS-AVAILABLE" BASIS. ALL INFORMATION PROVIDED IN THIS ARTICLE IS SUBJECT TO CHANGE WITHOUT NOTICE. DAKTRONICS DISCLAIMS ALL WARRANTIES, EXPRESS OR IMPLIED, INCLUDING ANY WARRANTIES OF ACCURACY, NON-INFRINGEMENT, MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE. DAKTRONICS DISCLAIMS ANY AND ALL LIABILITY FOR THE ACTS, OMISSIONS AND CONDUCT OF YOU OR ANY THIRD PARTIES IN CONNECTION WITH OR RELATED TO YOUR USE OF THE CONTENT. ADJUSTMENT, REPAIR, OR SERVICE OF THE EQUIPMENT BY ANYONE OTHER THAN DAKTRONICS OR ITS AUTHORIZED REPAIR AGENTS MAY VOID THE EQUIPMENT WARRANTY. YOU ASSUME TOTAL RESPONSIBILITY FOR YOUR USE OF THE CONTENT AND ANY LINKED CONTENT. YOUR SOLE REMEDY AGAINST DAKTRONICS FOR DISSATISFACTION WITH THE CONTENT IS TO STOP USING THE CONTENT. THIS LIMITATION OF RELIEF IS A PART OF THE BARGAIN BETWEEN THE PARTIES.

The above disclaimer applies to any property damage, equipment failure, liability, infringement, or personal injury claim arising out of or in any way related to your use or application of the content, whether such claim is for breach of contract, tort, negligence or any other cause of action.