User:Youjung/SI28: On Writing Machines - Revision history

Youjung: /* SI28: Web Development Team */

2026-03-21T17:29:49Z

SI28: Web Development Team

← Older revision		Revision as of 19:29, 21 March 2026
Line 204:		Line 204:
	'''Challenge1: Making an interactive diagram'''		'''Challenge1: Making an interactive diagram'''

	The main challenge was to create graphics on the poster into interactive SVG components instead of images. First, I tried to draw each line and arrow shape finding the X,Y coordinates. It took me 2 hours to draw some lines. There must be a better way! After some frantic googling, I found a Javascript library called LeaderLine which automatically connects html class with customizable leader lines. And it was very intuitive and simple to use. With that, I could easily make the graphics into interactive SVG files.		The main challenge was to create graphics on the poster into interactive SVG components instead of images. First, I tried to draw each line and arrow shape finding the X,Y coordinates. It took me 2 hours to draw some lines. There must be a better way! After some frantic googling, I found a Javascript library called [https://anseki.github.io/leader-line/ LeaderLine] which automatically connects html class with customizable leader lines. And it was very intuitive and simple to use. With that, I could easily make the graphics into interactive SVG files.

	Now I have to		Now I have to

Youjung: /* SI28: Web Development Team */

2026-03-18T13:54:52Z

SI28: Web Development Team

← Older revision		Revision as of 15:54, 18 March 2026
Line 200:		Line 200:
	* [https://pad.xpub.nl/p/WebDevMeeting9-10 Web dev team pad]		* [https://pad.xpub.nl/p/WebDevMeeting9-10 Web dev team pad]
	* Worked on the main page of the website		* Worked on the main page of the website
			* [https://hub.xpub.nl/sergio/SI28/ A_Mazing Machine_s]

	'''Challenge1: Making an interactive diagram'''		'''Challenge1: Making an interactive diagram'''

Youjung at 21:03, 15 January 2026

2026-01-15T21:03:17Z

← Older revision		Revision as of 23:03, 15 January 2026
Line 228:		Line 228:
	* Divided team, scattered documentation Our classmates were super organized. Instantly we divided into teams and worked on separate tasks. It is indeed an efficient way to get things done but also it's a very linear and corporate way of team work. It was difficult to grasp what each team were doing also the document and informations were scattered all over Zulip, signal and wiki. I wonder what would be an alternative way of team building. Transparency of documentation and process of each team would be necessary.		* Divided team, scattered documentation Our classmates were super organized. Instantly we divided into teams and worked on separate tasks. It is indeed an efficient way to get things done but also it's a very linear and corporate way of team work. It was difficult to grasp what each team were doing also the document and informations were scattered all over Zulip, signal and wiki. I wonder what would be an alternative way of team building. Transparency of documentation and process of each team would be necessary.
	* Endless group discussion Group discussion is fun but at the same time it is quite energy consuming. Each person have different opinions and it's difficult to find a consensus where everyone is happy. The process of choosing the title for SI28 would be a good example. Is following the majority always the right way? It's difficult. At one point I was tired of discussion and compromised. But later I wasn't happy with the process and regretted that I did not speak up. Next time I shall address immediately.		* Endless group discussion Group discussion is fun but at the same time it is quite energy consuming. Each person have different opinions and it's difficult to find a consensus where everyone is happy. The process of choosing the title for SI28 would be a good example. Is following the majority always the right way? It's difficult. At one point I was tired of discussion and compromised. But later I wasn't happy with the process and regretted that I did not speak up. Next time I shall address immediately.
	* Imbalance of knowledge and workload The person with more technological/technical knowledge would determine the process and handle majority of the job. And this brings imbalance and excludes some people during the working process. This was observed not only in the web dev team but also during the zine making process. I believe people are here to learn new language, and interested in demystifying technology. But we weren't able to share our knowledge due to the limit of time. Also, although we made an effort to make a clear documentation of the process, some people were overwhelmed to read through them. To improve this, allocating time to explain this process step by step would be necessary. ~~그래픽 디자이너 업무 개 많음.~~.~~. 이거 어떻게 개선할 수 있을까?~~		* Imbalance of knowledge and workload The person with more technological/technical knowledge would determine the process and handle majority of the job. And this brings imbalance and excludes some people during the working process. This was observed not only in the web dev team but also during the zine making process. I believe people are here to learn new language, and interested in demystifying technology. But we weren't able to share our knowledge due to the limit of time. Also, although we made an effort to make a clear documentation of the process, some people were overwhelmed to read through them. To improve this, allocating time to explain this process step by step would be necessary. Graphic designer has a lot of work to do, but it is difficult to divide that labor as the graphic design needs to be coherent.
	* Coherency vs Anarchy Having "Machines" in every title, unifying the layout of each page... ~~너무 모든 것을~~ polished~~, 정리되고 coherent하게 만들어야 하는지도 의문, 각자 프로젝트와 접근 방법이 다른데, 통일하려는 시도가 맞는 접근 방법인지 잘 모르겠음~~. ~~다양성을 존중한다면 어느 정도로 존중되어야 할지 의문~~. ~~어떻게 balance를 찾을 수 있을까?~~		* Coherency vs Anarchy Having "Machines" in every title, unifying the layout of each page... I think not everything has to be polished and coherent. We should embrace that we are unlearning things. How can we balance having a united thought but at the same time respecting diverse opinion and thoughts. It is difficult to bring thoughts together.
	</div>		</div>


	[[Category: SI28/Blog]]		[[Category: SI28/Blog]]

Youjung: /* Amazine Making */

2025-12-11T17:47:21Z

Amazine Making

← Older revision		Revision as of 19:47, 11 December 2025
Line 178:		Line 178:
	[[SI28/Publication#Workflow\|Publication Workflow]]		[[SI28/Publication#Workflow\|Publication Workflow]]

	I worked on the Master CSS layout. Barbara documented the guideline. Tommi helped with revising the code and proof reading. Lea worked on compiling all the pdfs bringing the content coherent. Kiki and Robin worked on the cover design and binding. And also with the help of others ... We are such a dream team ~~and~~ I ~~am not alone~~. ~~I have always been stressed of teamwork~~. ~~Mostly due~~ to ~~conflict~~. ~~By the end of~~ the ~~semester, I can see this fear is slowly dissolving~~.		I worked on the Master CSS layout. Barbara documented the guideline. Tommi helped with revising the code and proof reading. Lea worked on compiling all the pdfs bringing the content coherent. Kiki and Robin worked on the cover design and binding. And also with the help of others ... We are such a dream team. I can't believe we made this publication in just 2 weeks. But time is definitely limiting. Next time we need to plan this in advance along with the public event. It was a challenging teamwork but we somehow made it happen. I wonder how we will organize the while special issue next year.
	<div style="display: flex;">		<div style="display: flex;">
	[[File:Tommi and yj.jpg\|alt=watching Tommi edit my messy code\|center\|thumb\|watching Tommi edit my messy code]]		[[File:Tommi and yj.jpg\|alt=watching Tommi edit my messy code\|center\|thumb\|watching Tommi edit my messy code]]
Line 220:		Line 220:

	== Reflection on Teamwork ==		== Reflection on Teamwork ==
			10th of December, last day!

	* ~~팀별로 나누는 것이 효과적인가, 서로 무슨 일을 하고 있는지 확인하기가 어려웠음~~. ~~문서의 파편화. 하나의 문서에 무슨 일이 일어나고 있는지 확인할 수 없을까? (구글 스프레드시트가 적절하다고 생각하는데...)~~		* [https://pad.xpub.nl/p/20251210-xpub1-si28-debrief SI28 debrief pad]
	* 결국 한 사람이 모든 것을 책임지고 해결하는 경우.. 특히 그래픽 디자인의 경우 한 사람이 총대 메고 모든 작업을 함.
	* 웹 디자인 팀, 웹 개발 지식의 차이가 불러온 불평등(?) 한 사람이 sprint하고 다른 사람들이 그걸 따라가기 힘들어 했음. 그래서 초반에 git conflict, liquid 사용법, scss 사용법 모르는 것이 많았는데, 이게 sync가 잘 안맞았음.
	* 여러 가지 접근법, 대화, 수업 방식에 대한 논의를 나눴지만, 결국 일을 할 때는 linear한 방법으로 goal을 정하고 달려갔음. 팀을 모두 이렇게 나누는 것이 맞는가 해답 잘 모르겠지만... 새로운 방법의 팀워크가 있지 않을까 싶음
	* 너무 모든 것을 polished, 정리되고 coherent하게 만들어야 하는지도 의문, 특히 타이틀에 machine이 들어가야한다는 점... 각자 프로젝트와 접근 방법이 다른데, 통일하려는 시도가 맞는 접근 방법인지 잘 모르겠음.
	* 타이틀 정하는거 너무 어려웠음. 14명이 동의할 수 있는 타이틀... 다수결이 항상 옳은가에 대한 생각. 어렵다.
	* 그래도 major 갈등은 없었던 것 같음.

			'''Personal Reflections'''

			* Divided team, scattered documentation Our classmates were super organized. Instantly we divided into teams and worked on separate tasks. It is indeed an efficient way to get things done but also it's a very linear and corporate way of team work. It was difficult to grasp what each team were doing also the document and informations were scattered all over Zulip, signal and wiki. I wonder what would be an alternative way of team building. Transparency of documentation and process of each team would be necessary.
			* Endless group discussion Group discussion is fun but at the same time it is quite energy consuming. Each person have different opinions and it's difficult to find a consensus where everyone is happy. The process of choosing the title for SI28 would be a good example. Is following the majority always the right way? It's difficult. At one point I was tired of discussion and compromised. But later I wasn't happy with the process and regretted that I did not speak up. Next time I shall address immediately.
			* Imbalance of knowledge and workload The person with more technological/technical knowledge would determine the process and handle majority of the job. And this brings imbalance and excludes some people during the working process. This was observed not only in the web dev team but also during the zine making process. I believe people are here to learn new language, and interested in demystifying technology. But we weren't able to share our knowledge due to the limit of time. Also, although we made an effort to make a clear documentation of the process, some people were overwhelmed to read through them. To improve this, allocating time to explain this process step by step would be necessary. 그래픽 디자이너 업무 개 많음... 이거 어떻게 개선할 수 있을까?
			* Coherency vs Anarchy Having "Machines" in every title, unifying the layout of each page... 너무 모든 것을 polished, 정리되고 coherent하게 만들어야 하는지도 의문, 각자 프로젝트와 접근 방법이 다른데, 통일하려는 시도가 맞는 접근 방법인지 잘 모르겠음. 다양성을 존중한다면 어느 정도로 존중되어야 할지 의문. 어떻게 balance를 찾을 수 있을까?
	</div>		</div>


	[[Category: SI28/Blog]]		[[Category: SI28/Blog]]

Youjung: /* Amazine Making */

2025-12-11T17:12:38Z

Amazine Making

← Older revision		Revision as of 19:12, 11 December 2025
Line 181:		Line 181:
	<div style="display: flex;">		<div style="display: flex;">
	[[File:Tommi and yj.jpg\|alt=watching Tommi edit my messy code\|center\|thumb\|watching Tommi edit my messy code]]		[[File:Tommi and yj.jpg\|alt=watching Tommi edit my messy code\|center\|thumb\|watching Tommi edit my messy code]]
			[[File:Binding in progress.jpg\|alt=binding in progress\|thumb\|binding in progress]]
	[[File:FE2E29ED-7574-43EB-8058-6586812AE0E1 1 102 o.jpg\|alt=special issue 28!\|thumb\|special issue 28!]]		[[File:FE2E29ED-7574-43EB-8058-6586812AE0E1 1 102 o.jpg\|alt=special issue 28!\|thumb\|special issue 28!]]
	~~[[File:Binding in progress.jpg\|alt=binding in progress\|thumb\|binding in progress]]~~
	</div>		</div>

	= Preparation Team Work for SI 28 =		= Preparation Team Work for SI 28 =
	==SI28: Design Team==		==SI28: Design Team==

Youjung: /* Amazine Making */

2025-12-11T17:12:18Z

Amazine Making

← Older revision		Revision as of 19:12, 11 December 2025
Line 178:		Line 178:
	[[SI28/Publication#Workflow\|Publication Workflow]]		[[SI28/Publication#Workflow\|Publication Workflow]]

	I worked on the Master CSS layout. Barbara documented the guideline. Tommi helped with revising the code and proof reading. Lea worked on compiling all the pdfs bringing the content coherent. Kiki and Robin worked on the cover design and binding. And also with the help of others ... We are such a dream team and I am not alone. I have always been stressed of teamwork. Mostly due to conflict. By the end of the semester, I can see this fear is slowly dissolving.[[File:Tommi and yj.jpg\|alt=watching Tommi edit my messy code\|center\|thumb\|watching Tommi edit my messy code]]		I worked on the Master CSS layout. Barbara documented the guideline. Tommi helped with revising the code and proof reading. Lea worked on compiling all the pdfs bringing the content coherent. Kiki and Robin worked on the cover design and binding. And also with the help of others ... We are such a dream team and I am not alone. I have always been stressed of teamwork. Mostly due to conflict. By the end of the semester, I can see this fear is slowly dissolving.
			<div style="display: flex;">
			[[File:Tommi and yj.jpg\|alt=watching Tommi edit my messy code\|center\|thumb\|watching Tommi edit my messy code]]
			[[File:FE2E29ED-7574-43EB-8058-6586812AE0E1 1 102 o.jpg\|alt=special issue 28!\|thumb\|special issue 28!]]
			[[File:Binding in progress.jpg\|alt=binding in progress\|thumb\|binding in progress]]
			</div>
	= Preparation Team Work for SI 28 =		= Preparation Team Work for SI 28 =
	==SI28: Design Team==		==SI28: Design Team==

Youjung: /* Amazine Making */

2025-12-08T22:19:00Z

Amazine Making

← Older revision		Revision as of 00:19, 9 December 2025
Line 178:		Line 178:
	[[SI28/Publication#Workflow\|Publication Workflow]]		[[SI28/Publication#Workflow\|Publication Workflow]]

	I worked on the Master CSS layout. Barbara documented the guideline. Tommi helped with revising the code and proof reading. Lea worked on compiling all the ~~content~~ bringing ~~all~~ the content coherent. Kiki and Robin worked on the cover design and binding. And also with the help of others ... We are such a dream team and I am not alone. I have always been stressed of teamwork. Mostly due to conflict. By the end of the semester, I can see this fear is slowly dissolving.[[File:Tommi and yj.jpg\|alt=watching Tommi edit my messy code\|center\|thumb\|watching Tommi edit my messy code]]		I worked on the Master CSS layout. Barbara documented the guideline. Tommi helped with revising the code and proof reading. Lea worked on compiling all the pdfs bringing the content coherent. Kiki and Robin worked on the cover design and binding. And also with the help of others ... We are such a dream team and I am not alone. I have always been stressed of teamwork. Mostly due to conflict. By the end of the semester, I can see this fear is slowly dissolving.[[File:Tommi and yj.jpg\|alt=watching Tommi edit my messy code\|center\|thumb\|watching Tommi edit my messy code]]

	= Preparation Team Work for SI 28 =		= Preparation Team Work for SI 28 =

Youjung: /* Live event at WORM UBIK */

2025-12-08T22:18:12Z

Live event at WORM UBIK

← Older revision		Revision as of 00:18, 9 December 2025
Line 168:		Line 168:
	On 15:30, people started arriving at the event. Barbara's sister was our first guest. I sat next to her and watched her play the game, all three of us were anxious to see our first player interact with the game. She said it is mesmerizing to see the pen plotter draw complex items. During the event we've received positive feedbacks. From what I've observed, players reacted the most when they collected the first item. Sending signal to the machine and seeing it draw. Anticipating to see the result of the machine movement. Though we could spot popular routes. It was fun to explain to people the background of this project and how it works. And observe how players interact.		On 15:30, people started arriving at the event. Barbara's sister was our first guest. I sat next to her and watched her play the game, all three of us were anxious to see our first player interact with the game. She said it is mesmerizing to see the pen plotter draw complex items. During the event we've received positive feedbacks. From what I've observed, players reacted the most when they collected the first item. Sending signal to the machine and seeing it draw. Anticipating to see the result of the machine movement. Though we could spot popular routes. It was fun to explain to people the background of this project and how it works. And observe how players interact.

	Beginning of the semester Steve asked me what kind of art I liked. I couldn't come up with an answer and tears welled up. I didn't know what I liked and here I am far away from home. I managed to tell him that I liked something interactive and playful. And this project seems to be close to ~~what~~ that. <div style="display: flex; flex-direction: row;">		Beginning of the semester Steve asked me what kind of art I liked. I couldn't come up with an answer and tears welled up. I didn't know what I liked and here I am far away from home. I managed to tell him that I liked something interactive and playful. And this project seems to be close to that. <div style="display: flex; flex-direction: row;">
	[[File:B6589DBA-E4D5-4388-AB22-18082E07FFA9_1_105_c.jpg\|alt=Interface of A story in a story in a story\|thumb\|479x479px\|Interface of A story in a story in a story]]		[[File:B6589DBA-E4D5-4388-AB22-18082E07FFA9_1_105_c.jpg\|alt=Interface of A story in a story in a story\|thumb\|479x479px\|Interface of A story in a story in a story]]
	[[File:4738332B-EF12-4BBE-BA34-54B015D1F58D_4_5005_c.jpg\|alt=Plotting!\|thumb\|479x479px\|Plotting in progress]]		[[File:4738332B-EF12-4BBE-BA34-54B015D1F58D_4_5005_c.jpg\|alt=Plotting!\|thumb\|479x479px\|Plotting in progress]]

Youjung: /* Live event at WORM UBIK */

2025-12-08T22:14:57Z

Live event at WORM UBIK

← Older revision		Revision as of 00:14, 9 December 2025
Line 166:		Line 166:
	We set up the event from 10am. Thanks to worm the preparation was smooth. We brought a monitor, keyboard, pen plotter and some cables from our studio. Decorated our area with plotted results of the play test. During the setting up process, I was quite stressed and nervous. With Barbara and Kiki we fine tuned the terminal message and the set up of our desk. Before opening of the event, Marco did a final play test of our game. Marco seemed to be quite fascinated!		We set up the event from 10am. Thanks to worm the preparation was smooth. We brought a monitor, keyboard, pen plotter and some cables from our studio. Decorated our area with plotted results of the play test. During the setting up process, I was quite stressed and nervous. With Barbara and Kiki we fine tuned the terminal message and the set up of our desk. Before opening of the event, Marco did a final play test of our game. Marco seemed to be quite fascinated!

	On 15:30, people started arriving at the event. Barbara's sister was our first guest. I sat next to her and watched her play the game, all three of us were anxious to see our first player interact with the game. She said it is mesmerizing to see the pen plotter draw complex items. During the event we've received positive feedbacks. From what I've observed, players reacted the most when they collected the first item. Sending signal to the machine and seeing it draw. Anticipating to see the result of the machine movement. ~~Also~~ the ~~sentence indicating your current location, "" was quite effective~~ and ~~cute~~.		On 15:30, people started arriving at the event. Barbara's sister was our first guest. I sat next to her and watched her play the game, all three of us were anxious to see our first player interact with the game. She said it is mesmerizing to see the pen plotter draw complex items. During the event we've received positive feedbacks. From what I've observed, players reacted the most when they collected the first item. Sending signal to the machine and seeing it draw. Anticipating to see the result of the machine movement. Though we could spot popular routes. It was fun to explain to people the background of this project and how it works. And observe how players interact.

	~~Some students from HKU fine~~ art ~~were interested in XPUB~~. ~~They asked if coding skills were required to follow the class~~. I ~~personally don~~'t ~~think it's necessary but definitely advantageous~~ to ~~have some~~.		Beginning of the semester Steve asked me what kind of art I liked. I couldn't come up with an answer and tears welled up. I didn't know what I liked and here I am far away from home. I managed to tell him that I liked something interactive and playful. And this project seems to be close to what that. <div style="display: flex; flex-direction: row;">
	<div style="display: flex; flex-direction: row;">
	[[File:B6589DBA-E4D5-4388-AB22-18082E07FFA9_1_105_c.jpg\|alt=Interface of A story in a story in a story\|thumb\|479x479px\|Interface of A story in a story in a story]]		[[File:B6589DBA-E4D5-4388-AB22-18082E07FFA9_1_105_c.jpg\|alt=Interface of A story in a story in a story\|thumb\|479x479px\|Interface of A story in a story in a story]]
	[[File:4738332B-EF12-4BBE-BA34-54B015D1F58D_4_5005_c.jpg\|alt=Plotting!\|thumb\|479x479px\|Plotting in progress]]		[[File:4738332B-EF12-4BBE-BA34-54B015D1F58D_4_5005_c.jpg\|alt=Plotting!\|thumb\|479x479px\|Plotting in progress]]
	</div>		</div>

			== Amazine Making ==
			8th of December

			[[SI28/Publication#Workflow\|Publication Workflow]]

			I worked on the Master CSS layout. Barbara documented the guideline. Tommi helped with revising the code and proof reading. Lea worked on compiling all the content bringing all the content coherent. Kiki and Robin worked on the cover design and binding. And also with the help of others ... We are such a dream team and I am not alone. I have always been stressed of teamwork. Mostly due to conflict. By the end of the semester, I can see this fear is slowly dissolving.[[File:Tommi and yj.jpg\|alt=watching Tommi edit my messy code\|center\|thumb\|watching Tommi edit my messy code]]

	= Preparation Team Work for SI 28 =		= Preparation Team Work for SI 28 =
Line 206:		Line 212:
	* work on responsive size for the mobile page > update leader line size and coordinate according to the window size break point		* work on responsive size for the mobile page > update leader line size and coordinate according to the window size break point
	* fix errors with leader line		* fix errors with leader line
			I'm still working on the website...

	== Reflection on Teamwork ==		== Reflection on Teamwork ==

Tommi: Remove from Category SI28 and add to Category SI28/Blog

2025-11-30T19:48:53Z

Remove from Category SI28 and add to Category SI28/Blog

← Older revision		Revision as of 21:48, 30 November 2025
Line 183:		Line 183:
	[[File:Graphviz test.png\|alt=Draft for poster using graphviz\|thumb\|251023 Draft for poster using graphviz]]		[[File:Graphviz test.png\|alt=Draft for poster using graphviz\|thumb\|251023 Draft for poster using graphviz]]
	</div>		</div>
	~~[[Category: SI28]]~~

	==SI28: Web Development Team==		==SI28: Web Development Team==