Durham College has more than 140 full-time post-secondary programs in culinary management, farming and horticulture, business, IT, construction and trades, renewable energy, technology, health care, engineering, emergency services, justice, media, art and design. The college promotes continuous learning and fosters connections with business, industry, government, technology and the surrounding community. It has four student residences, including one that opened just last year.
With campuses in Oshawa and Whitby, Durham College (DC) offers over 11,000 full-time students access to more than 140 post-secondary programs, including four honors bachelor degree and nine apprenticeship programs. The number of students drastically improves therefore, the college wanted a quick and effective way to meet the challenge of managing communications with thousands of students, employees, and visitors on large campuses.
Since the college does operate in Oshawa and Whitby and needs to communicate to over 11,000 students, the best and effective way would be to have digital signage. The college could easily communicate to students and also display trending news, advertisements, promotions, and weather details on the screen. This information will be in the loop therefore, will not be missed by any students.
To further have a clearer direction about the visuals of the project, I sketched some wireframes. This helped me to make a good-looking design following the brand guidelines of Durham College.
Once I was happy with the wireframes, I started to create the comp in Illustrator. Keeping in mind the target audience has a wide range from students, parents, staffs to professors, therefore, I had to make sure to keep the interface clear and easy to read.
The signate contains a weather pane, and all the icons representing each weather condition were sketched and created in illustrator. Approximately 16 weather icons were sketched and created.
Durham College had a well-detailed brand guideline, which includes the font types to be used and the approved colour scheme that's allowed to use when designing. The college did also provide additional assets and logo variations that I could include in the design.
● Typography - Based on the guidelines, the only fonts I could use were Lato and Oswald. I had limited choice and wanted to create a Visual hierarchy differentiating the main heading from the content. Therefore, I used Oswald for the text that needed more attraction and Lato for the rest.
● Colours - Durham college had 4 primary colours (DC Green, Brown, White, and black) and 5 secondary colours. I did not want to deviate from the brand and used the DC Green and Brown for the entire design. Using a white clean background and 2 colour gave the nice neat contrast I wanted.
The digital signage concept was designed to showcase multiple informative elements to the viewer. This project was designed to be placed in a high traffic area such as a school hallway, where students and faculty would be able to quickly glance at it on the way by and see the information. The backend of the signage is handled using JSON and PHP to pull the required data from the server.
Working on this project has made me learn more about the usage of PHP, database management and using gsap for quick and easy animations.
● Web Design & Development
● PHP Development
● Video Editing & Motion Graphics
● Illustration & Iconography
To create the main design layout, icons & advertisements I used Adobe Illustrator & for advertisement Photoshop was used. The project was coded using HTML, CSS, JS and used PHP to communicate with the server.
