Product Embeds

A fresh way to share

Shapeways is a 3D printing maketplace and community where designers can sell their creations. The goal of product embeds was to give anyone an easy way to share those products across the internet.

The old or existing product embeds on Shapeways were outdated, difficult to use and unsupported. My task was to improve them by making them easy to use, flexible, and visually fresh.

Exploration

I used YouTube, Vimeo and Kickstarter as the main inluences for rendering and implementation. We want to mimic the ease of grabbing a block of code and being able to pop it into whatever container needed.

Our users requested that we be sensitive to how much branding would go on the embed. Many use these on their personal shop sites, so they wanted to maintain a relatively neutral look when placed in the midst of their own personal web brand.

Making it Real

The finished product is clean and clear. It lets the product shine while still retaining a subtle Shapeways brand through the use of the Shapeways blue.

I used percentage based sizing for all widths, padding, and margins which allowed for the content to render correctly when coupled with set breakpoints. The embed defaults to set static widths, but by setting the width to be 100% you can easily make them responsive.

Results

We came away with a significantly more effective way for shop owners to share their Shapeways products around the web. Offsite embeds are currently converting at about 5% as compared to products found directly on Shapeways which is at about 1.7%.