In November 2016, Liz Russell and Ksenia Dynkin of Bluecadet presented the STC-PMC with a case study about best practices learned from a project their company did for the Hoover Mason Trestle, a historical landmark inBethlehem, Pennsylvania. They spoke about the research that needed to be done, the content development process, the storytelling strategy and framework they devised, and how they translated the content strategy for user-friendly kiosks and apps for visitors' mobile devices when visiting the Hoover Mason Trestle.

1. B L U E C A D E T
Mobile-First Content

2. O V E R V I E W
About Us
2

3. L I Z R U S S E L L
3
K S E N I A DY N K I N
A B O U T U S

4. Bluecadet isanEmmyAward-winning
digitalagencythatcreatesworld-class
websites,mobileapps,interactive
installations,andimmersive
environmentsformuseums,universities,
nonprofits,andculturalbrands.
ABOUT US

5. PHILADELPHIA
Fishtown
NEW YORK CITY
Chelsea

7. 7

9. T O U C H S C R E E N S
G E S T U R E - D R I V E N E X P E R I E N C E S
E X H I B I T I O N S & A P P S
G A M E S
R E S P O N S I V E W E B S I T E S
T O U C H WA L L S
L A R G E - S C A L E P R O J E C T I O N S
D I G I TA L O R I E N TAT I O N S TAT I O N S
E X P E R I E N T I A L M A S T E R P L A N S
LO C AT I O N - B A S E D E X P E R I E N C E S
D O C U M E N TA R Y F I L M
WAY F I N D I N G & S I G N AG E

13. COLOR PALETTE & STYLE GUIDE
VISITOR BUTTONSPRIMARY TYPEFACESECONDARY LOGO
PRIMARY LOGO
ALTERNATE LOGO
Museum of the American Revolution
Philadelphia, PA
BUILDING GRAPHICS

14. ABOUT BLUECADET
Bluecadet is an Emmy Award-winning digital agency that creates world-class websites, mobile apps, interactive installations, and immersive environments. Established in 2007,
Bluecadet collaborates with leading museums, cultural institutions, universities, and nonprofit organizations to educate, engage, and entertain. From a touchscreen T. Rex puzzle
at Chicago’s Field Museum, to a multimedia advocacy campaign for Doctors Without Borders, to MoMA’s bilingual mobile guide exploring the murals of Diego Rivera, our work
inspires interaction and imagination.
Our process strikes an ideal balance between structure and creative freedom, with an emphasis on strategic planning and strong, sustainable solutions. We are approachable
perfectionists who believe in the power of digital technology to surprise and delight people of all ages—changing the way we look at objects and information, encouraging
shared experiences and exchange, and making learning more like play. We are driven by a genuine commitment to the mission of each client, and every day we roll up our
sleeves to ensure exceptional service and attention to detail. As digital storytellers, we are dedicated to bridging technology and culture in the service of human connection.
Our process strikes an ideal balance between structure and creative freedom, with an emphasis on strategic planning and strong, sustainable solutions. We are approachable
perfectionists who believe in the power of digital technology to surprise and delight people of all ages—changing the way we look at objects and information, encouraging
shared experiences and exchange, and making learning more like play. We are driven by a genuine commitment to the mission of each client, and every day we roll up our
sleeves to ensure exceptional service and attention to detail. As digital storytellers, we are dedicated to bridging technology and culture in the service of human connection.
Overview & History
About Bluecadet
14

19. 19
Offsite
Recommended Improved
Recommened Feed Connections
Favorites
Sync Favorites
LoginCreate Account
Story Detail Object Detail
Preferences
Mobile Website
Website
Email
Social Media
Begin
Experience
Talk Back
App Store App

28. O V E R V I E W
Our Content Processes
28

29. CONTENT DEVELOPMENT
Developing&buildingnarrativestructure
Interpretive Exhibits | Installations | Web+Mobile

30. C o n t e n t D e v e l o p m e n t | K e y P r o j e c t s
BASEBALL HALL OF FAME NEW YORK PUBLIC LIBRARY EINSTEIN HEALTHCARE NETWORK HOOVER MASON TRESTLE
MONTICELLO FORD PRESIDENTIAL LIBRARY MUSEUM OF THE AMERICAN REVOLUTION JFK LIBRARY & MUSEUM
INDEPENDENCE SEAPORT MUSEUM DITTRICK MUSEUM AT CASE WESTERN RESERVE SAINT JOHN PAUL II SHRINE

31. C o n t e n t D e v e l o p m e n t | Wo r k + D e l i v e r a b l e s
I.Research
Topic Research
Content Audit
Developing Themes & Structures
Asset Research
Expert Interviews

