Case StudyGeorgia Tech - College of Engineering - 2014 Redesign

Eric Sembrat - DrupalCamp Chattanooga - September 2014

Who Am I?A quick introduction!

• Web Manager for the College of Engineering at Georgia Tech

• Ph.D. Student in Instructional Technology at Georgia State University !

• Website: http://ericsembrat.com• Twitter: @esembrat• Hashtag: #DrupalGTnooga

Eric Sembrat

• The Scenario• The Plan• The Delivery• The Roll Out• Lessons Learned• Questions, Comments?

Our Roadmap

The ScenarioWhere the College of Engineering was in 2013.

• The College of Engineering at Georgia Tech had been without a developer for two years and relied on a consulting firm for various web changes.!

• I was hired in January 2014 to steer the web redesign and provide in-house Drupal development.

Our Study

• The campus has just completed a web redesign template project (Jan - Oct 2013)

• Led by Institute Communications!

• Focus on:• Responsive adaptive styling• Native Drupal 7 theme• Style standards for campus web presence

Campus

Old CoE

Old CoE

• A mishmash of structure and design:• 3 content types for new stories• Various unused/unclear content types• Large micro sites deeply integrated• No central authentication linked• No analytics linked• No adaptive theme or responsive design• Rarely utilized backups and security updates• All custom layouts were wrangled in the WYSIWYG fields

Existing Website

• The college wished to leverage Drupal’s sub-theming infrastructure and create a College of Engineering branded template.

Adapt & Refine

GT GT CoE GT CoE Site(s)

The PlanWhere the College of Engineering was in 2013.

• The redesign is composed of three elements:• 1) Structure & Content Reorganization• 2) Theming & User Interface Design• 3) Requested & Unexpected Changes

Plan

• The redesign is composed of three elements:• 1) Structure & Content Reorganization• 2) Theming & User Interface Design• 3) Requested & Unexpected Changes

PlanCommunications Team

• The redesign is composed of three elements:• 1) Structure & Content Reorganization• 2) Theming & User Interface Design• 3) Requested & Unexpected Changes

PlanCommunications Team

Consultant

• The redesign is composed of three elements:• 1) Structure & Content Reorganization• 2) Theming & User Interface Design• 3) Requested & Unexpected Changes

PlanCommunications Team

Consultant

Web Developer

• Reorganize content hierarchy to match new menu location and limitations.

• Rewrite content to reduce redundancy, update old information, and simplify pages.

• Provide feedback on administrative layouts, functionality, and design.

Structure & Content

• Design Drupal 7 theme template.• Develop initial structure of website and page templates.

• Integrate development with Georgia Tech standards (CAS authentication, new GT theme template).

Theming & UI Design

• Refine development and design based on feedback.

• Generalize theme template for sub-subthemes.• Adjust development for unforeseen change requests.!

• Communicate with consultants to ensure development is maintainable and scalable.

Requested/Unexpected Changes

• Unique role that communicated between Communicators and Consultancy.

• Determined which tasks were appropriate for consultant work.• Translated technical specifications to understandable language.• Refined consultant output to be more generally usable.

Web Developer

Timeline

Content creation, updates, and refinement

Consultancy development and rollout

Web Developer refinement and changes

Final Review

rolloutinitial

• Drupal theme (inheriting from the GT theme)• Development Drupal installation with structure and dummy content

• Custom features for structure rollout

Delivery By Consultant

The Roll OutWhere the College of Engineering was in 2013.

• Changes were required post-delivery to match the current trends and practices with Drupal on campus.

• WYSIWYG filters and capabilities• Further mobile theming and adjustments• Changes to views and panel elements• Theme separation and segmentation• Sass integration

Post-Delivery

• Changes were made to the content to match feedback by the College of Engineering faculty, staff, and administration.

• Construction of internal protected pages• Migration of specialty pages (accreditation, etc)• Migration of existing content from old website• Adjustment of content types to match unexpected requirements

Changes

Lessons LearnedWhere the College of Engineering was in 2013.

• We are still developing the website.• Iterative development cycle

• Changes, bugs, additions• Security updates & patches

!

• Using feedback, requests, and suggestions to develop new pages, features, and functionality

Lessons Learned

• 1) Broken Links will happen• Think about approaches to solving, mitigating issues.

• 2) Communicate development• Faculty and staff may depend on the website for particular

content.

• 3) Develop, Test, and Roll Out • Staging environments for new features are crucial to a smooth

rollout.

• 4) Soft Launch • Test out the deployment and focus on squashing 0-Day Issues

Lessons Learned

DemoQuick highlights and features!

Let’s ChatQuestions, Comments, Concerns, Discussions about Web Redesigns