10 Time to
Move On
This week shifted focus from development to communication. I completed the second prototype of the Button Parameter Lab, integrating the Neumorphism design and new functions as well as fixing key export bugs. The major challenge was the need to create an effective "invitation" to the research. This led to a creating interactive, code-based sketches that accurately demonstrate the systematic parameter control at the core of my research.
Week-ten
20 ~ 26, Oct, 2025Journal-by
Choi YerinKeywords
- Brand-Identity-Prism
- Invitation
- New-Methodology
- Programming-Interaction
Tool Development
Button Parameter Lab Prototype 2
> Screen Record of Prototype 2 Demo
I continued integrating the visual design from Week 8 into the tool's backend, resulting in a cleaner, more functional 2nd Prototype. Even though the fundamental functionality was similar to the first prototype, the tool now looked more interesting due to the added aesthetic. Crucially, I fixed several bugs related to the code export feature and added some visual customization functions.
This fix was important vital, because the tool's core objective is to provide practical methods and tools for practitioners. If the resulting code is buggy, the entire premise of offering a systematic and production-ready solution is compromised.
Consultations
Invite Audience
The core pressure this week came from Andreas's feedback on audience engagement: "People don't read but they rather see."
I realized that designing a functional tool is only half the task. If the sophisticated methodology of how precise parameters create a specific atmosphere is not quickly translated into a compelling, visceral experience (Norman), the research will struggle to gain traction.
This forced a crucial examination of my communication strategy of how I could invite designers to explore this research project. And my initial attempt to create promotional videos using After Effects (AE)
> Initial Video Creation with After Effects
Actually it was fun to use after effects, but as I was not familier to the tool, I had to watch tutorials and learn while creating. Also, I had to create a lot of things, because I still did not create much tools to support the goal of my video. This was actually a significant time sink, pulling energy away from the core computational experiments.
Time to Move On
I spoke with Andreas about this struggle, and he showed me a project "Programming Posters" (Tim) . This project used code to create dynamic, controllable visual communication, and the concept of controlling parameters to design the poster was the major turning point.
Even though I did spend some time on this, I think sometimes it is important to realize and move on quickly. Being inspired by the programming posters project, which used code to create controllable visual communication, this confirmed me the necessity of shifting back to p5.js, but with a refined purpose:
My p5.js sketches must function as analytical tools. The goal is not only to recreate interactions, but also to use the code environment to isolate and manipulate specific variables—timing, easing, scale—to systematically observe their effect on brand perception
Systematic Analysis
Brand Identity Prism
Alongside the technical work, I dedicated some time to formalizing my case study methodology, so that I could have a better analysis in computational recreation process later as well. Following the framework I established in my RPO and planned in week 7, I mapped out the Brand Identity Prism (Kapferer) for key brands: Apple, Duolingo, LinkedIn, and Instagram.
This detailed analysis helps me move beyond subjective intuition, providing a systematic structure to understand:
How each brand's Physique (visuals) aligns with its Personality (character).
-
How the unique interaction patterns I observed (e.g., Duolingo's bounce, Apple's slide-to-action) reflect their Culture and Relationship facet.
By mapping these facets, I ensured that my experimental parameter choices are grounded in verifiable brand strategies, reinforcing the research's critical depth.
Next Steps
With the second prototype for button parameter and Brand Prism mapping complete, the next logical step is computational recreation. I need to reverse-engineer the observed branded interactions in p5.js to gain precise control over their underlying parameters. This will directly feed into the tool's presets and validation phase.