Image mosaic/blur processing tool (for hiding face/personal information) | ZeroTools

Gaussian blurring in the image domain is a sophisticated mathematical transformation operation that applies a weighted average based on a two-dimensional normal distribution to a group of pixels in the target image.

This architecture directly expands the image data object provided by HTML5's canvas application programming interface and performs spatial frequency filtering on the underlying one-dimensional array.

We implement an algorithm that uses the correlation between the size of the Gaussian kernel and the standard deviation sigma to process convolution operations according to the specified radius in parallel and efficiently.

This smoothly attenuates sharp brightness changes between pixels and produces a natural optical out-of-focus effect with high frequency components cut off.

Similarly, in mosaic processing, the pixel array is directly rewritten, the arithmetic mean of red, green, blue, and alpha values ​​is calculated for each specified N-to-N block area, and all pixels in the target block are replaced with the representative value in a uniform color space.

This discrete blocking process makes it possible to irreversibly discard the spatial features of a specific subject while preserving the overall color composition.

In order to make only specific areas in the image invisible, this system is equipped with a highly accurate area selection engine using a mouse and touch pointing device.

In addition to specifying geometric bounding boxes such as rectangles and circles, it also supports irregular mask generation protocols using freehand brushes.

Alpha masks generated along brushstrokes are managed as binarized layers on the canvas' offscreen buffer. Parameters such as pixel size and blur radius that indicate the applied intensity are linearly interpolated in real time in conjunction with slider user interface operations, and are immediately fed back to the processing pipeline.

At this time, the interpolation algorithm is optimized to recalculate only the difference pixels while retaining the previous rendering cache, achieving smooth preview updates without delay even with high-resolution image data.

In particular, anti-aliasing is dynamically applied to boundary areas to output natural composite results that minimize discontinuity with areas outside the mask.

For the purpose of privacy protection, it is necessary to have both a process that blurs only a specific person and a process that blurs the entire background while keeping the specific person clear.

To solve this problem, this system incorporates a selection mask inversion function using Boolean operations into the logic layer.

By performing exclusive OR processing on the pixel index set of the selected area, it is possible to instantly reverse the calculation target area.

Furthermore, all of these spatial filtering operations are performed on top of the non-destructive rendering pipeline. The original image data is permanently stored in the browser's memory space as an immutable base layer, and the blurred and mosaiced effect layers are merged into the final display buffer using transparent compositing operations.

This layered approach allows resampling from the original image when readjusting processing parameters or modifying mask areas without any loss of image quality, providing the same flexibility as professional image correction in the browser.

When handling highly confidential image data, sending data to an external server poses a serious security risk. The tool takes full advantage of web assembly and client-side scripting environments, and completes all pixel analysis and conversion processes within the local memory of the user's device.

Uploaded images are loaded directly as binary objects into the browser's sandbox environment, without going through any network interfaces.

The entire memory lifecycle, from memory buffer allocation to garbage collection of data no longer needed, is strictly managed on the client side.

This edge computing model physically eliminates the risk of interception in the communication path and data retention on the server side, making it possible to safely process even confidential documents and unreleased product photos while maintaining the highest level of confidentiality.

This system implements a real-time comparison preview mechanism using a split viewer so that the user can immediately evaluate the validity of the applied filtering effect.

The texture of the original image and the texture after applying the effect are combined at the fragment shader level on the same canvas context, and both are rendered simultaneously using a swipeable separator line.

This preview system is fully synchronized with the event loop for drag operations and parameter changes, and updates the viewport asynchronously without blocking the main thread.

Before pixel array changes are finalized, the effect can be confirmed at the same pixel density as the actual output resolution, making it possible to visually prevent processing errors such as complete loss of context due to excessive blurring or information leakage through gaps in mosaic blocks.

This interactive verification process dramatically increases productivity, especially for retouching tasks that require precise adjustments.

For mosaic and blurring, appropriate algorithms and parameters must be selected depending on the nature of the object. When erasing vehicle license plates, it is recommended to use N-to-N block mosaic processing that exceeds the thickness of the text lines to completely destroy the edge components of the text.

At this time, by using a perspective correction mask that specifies the four corner vertices according to the rectangle of the license plate, processing can be limited without affecting the background even if the vehicle is photographed from an angle.

On the other hand, when protecting the privacy of a person's face in a crowd, Gaussian blur is effective because it attenuates only the spatial frequencies of facial features while preserving skin texture.

By setting the radius of the Gaussian kernel to approximately 15% of the pixel area occupied by the target face, it suppresses the occurrence of unnatural digital artifacts while depriving individuals of their identity.

Furthermore, in cases where a part of a confidential document such as a contract or financial statement is to be hidden, the system makes a precise rectangular selection along the lines of text, fills the area with the color of the background paper, and then superimposes a small amount of noise, achieving highly secure masking that cannot be restored.