Project Overview
This digital signage project was developed as a branded communication tool for Durham College, combining dynamic design, motion graphics, and web technologies. The signage was built to function as an eye-catching digital display, showcasing key college announcements, updates, and branding elements in real time. The project featured three motion graphics videos and custom web animations, all created by me, designed to engage students and visitors across campus. The signage adhered strictly to Durham College's brand guidelines and was developed using HTML, CSS, JavaScript, and PHP, ensuring both functionality and scalability for future updates.
Objectives
The main objective of the project was to create a professional, fully-branded digital signage solution that could effectively communicate with a broad audience on campus while reinforcing Durham College’s visual identity. The goal was to integrate multimedia content—including videos and animations—with web-based styling and interactivity in a seamless and visually appealing way. A strong focus was placed on design consistency, clarity, and real-time usability, ensuring the signage would function effectively in a live display environment. The use of PHP allowed for easier content updates, while animations added energy and movement to draw attention.
Challenges
One of the key challenges in this project was maintaining brand consistency across all elements while incorporating custom animations and video content. Balancing motion graphics with usability meant ensuring that the animations were engaging but not overwhelming or distracting. Another technical challenge involved integrating PHP with front-end components to create a semi-dynamic system, particularly when testing on signage screens. Ensuring responsiveness and legibility on larger displays also required careful attention to scale, contrast, and layout hierarchy. Creating three high-quality motion graphics videos within the project timeline added both a creative and time-management hurdle.
Click below to view the Signage
View SignageTools Used
- Premiere Pro
- After Effects
- Illustrator
- Photoshop
- PHP
- Javascript
- GSAP
- HTML, CSS