Digital Signage
This digital signage was designed specifically for the flat screen televisions located throughout Durham College campus. The signage displays a variety of information including the current time, date, weather, menu items, advertisements, and other relevant information for the day. As many individuals pass through the college, this type of signage can be of great benefit to them. Digital signage of this type is popular across the globe and is therefore applicable to people of all backgrounds.
About the Project
The project showcases a range of skills and elements such as motion graphics videos, graphic design elements, coding, GSAP animations, SVG elements, and PHP/database work. The project's main objective was to illustrate the significance of the digital realm, which has already arrived and is here to stay. The project also demonstrates different types of advertising and ways to update information digitally, as well as ways to enhance the design of the information.
Objective & Challenges
The purpose of this project was to combine various components into a cohesive digital sign for Durham College. The process was challenging but enjoyable as it required coordination and aesthetics to ensure that all elements work well together. Design and coding were necessary for the logo pane and weather section, which required straightforward html/css coding. GSAP animation capabilities were utilized for the motion graphic ads and promotional posters. The project was comprehensive and allowed for the utilization of various abilities, including JavaScript and database work. Although working with databases can be challenging, it was a supplementary skill that was developed during the project. All skills were improved, resulting in an expertly crafted final digital sign.
The Process
The first step in creating this project was to plan and sketch according to Durham College's brand standards. Once the sketches were completed, a composite was created with all the components in their proper places. After receiving feedback, the original designs were deemed too rigid and monotonous, and additional secondary colors were added to simplify the design. The next step was to create the logo pane and the time and date section, with a focus on perfect alignment and spacing. The news pane and ticker tape emphasized color and arrangement. The weather pane required the creation of 18 different weather icons, with a focus on making them easily noticeable. The final components of the project were the motion graphic GSAP animation ads and promotional videos. Three animated advertisements were created using graphics and GSAP coding for captivating transitions, and three promotional videos were created in Adobe After Effects to convey their messages quickly in 10-20 seconds. All the components worked together effectively in this project.
The Deliverable
The main focus of my role in this project was to design a cohesive and easily updateable information and graphics display. Each element of the sign had its own unique style, and I used motion graphics and GSAP animations in the advertisement areas. The various components such as the weather pane, news pane, ticker tape pane, and emblem pane were all coded and styled accordingly. In addition, I utilized PHP coding and worked on the database to ensure that the sign was functioning correctly and constantly receiving the latest information updates. The end product is a modern, informative, and user-friendly digital sign for Durham College Institute.