32. C o n t e n t D e v e l o p m e n t | Wo r k + D e l i v e r a b l e s | Re s e a r c h

33. C o n t e n t D e v e l o p m e n t | Wo r k + D e l i v e r a b l e s
II.Framework
Identifying core stories
Conceptual framework documents
Content Matrixes / Templates
Taxonomies
Sample Content for Design

34. C o n t e n t D e v e l o p m e n t | Wo r k + D e l i v e r a b l e s | F r a m e w o r k
B E F O R E A F T E R

35. C o n t e n t D e v e l o p m e n t | Wo r k + D e l i v e r a b l e s
III.ContentProduction
Copywriting
Writing UI Copy
Asset gathering

36. C o n t e n t D e v e l o p m e n t | Wo r k + D e l i v e r a b l e s | P r o d u c t i o n

37. O V E R V I E W
Project Background
37

38. 38
O V E R V I E W
H O O V E R - M A S O N T R E S T L E

39. 39
H O O V E R - M A S O N T R E S T L E
H I S T O R I C C OA L I T I O N V I S I O N S TAT E M E N T
The Bethlehem Heritage Coalition believes the Hoover-Mason
Trestle provides an unprecedented opportunity to connect the
community and visitors with the story of Bethlehem Steel, the
vibrant community in which it resided, and the people who made
its operation possible. The Trestle provides the narrative spine for
these stories.

40. 1. WRT Architects
2. Bethlehem Redevelopment Authority
3. ArtsQuest
4. Bethlehem Heritage Coalition:
1. Representatives from the Delaware and Lehigh
National Heritage Corridor
2. Historic Bethlehem Partnership
3. Lehigh University’s South Side Initiative
4. National Canal Museum
5. National Museum of Industrial History
6. South Bethlehem Historical Society
7. Steelworkers’ Archives
8. Artefact Inc.
9. emDESIGN
H O O V E R - M A S O N T R E S T L E
P R O J E C T B AC KG R O U N D
40
S TA K E H O L D E R S

41. H O O V E R - M A S O N T R E S T L E
C O N T E N T L O C AT I O N S & C H A N N E L S
41
N A R R AT I V E S I G N AG E
Focus on the story, history and culture of the workplace
T E C H N I C A L S I G N AG E
Focus on the processes and
machinery on the site
R E S P O N S I V E S I T E & AU D I O T O U R
Focus on the structures and artifacts found on the
site; Offer an overview of the story and provide
access to additional materials

42. H O O V E R - M A S O N T R E S T L E
Content Development Case Study
42

43. 43
P R O C E S S
A F E W C H A L L E N G E S
1. Theprojecthadalotofstakeholders
withvaryingpriorities.
2. TherewasALOTofcontent,butithad
notbeengathered,organized,or
synthesized.
3. Theclientdidnothavethebandwidth
ortheskillstocreatecontentforthe
project.

44. 44
P R O C E S S
M A S S I V E S C A L E !

