Generate dynamic viewbooks from online content

Let your website do the work: create a
viewbook from your online content
Marc-Olivier Ouellet, coordinator
NAGAP April 2015

admission.umontreal.ca
How many of you:
– Print copies of your viewbook / catalogue?
– Consider that they spent too much resources on it?
– Feel confident that your effort is worth it?
– Can measure the effectiveness of this tool?
Questions

Learn how to build a rich database to store all the
data about your programs from various sources,
including PeopleSoft
Determine innovation ways to leverage your online
content to build powerful tools
Create a dynamic and personalized
viewbook/catalogue that builds upon your online
database
Learning Objectives

ABOUT US
UNIVERSITÉ DE MONTRÉAL

Université de Montréal at a Glance
UdeM’s campus, comprising some 40 buildings, is clustered around the majestic
Art Deco tower of Roger-Gaudry Hall at the heart of beautiful city of Montréal

+66 000 students in 16 faculties and affiliated schools

2 600 professors-researchers
465 chairs and research units
37 affiliated health
institutions
$526M in research revenue
250 undergraduate programs (74%)
350 graduate programs (26%)
16 750 graduate students
7 870 international students

ABOUT OUR
GUIDE D’ADMISSION

We produce annually our Guide d’admission :
– Hybrid between University catalogue and a
Viewbook
– It contains descriptions of all undergraduate
programs offered at UdeM, including :
• Admission Requirements
• Program Structure (courses)
• Career Prospective
• And more…
Admission Guide

Admission Guide 2014-2015

As of before 2014, it was a print publication of about 350
pages, printed in 29 000 copies
Distributed to students and high school counsellors
throughout the province of Québec
Time consuming to produce, assemble and validate
Costly to produce
– About $70 000 CDN each year
– For design, printing, and shipping
– Excluding HR costs
Admission Guide

Lenghtly process
In-house system
Done by an
external firm
Manually
assembling
4 to 5 months to accomplish

New system = end of an era
 Peoplesoft  Legacy systems
PeopleSoft Current websites

We had an opportunity:
– To reflect on our publications and consult with our
partners (high school counsellors)
– To build a strategy that would allow us to improve how
we push information to our prospective students and to
measure the impact of our communication tools
– To get up to speed with new technologies to simplify
the way we work internally
An opportunity
Analysis
Feedback
Trends &
Technology
Effective
strategy
Successful
change

OUR STRATEGY

Program is the most important
factor for a prospective student
when choosing a university*
It is therefore important to keep
program information current and
attractive.
And distribute as widely as
possible:
– online
– mobile
– print
Key Factors in Decision-making
*EDge Interactive – SchoolFinder Group, « What
Students Want », Group Canadian Student Survey
2011

What types of communications do student prefer?
Students habits have changed
Via the 2014 Noel-Levitz E-Expectations Report

Transform our focus and activities
Traditional recruitment Inbound recruitment
Field activities
Travel
on the road
Web et
new
media
Promotion
and ads
Wrriting
content/
multimedia
Promotion
and ads
Analysis
Guidance,
follow-up
Field activities
New media
Web

Take control of our recruitment funnel
Public
• I discover UdeM (notoriety)
Prospect
• I am interested in programs at UdeM
Contact
• I collect information on programs at UdeM
Candidate
• I apply for admission at UdeM
(and possibly at other universities too)
Admitted
• I’m admitted at the UdeM
(and possibly at other universities too)
Enrolled
• I enroll at UdeM
Conversions
Analysis
Need to develop
metrics and
dashboards
Reactivity
Proactivity
Business
Intelligence

Make content about programs available on Web pages
Transform our viewbook into an online document
Capture information about our prospective students
when they come to get the online document
Develop a single platform for distributing the content
(Web and print)
Our goals

Our idea
Website
Database
HTML
PDF
PDF
PDF
Guide
Develop a single platform for distributing the content (Web and print)

We gathered all public content regarding our programs
– Current catalogue / viewbook
– Current websites, HTML pages, CMS, …
– PeopleSoft: reports, tables, extractions, …
– Legacy system, databases, web services, …
– Publications: PDF, word documents, InDesign, …
We made an inventory of all our content
We built a database and entered the content
Build a new website with rich database

Example of our Program detailed page

Our first attempt: Adobe XML Import
Website
Database
XML
HTML

Export your database in a
special XML format, readable
by Adobe InDesign
Import your XML into an
Adobe InDesign file and map
your content elements with
design elements
Using Adobe InDesign XML Import Function

Pros:
– Can produce great results because its flexibility. Once the
content is imported, you can design all elements as you wish
inside Adobe InDesign
Cons:
– Need to have a developer to export your content into the
Adobe XML file required (not as easy task!)
– Not a lot of documentation online
– Not a lot of developers that master this technique, and not a
lot of designers know how to manage this type of document
– Adobe Import function is picky and somewhat buggy
– Does not handle HTML properly
Pros and cons for using this technique

Return on our first attempt
We produced our Guide d’admission 2014-2015 using
this technique
We saved 1 to 2 months, and 20 000$ doing it

