From diagonal to useful dimensions
A quoted diagonal does not directly give the height or width available for your content. A 55-inch display in landscape orientation and the same panel rotated to portrait have the same diagonal, but very different available widths.
Let D be the active-display diagonal in inches and let a:b be its width-to-height ratio. The rectangle’s diagonal is the hypotenuse of a right triangle, so its physical dimensions follow from the Pythagorean theorem:
Height in inches = D × b / √(a² + b²)
Centimetres = inches × 2.54
You can enter a familiar ratio, such as 16:9, or use a pixel pair such as 1920:1080. The latter reduces to the same ratio when pixels are square. A screen’s pixel dimensions do not change its physical size at the same diagonal and aspect ratio; they change the number of pixels available within that area.
Use the installed orientation. If a 1920 × 1080 display is rotated, the effective width-to-height pair becomes 1080 × 1920. For an LED wall or other unusual canvas, obtain the actual active pixel map from the supplier instead of assuming a television format. If pixels are not square or the physical geometry is irregular, this rectangular model is not sufficient.
Fit the whole image, or fill the display?
When content and display have different proportions, a proportional resize cannot both preserve every source pixel and fill the whole screen. Choose the tradeoff deliberately, before labels and important product details are placed near an edge.
Let W and H be display width and height in one unit. Let Cw and Ch be source-image width and height in pixels. The scale s is the conversion from source pixels to that display unit.
Fill display: s = max(W / Cw, H / Ch)
Scaled content: (s × Cw) by (s × Ch)
Fit whole image, often called contain, uses the smaller scale. Any unused screen width or height is divided into two equal bars because this planner centres the image. Wide images on a taller display produce top and bottom bars. Narrower images on a wider display produce left and right bars. The percentage labelled “screen covered” is the scaled image area divided by the active display area.
Fill display, often called cover, uses the larger scale. The scaled image extends outside the display on one axis. The tool divides that excess equally between the two opposite edges and converts the amount back to source pixels. The percentage labelled “image retained” is the visible source area divided by the full source-image area.
Cover retained area = 100 × (W × H) / (s × Cw × s × Ch)
Horizontal crop per side, in source pixels = (s × Cw − W) / (2 × s)
Vertical crop per edge, in source pixels = (s × Ch − H) / (2 × s)
The last two expressions apply only where the scaled content exceeds the display; the other axis has zero crop. A percentage is an area comparison, not a judgement about how much useful information survives. Removing a small strip containing a label can matter more than removing a larger empty background.
Example: 4:3 content on a 55-inch landscape screen
Consider a 55-inch 16:9 screen and a source file of 1920 × 1440 pixels. These are illustrative inputs, not a screen recommendation. The active display is approximately 121.76 cm wide by 68.49 cm high.
| Policy | Visible result | Tradeoff |
|---|---|---|
| Fit whole image | Content is approximately 91.32 × 68.49 cm. Each side bar is 15.22 cm wide. | Every source pixel is retained. The image covers 75% of the screen area. |
| Fill display | The source scales to approximately 121.76 × 91.32 cm. The display clips 180 source pixels from both the top and bottom. | The display is filled, but only 75% of the source-image area remains visible. |
The two 75% results describe different things. In the first case, one quarter of the display is unused. In the second, one quarter of the source image is removed. Neither figure tells you whether the product, callout or caption is still well framed.
If the removed region contains important details, change the composition, create a separate export or accept the bars. Stretching the image to a new ratio is another possible playback behavior, but it distorts shapes and is intentionally outside this planner.
Give the loop a measurable time budget
A duration budget makes one limited promise: the entered sections add up. It does not predict how long someone will watch, how readable a caption is, or how many enquiries a video will produce. Those depend on the actual content and viewing situation.
The loop planner adds all entered section durations and subtracts that sum from the target. A positive result is time still available; a negative result is an overrun. The coloured timing strip represents each section proportionally. When the plan overruns, the strip scales to the allocated total while the overrun remains explicitly visible.
Remaining time = target duration − allocated time
Budget used (%) = 100 × allocated time / target duration
For a 60-second target, sections of 8, 24, 15 and 8 seconds total 55 seconds, leaving 5 seconds. Adding a 10-second section brings the total to 65 seconds: a 5-second overrun. You could shorten existing sections, remove one, or agree a longer loop. The calculator makes no editorial decision for you.
Enter net time on the final timeline. If two source clips overlap in a crossfade, adding their untrimmed clip lengths would count the overlap twice. Assign the overlap to one section, split its duration between the two, or use timeline measurements from the editor. Include any intentional end-frame hold in the appropriate section. Player-added delays and automatic pauses are not inferred.
Visitors may arrive part-way through a looping file. Review whether an individual section has enough context to stand on its own, and whether the transition from the final frame back to the first is intentional. Treat those as review questions, not automatic reasons to choose a particular duration.
Prepare the brief a production team can use
A useful handover joins the geometry to the communication task. Download the planner’s text brief and complete the missing information with the person responsible for the screen, the playback system and the product facts.
- Identify the installed canvas. Record the display model or LED wall layout, orientation, native pixel dimensions and active physical area. Separately record the complete housing and mount dimensions if physical fit is part of the project.
- Name the source and required versions. List product drawings, approved models, logos, photos and existing footage. Record which material may be shown publicly. Specify landscape, portrait or square deliverables individually; a crop may require a different layout.
- Give each section one reviewable purpose. “Show how the cover opens” is easier to evaluate than “make it dynamic.” List the detail that must be visible and any factual label that needs approval. Do not substitute timing totals for storyboard review.
- Settle playback conditions. Name the player or computer, screen input, audio expectations and whether captions are required. Confirm codecs, frame rate, resolution and other delivery settings with the playback operator.
- Define the approval route. Identify who approves technical accuracy, branding and the final exports. List review milestones and deliverables, including whether editable project files are needed.
- Test the actual playback chain. Check opening, looping, captions, scaling and any crop using the finished file on the intended equipment. A desktop preview cannot validate every player setting.
Where one composition cannot serve all formats, consider a shared master sequence with separate layout passes for each required ratio. This keeps the product explanation consistent while allowing captions and framing to suit each canvas. The cost and scope of those versions should be agreed before production.
Assumptions, rounding and limits
The tool assumes a rectangular active display, square pixels, proportional scaling, centred fitting and no overscan. It does not model unusual pixel aspect ratios, projector keystone correction, curved-surface mapping, screen seams, brightness, contrast, viewing distance, installation safety or image-quality limits.
Calculations use JavaScript floating-point arithmetic. Display values are rounded for readability, typically to one or two decimal places; the planner uses unrounded intermediate values. Source-pixel crop amounts can be fractional. Real playback software may round or align the crop differently, so inspect the exported file rather than using a rounded number as a pixel-perfect delivery instruction.
The allowed numeric ranges keep accidental entries manageable. A range limit is not a physical recommendation. A section can have zero seconds to remain in a draft as a placeholder; it contributes no time to the budget.
Inputs are temporary and local to this page. Download the brief before refreshing or closing the tab. See ownership and privacy for details.
Use the screen and loop planners →