Loading...

Dell Canvas

Dell Canvas First Connect App Homepage
  • Categories: Interaction & Visual Design
  • Role: Lead Visual Designer, Support Interaction Design
  • Released: July 2017
  • Client: Dell Technologies

Description

Create a visual language for a groundbreaking new product, the Dell Canvas. The horizontal touch display lies on a desk or a table horizontally so it can be used as a drawing or a drafting board.

Process

Work with multiple stake-holders to keep messaging on track and functionality feasable.

First Connect Experience

The First Connect Experience is an app that runs when the user first tunrs on their Dell Canvas. It guides them through their new hardware, showcasing software highlights along the way. Our first task was decide the ovearll structure of the app. Whiteboarding sessions led us to MVP and stretch goals, and helped to formulate content.

One of the challenges of the FCE app was a lack of photography budget. The app was designed around high-quality full-screen imagery, and it had to be obtained at no extra cost. We were barred from taking our own photos on set, so our options were limited. The logical course of action was to take stills from the Intro and Explore videos and edit them ourselves. I was provided the raw footage, and exported the stills using After Effects. The raw imagery was brought into Photoshop and heavily edited to improve image quality. The solution was cost effective and fostered continuity between the vidoes and the app.

HOMEPAGE REDESIGN

Dell BIOS Landing Page Original

Dell BIOS Landing Page Explorations

The original homepage design had been set and approved for months (far left). A few weeks before launch, the request came down to further celebrate the hardware and accessories. New product photography had recently become available, and I was eager to try out new layouts. With new device angles in hand, I began to play with scale and location. Once the new layout was set, a screenfill from the comic was added to maintain continuity with the embedded videos.

MODAL REDESIGN

Dell BIOS Landing Page Original

Dell BIOS Landing Page Explorations

This modal is initiated when a user selects an app they've yet to download. The original modal featured an eleven-word link that was competing for call-to-action. The redesign allows the user to skim or even skip the slimmed-down descriptive content, if desired, and go ddirectly to the bright blue "Get Applications" button.

The previous design featured a bright blue "OK" button that immedietly grabbed your attention, an unintended and undesired call-to-action. To clarify the action itself, I made the switch to "Close." To clarify the call-to-action, the button was switched from the primary to the more subtle secondary style. A user would also expect an "x" in the top right corner of a modal, a feature we quickly added.

Universal Windows App

Dell Canvas Connect is the Universal Windows App for the Dell Canvas. It's the user's hub for all things Dell Canvas, including links to settings and software downloads.

My role in the UWP app project was mostly focused on visual design, increasing the attractiveness of marketing content and inviting the user to interact with specialized settings.

Canvas Icon Family

Creating this icon family was a team effort. I created the Canvas App icon months before-hand, and the rest of the family was created in its image. I collaborated with EDG icon guru Jessica Nelson-Morris on a few rounds of explorations. Our final selections were approved by project and program leads. Implementation took many rounds, working with closely with development to ensure Windows Store app requirements were met and exceeded.

IN-APP VIDEO PRODUCTION

The Dell Canvas FCE app contained two videos: a product intro and a hardware/software overview. The Dell Blue team, Dell's internal video production team, was tasked with creating the videos. My role was to represent the Dell Experience Design group as the client, acting as the subject matter expert for the First Connect and other Canvas apps.

During the prelim meetings, I advised on the overall flow and creative vision of the videos. I was consulted on software features and functionality. We collaborated on the best methods to integrate the two videos into the FCE app experience. On-set, I provided software support and functionality feedback.

MARKETING VIDEO

EXPLORE VIDEO