DeskView Website
Stand for a refreshing view.

DeskView was the world’s first desk built to easily mount to any non-porous surface like a window, glass wall, or whiteboard.

DeskView approached Rainfall with the request that we refine their online presence to better communicate the features and benefits of their unique product.

We worked closely with their team to create a visual narrative that allows the beauty and versatility of DeskView’s design to entice customers and encourage them to work, entertain, and even decorate using this stylish piece of furniture.

An image of an individual sitting at a laptop on a white table, viewing the DeskView website on that laptop

Lightweight and effective e-commerce

I led the design of a modern shopping experience that showcased DeskView's unique design. The experience was built on Shopify to take advantage of the platform’s robust and scalable tools.

Concept Generation
Flow Mapping
Experience Design
Prototyping
Usability Testing
Visual Design
UX and UI Design

A collage of the various desktop and mobile layouts for the DeskView website, featuring product imagery, lifestyle imagery, and product specifications

Subtle, modern, and clean

DeskView’s product line was minimal and sophisticated, and my team wanted the website to embody the same modern approach. A muted color palette steps out of the way of the product, and a thin, elegant typeface speaks clearly to consumers.

DeskView boasted a number of health benefits and unique design elements, and we needed to convey this information quickly and efficiently.

A collage of DeskView's muted color palette of black, white, and gray with associate color names and color codes
A schematic of the typography choice, sizes, and grid used on the DeskView website

A series of icons made information easily digestible and entertaining

A custom designed family of icons elegantly communicated each and every detail.

A collage of the various custom icons made for the DeskView website, shown in muted gray with associated descriptions of their use
Blueprint-like line drawings of the DeskView desk, as used for product specifications on the DeskView website

Peeling the layers to show quality construction

DeskView was elegantly engineered to minimize parts and provide superior strength. We communicated its durable construction in a manner accessible to all audiences—a 3D view that continuously disassembled and reassembled itself.

A closer look at the product’s material quality

Uncluttered photography revealed attention to detail and design excellence while Intricate points of view show material and manufacturing quality

A close-up image of the DeskView desk in glass material with metal hardware for attaching the desk to a window.
A close-up image of the DeskView desk in wood material with metal hardware for attaching the desk to a window.
A close-up image of the DeskView desk in wood material with metal hardware for attaching the desk to a window.

Showcasing DeskView as the ideal standing desk

More important than DeskView’s construction was how it fit into everyday life, frequently as a standing work surface. Standing has notable health advantages, but we didn’t want to feel clinical. Instead, we entertained customers with a looping video of DeskView in action.

The visual design of DeskView's homepage

DeskView's homepage was a beautiful visual narrative which showcased the product’s versatility and contribution to the health of its owner in both the workplace and at home.

An image of the DeskView homepage, featuring an image of the desk at the center and supporting information to the right

The visual design of DeskView's Shop page

The Shop page was an extension of the homepage and provided the final details a customer might desire before completing their purchase. Our team made it easy and quick to select the finish, understand installation, and checkout, while feeling secure with the purchase decision.

An image of the DeskView product detail, or Shop page, featuring an image of the desk at the center and supporting information to the right

A fully responsive, mobile enhanced experience

A substantial number of prospective buyers come from mobile, so the experience had to be outstanding. Optimized responsive pages allowed browsing from smaller screens without sacrificing information or creating unacceptable load times.

A collage of the various mobile layouts for the DeskView website, featuring product imagery, lifestyle imagery, and product specifications

A custom experience that leveraged all the advantages of Shopify

Large, custom e-commerce platforms are not always necessary for boosting sales, and for DeskView we wanted to take advantage of the native tools and partner integrations native to Shopify. Our team built DeskView directly into the platform's framework without losing any quality from the overall experience.

The DeskView Website design framework, including the expanded shopping cart frame overlaid on top of the homepage

Defining unique imagery for each product variant

At the time, Shopify allowed one set of images per product, even if that product was offered in several variations. For DeskView, we wanted each material finish to have its own set of associated images, but didn’t want to develop a hack that was difficult to maintain.

Instead, our developers created a simple method that looked for each product’s variant name in the file name of every image and organized a pack of imagery for each variation. This way, relevant imagery was shown to users based on their product selection.

A screenshot of a MacOS Finder window listing all of the DeskView product material images, showing how the images needed to be named to allow the Shopify CMS to accurately display the images with their associated product material types
A screenshot of the Shopify CMS displaying how DeskView product imagery was loaded and organized for display on the product detail, or Shop page

A peek at how DeskView came to life

Shooting DeskView floating in mid-air was a challenge, and somewhat ironic given the beautiful windows in our photo studio. With some creative engineering (a lot of tape) and a bit of post production we achieved a beautiful representation of how it feels to work at a DeskView, complete with amazing natural light.

An image taken from the photography studio while photographing a man standing at a DeskView Desk while it appears to be floating in air. This image is of the empty studio, depicting the setup of the photograph
An image taken from the photography studio while photographing a man standing at a DeskView Desk while it appears to be floating in air. This image is of the man standing at the DeskView desk while it is attached to armatures which will later be removed

Building DeskView's product with CG

We wanted the DeskView render to seamlessly match the overall look and feel of the website, so we worked from models provided by the product team to create a final look consistent with the surrounding elements.

A rough 3D render of an "exploded" view of the DeskView desk, showing all of the elements of its construction
A screenshot of the 3D software (Cinema 4D) used to render 3D views of the DeskView desk
A sweeping photograph of a man standing on a balcony in Singapore with the DeskView desk attached to the glass safety wall of the balcony, demonstrating how DeskView can be attached to a glass surface, turning it into a beautiful ad-hoc workspace

A shopping experience designed with concise communication in mind

Our close partnership with DeskView resulted in an e-commerce experience that looked and acted as beautiful as the product it sold. An iterative design process allowed for frequent feedback from potential customers and colleagues, that in turn allowed for continuous refinement and simplification.

DeskView's website delighted customers by appealing to their visual sensibilities and desire for thorough information.

Creative impact

Our strategy of presenting information in a clean, approachable manner increased comprehension of product value and heightened purchase confidence.