The Art of Noticing: A Closer Look at NYUAD Campus
The Art of Noticing: A Closer Look at NYUAD Campus is a creative project that combines a short film and an interactive website. The project’s main goal is to encourage viewers to slow down and appreciate the small, beautiful moments that often go unnoticed in daily campus life. The overall concept centers on “noticing the unnoticed” such as birds interacting, the unique textures of tree bark, and the gentle breathing of a dog by using close-up shots and interactive web elements. The experience is designed to inspire users to pay attention to the little things and discover hidden beauty in their surroundings, fostering a sense of mindfulness and appreciation for everyday details.
The project began with the creation of a short film, which was developed by capturing close-up videos of various scenes around the NYUAD campus. Early mornings were chosen for filming, including a sunrise shoot around 6am during a run, to take advantage of natural lighting and quieter surroundings. The filming process involved observing the environment closely and recording moments such as various flower patterns, water droplets, birds chirping and interacting, etc. The intention was to highlight details that are usually overlooked in the rush of daily life.
The editing phase was completed using CapCut, a video editing application. The process required sorting through a large amount of footage to select the most meaningful and visually interesting clips. Arranging these clips into a cohesive narrative took significant time and attention to detail, ensuring that the transitions and pacing matched the calm, reflective mood of the project.
A major challenge during editing was selecting appropriate background audio. Due to religious reasons, the use of songs with musical instruments was avoided. Initially, a track featuring whispering was found, but it also included instrumental elements. After researching possible solutions, the app Stemz was discovered and used to remove the instrumental layers, leaving only the whispering.
The website was developed using a framework adapted from a YouTube tutorial by Codehal (2022), but was extensively modified to fit the project’s unique theme and requirements. The layout, color scheme, and typography were customized, and new sections such as “Inspiration,” “Movie,” and “Details” were added to present the film and its context in an engaging way. The site was designed to be user-friendly and responsive, ensuring accessibility across different devices and screen sizes.
One technical challenge encountered was enabling the hero banner video to autoplay with sound. Modern browsers typically mute autoplaying videos to prevent unwanted noise, which initially prevented the intended experience. This issue was resolved by allowing the video to autoplay in muted mode, and then using JavaScript to unmute the video as soon as the user interacts with the page (such as scrolling or tapping). This approach balanced browser restrictions with the desired user experience.
Another issue involved a visible line on the left edge of the hero video, which made it appear misaligned. After troubleshooting and seeking assistance from AI tools, the problem was identified as a CSS styling issue. Adjustments were made to ensure the video stretched perfectly from edge to edge, eliminating the unwanted line and improving the visual presentation.
For the “Details” section, an interactive magnifier effect was implemented to allow users to explore hidden aspects of images by hovering or tapping. Developing this feature was quite challenging, as the initial idea was complex and difficult to execute smoothly. The concept was simplified to create a basic but effective magnifier, which still provided an engaging way for users to discover subtle details in the visuals.
The Art of Noticing successfully met its primary objectives by encouraging viewers to observe and appreciate the beauty in everyday campus moments. Both the film and the website work together to create a thoughtful, immersive experience that highlights the value of paying attention to small details. Throughout the process, the project provided valuable learning opportunities in video editing, web development, and creative problem-solving.
Several challenges were encountered, including technical issues with video playback, audio editing constraints, and the complexity of implementing interactive web features. Each challenge was addressed through research, experimentation, and adaptation of available tools and resources. While there were additional features and scenes that could not be included due to time constraints, the final result reflects the original concept.
- Codehal. (2022). Responsive Website Design Tutorial [Video]. YouTube. https://www.youtube.com/watch?v=ajtLKcOF7RM&list=PLSJxovi1IyDH-pPIe0OF0z_mW-WVdhmhx&index=8
- CapCut. (n.d.). Video Editing App. https://www.capcut.com/
- Stemz. (n.d.). Music Source Separator App. https://www.stemz.app/