transparent videos
Product design — Wix wow — 2019
Transparent Video is a unique player that can play mp4 video files with transparency. It's innovative & was first-in-market product. We envisioned a product that retained the charm of GIFs while offering enhanced features such as high-quality resolution, recolor options, sound, and interactions, all aimed at setting a new standard in web content creation. We offered users a stylish and diverse catalog of Transparent Videos, complete with video recoloring features, as well as the ability to upload their own alpha-channel videos and stream them seamlessly as transparent assets on any Wix site.
· · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · ·
· · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · ·
· · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · ·
· · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · ·
· · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · ·
· · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · ·
· · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · ·
· · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · ·
· · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · ·
· · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · ·
· · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · ·
· · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · ·
· · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · ·
· · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · ·
· · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · ·
· · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · ·
· · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · ·
· · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · ·
recolor video
RECOLOR PRESETS
The 'Recolor' option allowed users to adjust any transparent video's colors to match their brand and site theme. The main challenge was how to present and make this feature easily accessible to users.
Starting with two core styles, Duotone and Hue Saturation, we expanded Duotone into Light Wash, Dark Wash, and Greyscale, creating five accessible presets that offer users versatile tonal options.
Recolored video
WIRED PRESETS
We wired the video colors with the Site Styles, guaranteeing a seamless match with the user's brand identity. This automated approach offered users a convenient solution for preserving visual consistency across their site.
Examples using the presets
Transparent video Light Wash preset
Transparent video Dark Wash preset
Custom
WHAT
Product & content designer
WHERE
Wix WowTeam
WHEN
2019
PROJECT GOALS
NEW UNIQUE CONTENT
We envisioned a product that retained the charm of GIFs while offering enhanced features such as high-quality resolution, recolor options, sound, and interactions, all aimed at setting a new standard in web content creation. Additionally, we wanted to provide users with a rich Transparent Videos library and the ability to upload their own videos with alpha channel to stream them on any Wix site as transparent.
ADJUST COLORS
We also provided users with the option to edit video colors independently of the site style and adjust additional properties to ensure the video aligns with their site’s look and feel. This custom option was built on the initial presets we offered, allowing users to make further edits.
recolor research
VISUAL MAPPING
The research into video coloring capabilities mapped out various styles of videos, considering their color schemes and aesthetics. This process helped define the default settings for recolored content, identify the range of editable options available to users, and establish the default palette colors for customization.
content library
CURATION & CREATION
One of our primary initiatives centered around developing a specialized content library featuring videos designed to play seamlessly without a background. To achieve this, we collaborated with multiple creative teams within Wix as well as external animators and creative talents, leveraging their expertise to curate a collection of relevant and impactful content.
Instagram screenshots of potential artists for collaboration. 2019
The Impact
users fell in love
The Transparent Video project was an amazing initiative with a significant impact on Wix sites. It empowered users to easily create unique and stunning content, transforming the way they engaged with their websites. From the very first moment, our users fell in love with the product, and its success has been truly rewarding.
User site with original Transparent video
User site using 'Recolor''
Wix Studio Template featuring Transparent video
DARK & LIGHT WASH
Behind the scenes, we used duotone coloring: in Dark Wash, we hid the black, and in Light Wash, we hid the white to create a seamless experience with the coloring options.
Transparent video - Hue preset
Transparent video - original colors
User site using 'Recolor''
User site with original Transparent video
User site with original Transparent video