Waymark

BEAUTIFUL VIDEO MARKETING IN AN INSTANT

 

Role — Director of Product Design, Product Manager

When the opportunity came to move to Michigan, and play a part in investing in Detroit, one of the most iconic American cities, working as Director of Product Design at Waymark Inc., I couldn’t say no. Getting to work with my former Squarespace colleague Stephen Parker was a cherry on top.  

The Waymark design system I established is composed as a Sketch library with a file syncing solution where components and elements like type styles and icons make creating new mockups of potential features faster and more consistent. Below are twelve samples of different projects that I worked on as product manager, lead ui/ux, research, and production design. Select them to take a closer look.

 
 
 
 

Small company means a big role

I manage a small, cross functional functional team of project managers, front and back end developers, QA, and customer support as we build and maintain a product where Small businesses can start with nothing, and end with a commercial worthy of television. We also pattered with Spectrum Reach to make it so those commercials could end up on TV.

When you’re small and scrappy, it means your role is huge and impactful, and that’s the case at Waymark. My responsibilities include designing and maintaining the entire Waymark website, editor, and backend account systems, managing the Waymark Design System, designing user flows in every stage of fidelity, conducting customer research, prototyping, and even getting down and dirty with modern HTML/CSS for key pages on the site.

 
 

 

A Project to Transform the Business

Role — UX + UI lead

Waymark’s been working on a new product that allows templates creators the ability to translate Adobe After Effects files intro interactive video templates. Cutting down on template production time, and providing a robust foundation for the future of the platform.

A look inside that software is available upon request.

 

 

Checkout flow

Role—Product manager, research, UX + UI lead

Waymark was trying to maintain the feeling of a simple check out flow, but also provide customers choices like multiple subscription options with multiple commitment options, alongside à-la-carte purchasing.

This checkout flow also fulfilled the sub goal of not having to maintaining an e-commerce “cart” like checkout experience, and collected feedback to begin gauging NPS score from our customers on a rolling basis.

Take a look at the desktop and mobile versions of that checkout experience below.

 

 
 

Template Chooser

Role—Product manager, research, UX + UI lead

Waymark customers needed a central place to find template to create videos for their business. Some people preferred to search by industry, some by information like aspect ratio, length, and platform.

I ran a click area test with customers on two prior designs and landed on this format for filtering and sorting, as it provided a clear sorting mechanism, as well as the shortest time-to-find a filter option.

General usability principals proved themselves out, words beat icons, icons with labels beat icons alone.

Select a screen below to take a closer look at the mobile and desktop experience for the template chooser, the filters on mobile get collapsed in a control that exposes them in a modal, both experiences keep the filters with the customer throughout scroll.

 
 

 

My Videos

The problem, trying to properly categorize roughly 11 video options for customers. Customers were struggling to understand how to download their video.

I put together a card sort study to look at how different people organized these commands, and the results were relatively unsurprising. Suggesting strong bias based on the naming of the options. Itms with “publish”, “download” and “share” ended up together.

What was interesting is that almost everyone coalesced around three options, and seemed to not know quite what to do with things like rename a video or make a copy.

 
  1. Share a webpage preview 

  2. Share website preview to Facebook

  3. Tweet link to webpage preview

  4. Publish to YouTube

  5. Publish to Instagram

  6. Email standard quality file

  7. Save a copy to drafts

  8. Rename Video

  9. Download Standard Quality

  10. Download TV Quality

  11. Request TV Quality

Screen Shot 2019-07-30 at 9.09.16 AM.png
 
 

My videos, results

Drafts having three actions, with a strong call to edit, and a shortcut to buy. Purchases got a distinct download button, with cleaned up logic about requesting quality, and a new “share” menu that put options front and center for showing your video to others.

Select a screen below to see how I organized and managed all the options available to customers. I ultimately decided to abandon concepts like different video quality levels, opting for giving customers smart defaults.