45. 45
C O N T E N T D E V E L O P M E N T
W H E R E W E B E G A N : I N T E R P R E T I V E P L A N
45
Z O N E 1 :
1 . S TO C K H O U S E
( I , I I I )
2 . M A P O F T H E P L A N T
( I , I I I , V )
OV E R L AY S O F D F F E R E N T T I M E P E R I O D S
3 . W H AT I S H M T ?
( I , V )
P R O C E S S E X P L A N AT I O N O F B L A S T F U R N AC E S
Z O N E 3 :
8 . W E L D E D W O R K E R N A M E S
( I , I I )
F I R S T P E R S O N S TO R Y ( A U D I O )
9 . S H E LT E R E D M E D I A E X P E R I E N C E
( I , I I )
1 0 . M E N A N D W O M E N
( I I , I I I , I V )
G E N E R AT I O N S O F W O R K E R S
WAV E S O F I M M I G R A N T S
Z O N E 5 :
1 4 . F + G F U R N AC E S + W O R K E R S A F E T Y
( I , I I , V )
Z O N E 2 :
4 . M U LT I - U S E P R O G R A M I N G + P R E S E N TAT I O N
5 . H I S TO R I C I M AG E OV E R L AY O F C U R R E N T V I S TA
( I V, V )
6 . F O U N D E R S O F B E T H L E H E M S T E E L
( I I , I I I , I V )
7. S O U T H S I D E I N T E R P R E TAT I O N
( I I , I V )
Z O N E 6 :
1 5 . T R A N S P O R TAT I O N N O R T H S I D E V I S TA
( I , I I I , I V, V )
1 6 . N O. 2 M AC H I N E S H O P
W W I I A R M A M E N T S
OT H E R M I L I TA R Y P R O D U C T I O N
I N D U S T R I A L A P P L I C AT I O N S
( I I , I I I , V )
Z O N E 7 :
1 7. M I N S I T R A I L
( I I , I V )
1 8 . J O N E S I S L A N D W E L D M E N T
( I I I , I V, V )
Z O N E 8 :
1 9 . H I G H H O U S E
( I , I I )
2 0 . W H AT I S H M T ?
( I , V )
Z O N E 4 :
1 1 . G A S B LO W I N G E N G I N E H O U S E
( I , I I )
1 2 . R A I L C A R S + M AT E R I A L S
( I , I V )
1 3 . W O R K E R ’ S S H A N T Y - S TO R I E S
( I I )
L I N E A R
T I M E L I N E
1
L I N E A R
T I M E L I N E
2
L I N E A R
T I M E L I N E
3
L I N E A R
T I M E L I N E
4
P R O J E C T I O N S
A LO N G
N O R T H WA L L
O F B LOW E R
H O U S E T O T H E
E A S T O F R A I L
C A R S [ I N T H E
A R C H E D B AY S
T H AT U S E D
T O O P E N I N T O
T H E B LOW E R
H O U S E ]
P OT E N T I A L
S PAC E F O R T H E
L I S T E N I N G
S TAT I O N : N E W
C O N S T R U C T I O N
O F R E C O R D I N G
B O OT H W O U L D
B E I N T H E
V I S I T O R ’ S
C E N T E R AT T H E
W E S T E N D O F
T H E T R E S T L E
P R O J E C T I O N S
A LO N G E A S T
WA L L O F T H E
B U I L D I N G
T H AT FAC E S
T H E PA R K I N G
LOT A N D
E A S T E N D O F
T H E T R E S T L E
[ O P P O R T U N I T Y
F O R L A R G E R
S C A L E ]
*
* * *
* *
R A M P A S
I N T R O D U C T I O N
L I N E A R
T I M E L I N E
5
L I N E A R
T I M E L I N E
6

46. 1. Reviewing materials gathered by he client
2. Watching documentaries, reading books + articles
3. Visiting the site
4. Reaching out to subject matter experts
C O N T E N T D E V E L O P M E N T
W H E R E W E B E G A N
46
U N D E R S TA N D I N G T H E S T O R Y

47. 47
1. Oral Histories (“living” and archival)
2. Archival Imagery
3. Videos (archival, drone footage, interviews)
4. Interview transcripts
5. Diagrams, technical documentation
C O N T E N T D E V E L O P M E N T
C O N T E N T AU D I T
The goal of the audit it to ingest material and begin to organize/prep it for future use.

48. 48
1. Bigideastatement
2. Majorstoryarcsandthemes
3. Overviewofthestory withkey
moments/storypoints
4. Narrativeapproach
5. Visitorexperienceobjectives
6. Assetoverview
C O N T E N T D E V E L O P M E N T
C O N T E N T B R I E F : A S TA R T I N G P O I N T F O R D E S I G N

49. C O N T E N T B R I E F
B I G I D E A S TAT E M E N T
49
A very short statement that summarizes the
single key takeaway for the experience. It is a
way for the team to align around the core
message and purpose of the experience.
The big idea should capture WHO, WHAT,
WHEN, WHERE, and WHY
O V E R T H E L A S T C E N T U R Y, T H E W O R K E R S O F
B E T H L E H E M S T E E L B U I LT A M E R I C A . I T WA S N ’ T E A S Y.

50. C O N T E N T B R I E F
S T O R Y A R C S A N D T H E M E S
50
5 Themes
• Technology
• Steelworkers lives
• National, regional & global connections
• The plant’s impact on the city and region
• Ongoing transformation
Overall story arcs
• Working man as hero
• Memorial for great things accomplished
• Parallels to American history
Themes can be explicitly shared with
visitors (for instance, as categories) or an
implicit organizing factor. What is this
story about?
Story arcs are more general than themes,
and refer to how the story is framed. What
kind of story is this?

51. C O N T E N T B R I E F
O V E R V I E W W I T H K E Y S T O R Y P O I N T S
51
The content developer needs to
communicate to the team (designers,
creative director, project manager,
developers, partners, etc) what the story is
about, and what the most interesting story
points are.
This ensures the project will be designed
for the content.

52. C O N T E N T B R I E F
N A R R AT I V E A P P R OAC H
52
The narrative approach defines the writing
or “conversation style” for the experience.
This includes:
• Tone
• Perspective
• Time

