Mobile-MainImage-v5.gif

Web embeddable for transactions

With Zype’s transaction embeddable, any video business can quickly embed simple video paywalls to adapt to their website’s layout and branding.

Zype gives businesses the power to sell video directly to their audience with fully functioning video paywalls; these paywalls can require a subscription, purchase, rental or any combination of these models. The primary goal was for each user opting into the flow to be able to complete it within a few minutes or less and without confusion. A close secondary goal was for this embeddable to integrate fluidly with the majority of websites owned by Zype’s clients.

What role did I play in this? Wireframing, prototyping, user testing, UI

User flow and wireframes

User flow and wireframes

In order to accommodate all necessary scenarios and screens, I created a detailed user flow. There were a few different products a user may want to embed in different areas of their website: the subscription paywall, a sign up form, their account profile to manage their subscriptions and settings; we needed to account for all of these in the MVP. And on to the wireframes…

In sketching out a variety of display options (Should the paywall stay within the video player? Pop out from the side of the browser? Overlay the entire screen?) we settled on the latter. Since subscriptions are the most popular way to watch, we decided these subscribers could get the sense they were joining the company as a whole if we overlaid the entire website with the paywall and kept a slight opacity to see the content underneath.

VideoPaywall-IA.png
For the future... customization options

For the future... customization options

Although we couldn’t launch this for the MVP, we considered what would be ideal for our clients. We decided it was important for them to be able to customize this embeddable so it would fit seamlessly into their own branded websites. These are the starting customizations we considered…

CustomizationOptions.png
CustomizationMockups.png