eDell

Dell Design Library

Jim Machajewski, Bill Harrison & Ashley Eaton

eDellConfidential2

Global Site Design

Our Mission: To become the world’s leading in-house digital agency

through a balance of art and commerce, agility and

innovation, and strategy and execution.

Our Charter:In every project we deliver to the vision of creating simple,

intuitive, Dell.com experiences driven by customer needs.

We have a LOT of work to do

eDell3

Dell’s Presence Online

2000“The BOOM”

2009Global Site Design is Formed

1996Dell.com launches

eDell4

Our tasks:

• Global Site Design is responsible for transforming Dell.com’s user experience. That’s 24,000,000 or so pages globally.

• Rebuilding a site on such a massive scale requires that you start with a firm foundation.

• That’s where the library comes in

• DellDesignLibrary.com

So How Do We Plan To Do It?

eDell5

Why do we have a library?

Our solution:

• We created a modular design system, including a relatively small number of parts and templates.

• These parts and templates can be rearranged almost infinitely to build any desired webpage.

• And these parts and templates, along with the instructions for using them, are housed in the Library.

eDellConfidential6

Goals for the Library

Our goals:

• Consistency across projects

• Efficiency within projects

• Happier customers

eDell7

The Library’s Core Features

• Robust document & contentmanagement

• Managed user privileges

• Faceted navigation/classification

• Customizable framework – HTML

– CSS

– template variables

– site structure

• Versioning

eDell8

So What’s In the Library?

Patterns• Reusable, repeatable collections

of elements that can be embedded on a page

• More accurately considered components

• Defined by their function and purpose, not by visual design or location on the page

• Include specifications for globalization

• Used in combination to create complete templates, blueprints, launch layouts or pages

• Example: Data Table

eDell9

Templates

• Blank Templates– Provide basic content areas and page layouts

– Used as foundations for creating complete templates

• Complete Templates– Use blank templates as their foundations

– Define patterns available in each area

– Used in blueprints and launch layouts

eDell10

Building with Components

Blank Template

Coupe

Complete Template

Honda Accord

PatternWheel

eDell11

How does a page come together?

Banner

Article Content

Article Teaser

Banners

Related Content

Masthead

Local Nav

eDell12

Other Documents

• Blueprints– Reusable plans for implementing site sections

– Contain the superset of all components available in a repeatable set of pages, along with a meta-sitemap and a content guide

• Project Layouts & Comps– Repository for project documents that Global Site Design has

handed off

– Launch layouts and visual page comps

• Guides– Style guidelines

– Asset creation guidelines

– Tutorials

eDell13

Who uses the library?

• Global Site Design’s user experience architects, visual designers, content strategists & account managers (90+ people)

• Internal development teams (2,000+ people)

• Internal marketing teams (200+ people)

• External development teams (Infinite)

• Dell’s agency partners (39 agencies, 300+ people)

eDell14

A Global Audience• Argentina

• Australia

• Austria

• Bangladesh

• Barbados

• Belarus

• Belgium

• Brazil

• Canada

• Chile

• China

• Colombia

• Costa Rica

• Croatia

• Czech Republic

• Denmark

• Dominican Republic

• Egypt

• Finland

• France

• Germany

• Greece

• Hong Kong

• Hungary

• India

• Indonesia

• Ireland

• Israel

• Italy

• Japan

• Jersey

• Jordan

• Kenya

• Latvia

• Liechtenstein

• Luxembourg

• Malaysia

• Mexico

• Netherlands

• New Zealand

• Nigeria

• Norway

• Oman

• Pakistan

• Panama

• Peru

• Philippines

• Poland

• Portugal

• Qatar

• Romania

• Russia

• Serbia

• Singapore

• Slovakia

• South Korea

• Spain

• Sweden

• Switzerland

• Taiwan

• Thailand

• Turkey

• Turkmenistan

• Ukraine

• United Kingdom

• United States

eDell15

• To create page comps

• To get updated style guidelines

• To get guidance on asset creation

• For UI requirements

• For control definitions

– Development support

– Functional guidance

How do people use the library?

eDell16

Lessons Learned

• Be careful who you let set-up your framework manager

• Have a managed and centralized intake process

• Focus on definitions

• Metadata!

• On-going funding

eDellConfidential17

…AND a benevolent dictator

Have a Wheel of UX…

More Lessons Learned

eDell18

• Cross referencing & content sharing

• DDUID – Dell Design Library Unique Identification System

• Integration of GSD’s proprietary prototyping framework

• Integration with iRise• Multi-channel patternization

– Client-side applications– Mobile/tablet– Personalization– Authentication– B2B– Partnerships

Evolution & What’s Next?

eDell

Thank You

For more info, contact us:http://www.delldesignlibrary.com/contact-us.html

eDell

Q&A

For more info, contact us:http://www.delldesignlibrary.com/contact-us.html