CATALOG OF MAKING WEB

The website went through several iterations, with some technical troubleshooting supported by Claude AI. The goal was to align the design language with the web-based tools developed for the artifacts. While the initial version borrowed elements from the Semester 1 catalog, I eventually refined it to adopt a more terminal-inspired aesthetic. This shift also sparked the idea of adding a 'loading' screen for the landing page, which I plan to develop after finalizing the template for the Semester 2 catalog of making. Once that’s complete, the next step will be to insert the relevant images and videos.

MAKING IT LOOK MORE TERMINAL-ISH

Building on the scanner effect used in the Visual Normalcy Scanner, I decided to reuse and expand on it by incorporating additional design elements to enhance the terminal-like aesthetic. The progress bar was repositioned to the bottom, resembling a sci-fi interface. Once the bar reaches a certain percentage, a background video connected to the prototype description is triggered. The page itself remains static, utilizing a horizontal scrolling effect to guide users through the experience.

On top of that, the button to access the works in detail was not implemented, hence another page template is required for people to access a more detailed explaination on each of the artifact. With all those buttons implemented, it was then the page containing the descriptions and explainations. To make it simple, I just had it as a vertical scrolling page with usual button to access the next and previous works, keeping the layout consistent as well.

The remaining was to add in the recorded videos and image documentations taken from the photography set-up in school.


RESHOOT OF VIDEO

With the updated packaging for the AIDENTIFY Kit, it became necessary to revise the recorded video that previously featured the outdated design. Re-capturing the footage using the same visual framing and narrative approach ensured continuity in presentation. This decision not only reinforces the importance of maintaining design consistency across all mediums, but also acknowledges how visual coherence plays a crucial role in how the artifact is perceived and understood by its audience—particularly in speculative design projects where form strongly supports conceptual intent.

During the Open Studios, I initially chose not to produce a video for the AIBOX, assuming its narrative and functionality were self-explanatory. However, upon reflection, I recognized the inconsistency this created in the overall presentation of the project. In a speculative design context, each prototype functions not only as a standalone object but as part of a larger narrative ecosystem. Introducing a video for the AIBOX—similar to the other prototypes—helps reinforce that cohesion while also anchoring the artifact within a specific speculative scenario. This enhances the audience’s ability to contextualize its use and implications in a near-future setting, where issues like deepfake audio or voice fraud may become increasingly prevalent.

Following the same approach used in the previous two videos, I incorporated AI-generated footage at the beginning, creating a visual bridge between reality and speculation. The video then transitions into a near-future scenario, illustrating the everyday use of Zoom calls and the heightened vulnerability to audio-based scams due to AI voice generation technologies. The AIBOX is introduced as a speculative tool to encourage users to practice critical skepticism—offering a preliminary check against potential AI-generated audio.

While the AIBOX is not positioned as a definitive solution, the narrative stresses the importance of layered verification methods (such as secondary confirmations or physical validation) rather than blind trust. This critical framing highlights how speculative tools can foster behavioral resilience in a future where distinguishing between real and synthetic communications will require more than technological fixes—it will demand a fundamental shift in user habits and vigilance.


COMPILATION FOR CATALOG OF MAKING WEB

With the documentation complete through both photos and videos, the final stage focused on refining the website experience. A floating description box was added, which dynamically follows the user’s cursor to create a subtle 3D interaction effect—enhancing engagement and adding depth to the user interface. Additionally, the horizontal scrolling behavior was fine-tuned so that as users progress through the page, videos transition seamlessly in alignment with the progress bar.


MOVING FORWARD

In preparation for the upcoming Viva Voce, the exhibition space requires careful curation once again, especially with the additional space allocated to us. I plan to reuse the display frame constructed for the Open Studios, maintaining continuity in the visual presentation. Most of the printed materials from the previous showcase will also be retained to preserve a consistent narrative thread across exhibitions. However, this decision also reflects a critical consideration: rather than constantly producing new materials, the focus is placed on refining the storytelling and interaction around the prototypes, ensuring that the attention remains on the evolving ideas and critical discussions sparked by the work, rather than just on surface-level changes in presentation.