Your SlideShare is downloading. ×
0
Responsive Web Design
Responsive Web Design
Responsive Web Design
Responsive Web Design
Responsive Web Design
Responsive Web Design
Responsive Web Design
Responsive Web Design
Responsive Web Design
Responsive Web Design
Responsive Web Design
Responsive Web Design
Responsive Web Design
Responsive Web Design
Responsive Web Design
Responsive Web Design
Responsive Web Design
Responsive Web Design
Responsive Web Design
Responsive Web Design
Responsive Web Design
Responsive Web Design
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Responsive Web Design

258

Published on

Over the course of the video, David will discuss why he decided to move to RWD, the approach he took in iteratively improving their current design and information architecture and how the team used an …

Over the course of the video, David will discuss why he decided to move to RWD, the approach he took in iteratively improving their current design and information architecture and how the team used an agile methodology to make the transition for their main site and nearly 200 sub-sites.

Published in: Business, Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
258
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
3
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  1. On the road to RWD David Shipley and Trevor Thomas University of New Brunswick www.unb.ca/its
  2. About David • BA in Information and Communications Studies (‘05), working on MBA (‘15) • Started at UNB in 2008 in Communications and Marketing, moved to Information Technology Services (ITS) in 2012 • Former business reporter for the provincial newspaper • Served in Canadian Army from 1997 to 2002 • Born on Canada’s west coast in beautiful British Columbia www.unb.ca/its
  3. About Trevor • Programmer / Analyst Diploma from College of Business Technology • Web Developer at University of New Brunswick • Lead Developer for the RWD project • NBA and NFL fan. Don’t call on Sundays. Or Tuesday, Wednesday or Thursday nights. Unless it’s about sports. • Also from British Columbia www.unb.ca/its
  4. Agenda • About UNB • Overview of UNB.ca • Web Strategy & Governance • Why RWD • Site Demo • Measuring Success • Lessons Learned www.unb.ca/its
  5. About UNB • Founded in 1785 and is the oldest public, English- language university in North America • Two main campuses in Fredericton and Saint John, New Brunswick • Approximately 11,000 students, 3,000 faculty and staff. www.unb.ca/its
  6. About UNB.ca • Among the first Canadian universities to launch a comprehensive website in the early 1990s • Site grew to more than 200,000 pages by 2008. • Four-year project begun in 2008 to overhaul entire site including all faculties, schools and departments. www.unb.ca/its
  7. Web Governance @ UNB • Following initial 2008 project, efforts were made to formalize web governance at UNB, resulting in our first web strategy in 2010. • Web Strategy Group consisting of four members (AVP IT, Director C&M, Director Solutions and Web Strategist). • Web Strategy Group’s mandate included implementation of senior university management-approved two-year plan and oversight over the UNB common look and feel. • Site owners (content creators) responsible for leveraging university tools (Cascade Server) within university- approved brand (Common Look and Feel). www.unb.ca/its
  8. UNB Web Strategy The web environment at UNB is all external and internal infrastructure that delivers content as well as application functionality to end users. It includes services built, maintained or delivered by UNB or third-party services such as asocial network sites that are used by UNB as ways of delivering information or engaging with end-users. www.unb.ca/its
  9. UNB Web Environment www.unb.ca/its •UNB.ca – externally orientated, revenue generation and reputation building •InsideUNB – internally orientated, transaction- focus “get stuff done” •MyUNB – personal information and electronic services (Portal)
  10. Why RWD? • External mobile traffic had grown from 1% in 2010 to 5% in 2012 and 14% in 2013 • Avoid content duplication (no m.unb.ca) and benefit SEO • Easier to maintain www.unb.ca/its
  11. By the numbers • 48% of American teens own an iPhone • 43% use their smartphone for all of their web surfing • School website trumps all other online resources in influence (e-mail, third-party websites, social) • 70% say the website affected their perception of the school • Students prefer to browse on a laptop/desktop, but still visit on mobile. (70% visited a school website on a mobile device) • 50% want the site to adapt to their device Source: Noel Levitz, E-Expectations 2013 www.unb.ca/its
  12. The site circa July 2013 www.unb.ca/its
  13. Web Design Refresh Objectives • Provide web content in the best possible format for desktops, laptops, tablets, smartphones and other handheld devices • Reduce overall web page clutter, lighten overall look • Improve campus-level recognition • Improve audience-based navigation on homepage • Integrate social media • Improve accessibility www.unb.ca/its
  14. Who did we learn from? • University of Notre Dame • Boston Globe • University of Western Ontario • College of William and Mary • Ball State University • Boston University • And many more www.unb.ca/its
  15. How was the project structured? • Research Phase – Late 2011 • Goal Setting – Summer 2012 • Wireframes – Fall 2012 • Design Mock-ups – Winter 2013 • Implementation – Spring & Summer 2013 www.unb.ca/its
  16. www.unb.ca/its
  17. Project Management • ITS has a project management office (PMO) • An experienced, senior project manager was assigned to this effort • We used the Agile project management approach. www.unb.ca/its
  18. Demo www.unb.ca/its
  19. Key elements in project success • University leadership-approved web strategy • Concise governance model for the web • Data-driven decision model (Analytics and Usability Testing) • Project Management Methodology throughout (Agile) • Focus on improvement, not perfection www.unb.ca/its
  20. Project success measurements • Development work completed in four months duration with small project team at a 92% reduction in cost from ‘08 effort and 78% reduction in duration. • More than 200 sites and 28,000 pages converted in 10 days. • Average increase of approximately 70% in visitors to prospective student content in the first 30 days, year over year. 10% improvement in smartphone user time on site in the past 30 days, YoY. • General satisfaction amongst university community. www.unb.ca/its
  21. Lessons learned • Improved inventory of sites would have eased migration efforts • Use of the RACI model externally to the project, along with clear expectations for what consultation means with some stakeholders would have eased internal, pre- launch issues. • Include freshness of content as a key testing criteria for dynamic elements www.unb.ca/its
  22. Technical Walk Through www.unb.ca/its

×