53. C O N T E N T B R I E F
V I S I T O R E X P E R I E N C E O B J E C T I V E S
53
How is success defined?
• Learning Objectives
• Affective Objectives
• Experiential Objectives

54. C O N T E N T B R I E F
A S S E T O V E R V I E W
54
What do we have? What are the best assets?
• Video?
• Images?
• Quotes?
• Audio clips?
• Other?

55. Wedevelopcontentinparallelwithdesign.Thetwoprocessesconstantly
informoneanother.
C O N T E N T + D E S I G N
55

56. 56
1. ContentFramework
2. ContentMatrices
• Imageselection
• Videoselection
• AudioSelection
3. Copywriting
• InterpretiveSigns
• Mobile/web
• AudioTourScript
C O N T E N T D E V E L O P M E N T
C O N T E N T D E V E L O P M E N T A N D P R O D U C T I O N

57. 5757
C O N T E N T D E V E L O P M E N T
P L O T T I N G T H E M E S A N D A S S O C I AT I O N S

58. 58
C O N T E N T D E V E L O P M E N T
N A R R AT I V E / T H E M AT I C P L A N
58

59. 59
C O N T E N T D E V E L O P M E N T
C O L L A B O R AT I O N A N D D E L I V E R A B L E S
59
Internal Documents Drafts for Client Review

60. 60
C O N T E N T D E V E L O P M E N T
W E B & M O B I L E F R A M E W O R K
First round of wireframes
60

61. 61
C O N T E N T D E V E L O P M E N T
W E B & M O B I L E F R A M E W O R K
61
Second round of wireframes

62. 62
C O N T E N T D E V E L O P M E N T
W E B & M O B I L E F R A M E W O R K
62
Third round of wireframes

63. 63
C O N T E N T D E V E L O P M E N T
W E B & M O B I L E F R A M E W O R K
63
First round of design

64. 64
C O N T E N T D E V E L O P M E N T
W E B & M O B I L E C O N T E N T
64

65. 65
C O N T E N T D E V E L O P M E N T
W E B & M O B I L E C O N T E N T
65

66. 66
C O N T E N T D E V E L O P M E N T
W E B & M O B I L E C O N T E N T
66

67. 67
C O N T E N T D E V E L O P M E N T
N A R R AT I V E S I G N AG E F R A M E W O R K
67

68. 68
C O N T E N T D E V E L O P M E N T
N A R R AT I V E S I G N AG E F R A M E W O R K
68

69. 69
C O N T E N T D E V E L O P M E N T
N A R R AT I V E S I G N AG E F R A M E W O R K
69

70. 70
C O N T E N T D E V E L O P M E N T
N A R R AT I V E S I G N AG E F R A M E W O R K
70

71. 71
C O N T E N T D E V E L O P M E N T
T E C H N I C A L S I G N AG E F R A M E W O R K
71

72. 72
C O N T E N T D E V E L O P M E N T
T E C H N I C A L S I G N AG E F R A M E W O R K
72

73. 73
C O N T E N T D E V E L O P M E N T
T E C H N I C A L S I G N AG E F R A M E W O R K
73

74. 74
C O N T E N T D E V E L O P M E N T
T E C H N I C A L S I G N AG E F R A M E W O R K
74

75. 75
C O N T E N T D E V E L O P M E N T
T E C H N I C A L S I G N AG E F R A M E W O R K
75

76. 76
C O N T E N T D E V E L O P M E N T
T E C H N I C A L S I G N AG E F R A M E W O R K
76

77. 77
C O N T E N T D E V E L O P M E N T
T E C H N I C A L S I G N AG E F R A M E W O R K
77

78. 78
C O N T E N T D E V E L O P M E N T
T E C H N I C A L S I G N AG E F R A M E W O R K
78

79. 79
C O N T E N T D E V E L O P M E N T
T E C H N I C A L S I G N AG E F R A M E W O R K
79

80. I M PAC T & TA K E AWAY S
Conclusion
80

81. 1. People are stopping and reading the signs!
2. Website/App has had over 65,000 users
3. Local news coverage
4. Awards:
1. Pixel Awards – Best Responsive
Design – Finalist
2. W3 – Best In Show, General
Website Category
3. Awwwards – Site of the Day
4. Communication Arts –
Webpick of the Week
H O O V E R - M A S O N T R E S T L E
R E C O G N I T I O N
81

82. 82
P R O C E S S
TA K E AWAY S
1. Streamlined content review process with stakeholders
2. Being an icon of American industrial might helps
3. We want more!