Make content about programs available on
Web pages
Transform our viewbook into an online
document
Capture information about our prospective
students when they come to get the online
document
Develop a single platform for distributing the
content (Web and print)
Did we meet our goals ?

Create a print version of our guide for high school
counsellor only
Create a personalized online version for students
– Students would come to our site to build their guide
and choose the content they wanted
– Allow students to order a customized print copy of their
guide that the University would ship them for free
Our refined strategy

Our second attempt: Generating PDF files
Website
Database
PDF
HTML
PDFPDF
PDF
PDF
PDF
PDF

Generating PDF directly from the Web

Create Web page template dedicated for print
Create a specific style sheet for print (CSS file)
– @media print { … }
Adjust the styles of your Web elements (fonts, images,
colors, texts) to show nicely in print
– You can hide elements, like videos, headers, footers,
menus using special CSS code
• Ex: .video { display: none; }
How to – Step 1: Create print-specific page

How to – Step 1: Create print-specific page

Convert your HTML directly to PDF using open-source
library like PhamtonJS (http://phantomjs.org/)
– Programmatically capture web contents and create web
site screenshots in PDF.
– You can specify paper format (Letter, A4, …), margins,
orientation (portrait, landscape)
– You can have custom footers and headers
– You can have page numbers
Learn more: http://jsreport.net/learn/phantom-pdf
How to – Step 2: Convert HTML to PDF

How to – Step 2: Convert HTML to PDF
HTML page PDF document

To make our print Guide d’admission publication, we
had to create a “light version” of our PDF
– Full PDF contains too many pages
We created a light version of our HTML print-specific
page with only the content that we wanted in our
print publication
– No header
– No footer
We converted these light HTML pages into single PDF
documents
We assembled them into a larger InDesign document
How to – Step 3: Create light-version PDF

Return on our second attempt
We produced our Guide d’admission 2015-2016 using
this technique
We saved another month doing it, and 10 000$

Personalized guide

Our plan to create a personalized guide
PDF
PDF
Guide
configuration
stored in a
user profile
Cover page
Other documents
Generated PDF from the
Web with PhamtonJS
(http://phantomjs.org/)
Merge of all PDF files
with PDFtk Server
(https://www.pdflabs.com/)
Need to
automate this
step
PDF

In order to create the personalized version, we need
to build a system to allow students to create a profile
Creating the online version – Step 1

Allow students to add programs to their guide

Allow students to customize their guide

Allow 20 programs by guide
No limit on the number of guides
Mandatory and optional documents
Description of all courses inside the programs selected
Content based on type of students (foreign vs local
student), cycle (undergrads or grads), etc.
Allow to name the guide, delete, modify
Allow to order a print copy
Options for students

Let students from Canada order a print copy
We created a form to collect their postal address
We built a daily batch process that generated all
personalized guides
– with a special front page
– merged them into a zip file
– sent an email notification
Order a print copy at home

To encourage students
to create a guide, we launched
a contest
Simple rules:
1. Create an account
2. Create a guide
3. Submit an application
Get a chance to be reimburse your application fees
Contest « Collect your possibilities »

Personalized guide on Instagram

RETURN ON OUR
EFFORTS

Undegraduate
71%
Graduate
29%
16 400+ accounts were created
4 100+ personalized guides were generated
– Only 140 orders for a print copy
Results after 6 months…
Canadian
2%
Foreign
50%
Québécois
48%

Reduce time to produce our admission guide
Reduce our cost of producing our guide
Maintain good relation with our high school counsellor
Collect data about our prospective students
Open our publication to foreign and graduate students
Measure our recruitment efforts
Outcomes

Tool to measure
Contact
database
Create a guide
Login / Registration
ERP
Applications
Link your data

Period of September 15th 2014 to March 31st 2015 :
– 23% of students who created an account filled out an
application
• Compared to 3,5% of our Website visitors
– 38% of students who created an online viewbook filled out
an application
• Compared to 19% who did not
– 43% of students who created an online viewbook and
downloaded it in PDF filled out an application
• Compared to 36% who did not
– 35% of students who created an online viewbook and
ordered a print copy filled out an application
Analysis

Plans for our 2016-2017 guide
2 weeks to accomplish
This summer, we will produce the Guide d’admission 2016-2017
using the same technique, with automated merge
We can generate about guide in less than 10 min!

DISCUSSIONS

Any question?
Slides are avaiable on Slideshare
– slideshare.net/marcolivier_ca
Contact me :
– Marc-Olivier Ouellet
– Email: mo.ouellet@umontreal.ca
– Twitter: @marcolivier_ca
– linkedin.com/in/mouellet
Discussions

Generate dynamic viewbooks from online content

Recommended

Recommended

More Related Content

What's hot

What's hot (7)

Viewers also liked

Viewers also liked (11)

Similar to Generate dynamic viewbooks from online content

Similar to Generate dynamic viewbooks from online content (20)

Recently uploaded

Recently uploaded (20)

Generate dynamic viewbooks from online content