Session during Dreamforce 2015 on Thu Sept 17, 2015. Join us to learn how Salesforce executes digital marketing strategies on www.salesforce.com to increase leads and brand awareness, balancing the right mix of creative, technology, and business. See how our web experience management team works with UX, Design, Analytics, Strategy, SEO, and Localization to deliver impactful journeys for our customers.

1. From Design to Delivery
See how WEMs execute digital marketing strategies on www.salesforce.com
Jeffrey Cortez
Sr. Manager, Web Experience
@jeffcortez
jcortez@salesforce.com
Nina Saeang
Producer, Web Experience
@ninasaeang
nsaeang@salesforce.com
David Waclo
Manager, Web Experience
@oakeydave
dwaclo@salesforce.com

2. Introduction
Agenda
We’re constantly evolving
Design to Delivery at Salesforce
The Process in Action: Example
Recap
Q&A

3. Who are we?
Jeff Nina Dave

5. Business
What is a WEM?
Web
Experience
Technology
Creative

6. Introduction
Agenda
We’re constantly evolving
Design to Delivery at Salesforce
The Process in Action: Example
Recap
Q&A

7. Agenda
The Process in
Action: Example
Recap
We are constantly
evolving
Design to Delivery:
Process
Q&A

8. Introduction
Agenda
We’re constantly evolving
Design to Delivery at Salesforce
The Process in Action: Example
Recap
Q&A

9. Then and now
You’re never really done. 2009 to present.

10. A closer look: 2009

11. A closer look: 2011

12. A closer look: 2013

13. today

14. Evolution
2009 2011 2013 Today

15. Introduction
Agenda
We’re constantly evolving
Design to Delivery at Salesforce
The Process in Action: Example
Recap
Q&A

16. Strategy
Research
UX
Design/Content
Development
SEO
Analytics
Localization
WEM
Creative
Brief
Wireframing/
Prototyping
Visual/UI Design
Content Creation Development Authoring QA Localization Release
Analyze/Monitor
Test/Re-test
DESIGN DELIVERY

17. Creative
Brief
18 questions, 2 pages
Broken into two sections:
1. Project Structure
2. Project Strategy
Sample questions:
What are we making?
What is the timing?
What is the goal of the project?
Who is our audience?
How will we measure success?

18. Wireframing/
Prototyping

19. Visual/UI Design
Content Creation

20. Development

21. Authoring
Content Matrix
Images
Video
Loops
Styleguide
Drivers codes
A/B Test codes
Tracking pixels
Name Capture ID
Lead routing rules
HTML/CSS
Templates
Components
Custom code
Business Technology
Creative
Content
Management
System

22. QA
browser/OS platform and performance testing

23. Localization

24. Release

25. Analyze/Monitor
Test/Re-test

26. Strategy
Research
UX
Design/Content
Development
SEO
Analytics
Localization
WEM
Creative
Brief
Wireframing/
Prototyping
Visual/UI Design
Content Creation Development Authoring QA Localization Release
Analyze/Monitor
Test/Re-test
DESIGN DELIVERY

27. Introduction
Agenda
We’re constantly evolving
Design to Delivery at Salesforce
The Process in Action: Example
Recap
Q&A

28. Example: Sales Cloud Product Page
2013 Present

29. Brief
The Process in Action
Audience:
• Prospect (75%)
Goal:
• User-centric website
• Benefits-driven
• Lead-generation
Metrics:
• Page Views
• Entry (Internal vs. External)
• Visits
• Form Views & Form Completes

30. Wireframing
The Process in Action
There’s more to it than that.
• User journey
• Site architecture
• User testing
• Prototyping
...and much more

31. Visual Design + Content Development
The Process in Action

32. Development
The Process in Action
Requirements:
• Design specs
• RWD
• Interaction

33. Authoring
The Process in Action
+ =
● Copy
● SEO metadata
● Videos
● Drivers/Analytics tracking
● Form values/lead routing info
● mboxes
much more...

34. QA
The Process in Action
+

35. Localization
The Process in Action
Please translate asap and deliver languages as
they become available.
xliff files:
https://org62.my.salesforce.com/06930000005U
DU8
word
count:https://org62.my.salesforce.com/06930000
005UDTy
1. Overview (DE, FR, NL, JP, CN, KR)
http://web-auth.salesforce.com/sales-
cloud/overview/
2. Lightning (DE, FR, NL, JP, CN, KR)
http://web-auth.salesforce.com/sales-
cloud/lightning/
3. Navigation (DE, FR, NL, JP, CN, KR)
http://web-auth.salesforce.com/sales-
cloud/modules/navigation.jsp

36. Analysis
The Process in Action

37. +21%
form conversion:
WATCH DEMO
Analysis
The Process in Action

38. Visual attention
diminished
significantly
below the
midway point
Left nav
received
consistent
attention
Tagline is
salient for the
first few
moments
Copy as well
as headlines
captured
visual
attention.
Note how
icons were
largely
ignored
Analysis
The Process in Action

39. The process is iterative.
Ideation, test, analyze, repeat.

40. One team, one dream.
Collaboration is key.
Campaigns
Dev & QA
Marketing Technology
Marketing Operations
Localization
Program Management
Search Engine Optimization
(SEO)
Search Engine Marketing
(SEM)
Creatives
Content Marketing
Analytics
Web Experience (WEM)
Web Strategy
User Experience (UX)
Visual Design

41. And it’s far from simple.
Visual Design DevWireframeBrief
HTML Localization AnalysisQA
Product Marketing
Research +
Strategy
Content
Creation
Translation
Launch
Testing
More Testing

42. How does a web project get
delivered at your company?

43. Introduction
Agenda
We’re constantly evolving
Design to Delivery at Salesforce
The Process in Action: Example
Recap
Q&A

44. 1. Start with a creative brief.
2. Work as one unit: collaborate.
3. Always be evolving
Takeaways

45. Introduction
Agenda
We’re constantly evolving
Design to Delivery at Salesforce
The Process in Action: Example
Recap
Q&A

46. thank y u