Tumgik
needcaffeine2 · 6 years
Text
테슬라는 왜 보닛을 트렁크(frunk)로 만들었을까?    -  부제: 전기 자동차가 기존 자동차의 형태를 따르는 이유
Tumblr media
출처 : https://www.teslarati.com/tesla-tsla-shares-up-premarket-new-model-3-production-goals-leak/
이번달 초, 한 주만에 5000대의 모델3를 생산하는데에 성공한 테슬라의 CEO 일론 머스크는 직원들에게 이렇게 말합니다.
“이제 우리가 ‘진짜’ 자동차 회사가 되었군요.”(I think we just became a real car company…)
고가의 모델 S로 출발해 SUV인 모델 X에 이어서, 보급형 모델인 모델3까지 도로를 밟게 됨에 따라, 말도 많고 탈도 많았던 테슬라의 제품 라인업이 점차 완성되어가는 듯 보입니다. 테슬라가 이렇게 주목을 끌 수 있었던 이유는 사실 일론 머스크가 스타 CEO이기 때문이 아니라, 최초로 사람들에게 제대로 된 ‘전기차’의 비전을 내보인 회사이기 때문입니다. 테슬라로 인해 기존 완성차 업체들의 전기차에 대한 투자가 앞당겨졌으며, 앞으로 자동차의 동력원은 점차 전기로 넘어가게 될 것입니다. 이렇게 아이코닉한 전기차로 자리매김한 테슬라의 모든 모델에는 몇 가지 공통점이 있는데, 그 중 하나가 기존 보닛 자리에 있는 트렁크, 이름하여 frunk입니다.
Tumblr media
출처 : http://hooniverse.com/?p=131295
Tumblr media
출처: https://dpsi7pmz5b6vt.cloudfront.net/uploads/ckeditor/picture/411/content_9-fact-Tesla-hood.jpg
보닛(후드)아래에 엔진이 들어있지 않기 때문에 생기는 빈 공간을 트렁크처럼 활용하게 되는데, 이 공간이 기존 자동차에서는 존재하지 않던 수납공간이다보니 테슬라만의 특징이 되면서 frunk(front+trunk)라는 고유한 이름을 갖게 된 것입니다. 그런데 이 공간을 보면 의문이 생기지 않나요? 저 공간을 비워둘거면 왜 굳이 공간을 차지하도록 두었을까, 라고 말입니다. 베란다를 터서 거실로 쓰듯, 앞쪽 공간을 틔워서 새로운 공간으로 활용할 수는 없었을까요? 아니, 애초에 전기 자동차가 기존 자동차와 같은 형태여야 할 이유가 있었을까요?
흔히 미래의 자동차를 떠올리면, 수많은 SF영화들에 등장하는 미래적인 디자인을 먼저 생각하게 됩니다.
Blade Runner 2049 Concept Art, Police car
Tumblr media
출처 : https://www.artstation.com/artwork/xRXKR
하지만 현실에서 미래의 자동차로 불리우는 전기 자동차들은 디테일한 부분을 빼고는 기존의 자동차와 확연히 다른 부분을 찾기 힘듭니다. 아래의 소울을 그 예시로 볼 수 있는데, 전기차임을 알기 쉽게 하는 막혀있는 그릴과 프론트의 그래픽 요소들을 제외하고 많은 부분 기존의 소울의 형태를 그대로 가져왔음을 알 수 있습니다. 라디에이터 그릴이 막혀있는 이유는 발생하는 열의 차이로 인해 공기를 유입해 냉각수와 엔진의 열을 감소시켜주는 역할을 할 필요가 없기 때문이기도 하고, 공기저항을 줄여 연비를 높이기 위함이기도 합니다.
Tumblr media
출처 : https://www.worldwideautomobile.com/wp-content/uploads/2018/03/c5db1eec-9f4f-4d2e-a761-717690a63dfd.jpg
Tumblr media
출처 : https://images.hgmsites.net/lrg/2018-kia-soul-auto-angular-front-exterior-view_100631301_l.jpg
이외에도 르노의 Zoe와 Clio등 많은 완성차 업체에서 기존의 자동차 모듈과 형태, 디자인을 그대로 가져와서 전기차‘화’한다는 것을 알 수 있습니다. 어느날 갑자기 짜잔 하고 기존의 자동차와는 선을 긋는 듯한 fancy한 미래의 자동차가 등장하길 바랐던 필자로서는 허무한 현상이 아닐 수 없는데요. 이제 본격적으로 전기차의 생김새가 기존의 자동차와 다르지 않은 이유를 알아보기 위해 전기차와 기존 자동차의 차이를 잠시 알아보겠습니다.
youtube
출처 : youtube Electric cars vs Petrol cars, by Learn Engineering
전기차는 기존의 자동차와 기술적으로 여러가지 차이점이 존재하지만, 디자인에 커다란 영향을 미치는 두 가지를 꼽자면 바로 동력원에 필요한 엔진룸의 부재와, 차축의 부재로 인해 실내와 엔진부를 구분하는 센터페시아 등의 불필요한 구조가 필요 없어진다는 점입니다.
Tumblr media
출처 : youtube Electric cars vs Petrol cars, by Learn Engineering
그렇다면,  이런 구조적인 개혁이 가능한 전기차에서 왜 디자인적인 혁신은 일어나지 않은 것일까요? 다음 포스팅에 이어서 그 이유를 하나 하나 살펴보도록 하겠습니다.
관련 기사 : https://theconversation.com/why-dont-electric-cars-look-like-the-future-89388
1 note · View note
needcaffeine2 · 6 years
Text
Final Project_report_의미(최종 영상 포함)
*본 글의 실질적인 예상 독자는 2019년 이후의 인터렉티브 미디어 수강생이지겠지만, 저는 제 자신 및 인터렉티브 아트를 하고자 하는 누군가를 대상으로 본 글을 작성한 것 같습니다. 감안하고 읽어주시고, 아주 주관적이고 독단적인, 그리고 많은 부분 개인적인 생각임을 미리 밝힙니다. 수업과 관련 없는 내용이 많고, 사족이 길어 필요하신 부분만 읽으셔도 좋습니다.
**과정 포스트
https://needcaffeine2.tumblr.com/post/175205162990/final-projectreport%EA%B3%BC%EC%A0%95
0. ’인터랙션’에 대하여
나는 언제나 ‘작동하는 것’에 본능적인 관심을 느꼈다. 살아 움직이는 듯한 느낌이 멋져서, 내 손으로 무언가를 작동시킨다는 것이 의미있어서 같은 거창한 이유가 있는게 아니라, 그냥 무언가 움직이고, 작동하고, 어떤 가시적인 현상이 일어나는 것이 그렇지 않은 평면과 입체조형보다 훨씬 좋았다. 멋진 이유가 따로 없다. 그냥 좋아서.(*1) 그래서 나는 새로운 학교에서 다시 한번 들어야 했던 1학년 파운데이션 코스의 모든 수업에서 인터랙션을 넣어버렸다. 또 우연히 참여하게된 학교 전시로 2016년, 학점과 인성과 건강을 포기하고 내 키보다 훨씬 큰 무언가를 만들었을 때에도 나는 별 생각이 없었다.
그렇게 그냥 좋아서, 로 대충 넘어갈 수 있었던 파운데이션 수업들을 지나고 순수예술 수업을 듣지 않게 되자, 인터랙션은 잘 계산되어 ‘사용자의 니즈를 만족시킬 수 있는’ 것 이상도, 이하도 아닌 것이 되어버렸다. 그게 싫다는 뜻은 아니지만, 어딘가 부족했다. 돌이켜 생각해보면 이을 수 없는 것은 없겠지만, 그 때문이었을까 매 년 학점에 전혀 도움이 되지 않는 전시 기획서를 열심히 써서 냈고 그 때마다 인터랙션이 들어간 작품을 하겠다고 거창한 계획을 늘어놓았다.
Tumblr media Tumblr media Tumblr media Tumblr media
하나하나 들여다보면 의미는 오묘하게 겉핥기 식으로 붙어있을 뿐, 계획의 핵심에는 언제나 한결같이 모호한 느낌으로 이루어진 ‘재밌겠다’라는 생각 뿐이었다. 그래서 그렇게 만들어진 것들의 결과물은 다음과 같다. 의미부여를 잔뜩 한 제목을 생략하고 물리적인, 기술적인 구성 성분으로 지칭하였다.
2015 - 키넥트로 점 움직이기
의미 부여 -> 계획된 동선으로 움직이는 관람자의 움직임을 깨고 아주 작은 ‘빨간 점’ 하나로 관람자를 평소에 하지 않는 동작을 하도록 만들자.
2016 - 키넥트+아두이노로 가상의 무대 지휘
의미 부여 -> 손짓 하나로 거대한 무대를 지휘하는 마에스트로가 되어보자.
2016 - 아두이노+열전사 프린터로 임의의 글과 그림 출력
의미 부여 -> 컴퓨터와 사람이 쓴 시를 구분하지 못하게 된 지 거의 10년이 다되어가는 지금, 컴퓨터가 시를, 이야기를, 그림을 폭포처럼 쏟아낸다면 어떨까.
2016 - 키넥트+프로젝터로 지나가는 사람들의 빛 그림자 만들기
의미 부여 -> 아무 생각 없이 지나치는 이 길에 당신의 흔적은 남습니다. 보이지 않았을 뿐.
2017 – 아두이노+모터로 같은 모듈에서 각기 다른 속도와 방식의 움직임 구현하기
의미 부여 -> 비가 오면 기분 좋은 사람도, 나쁜 사람도 있듯이 우리 모두 물리적 환경에 따라 다른 정신적 반응을 보인다. 이를 오브제화 해보았다.
2017 - 비눗방울 기계 퍼포먼스 
의미부여 -> 자동화된 일상에 대한 폭죽을 터뜨리자. 말랑말랑, 반짝반짝. -> 지나치는 일상을 의미있게 만드는 아주 단순한 행위의 구현
2018 - 인터렉티브 미디어 수업에서 진행.
이렇게 뜯어보고나면, 의미는 아주 원초적인 것만 남았다. 이유가 궁금해 조금 더 생각해보기로 했다.
1.의미와 인터렉션의 관계. 둘은 서로에게 도움이 될까?
 인터랙션은 어렵지만, 의미부여는 쉽다. 반대로 생각하는 사람도 있겠지만 나는 언제나 의미부여를 평가절하해왔다. 그냥 언어이기 때문에.(*2) 인터렉션은 그렇지 않다. 작동해야하는 방법이 있고, 그것을 설계하기 위해서는 꾸준한 테스트와 검증이 필요하다. A를 B라고 해도 의미부여는 속이기 쉬운 반면-물론 프로페셔널 한 수준에서는 그렇지 않다는 것을 알지만-, 인터렉션에서는  A가 A가 아니면 절대 다른 것이 될 수 없다. 작업이 A일 때 B,C,D로 다양하게 해석되고 그 각각이 가지는 의미가 종합되어 AB,AC,AD라는 개인마다 각기 다른 작업이 탄생한다고 볼 때, 인터랙션은 자칫 ‘그딴거 필요 없고, AA야’라는 느낌을 줄 수 있다. 즉각적이고 때로는 유치하기까지 하기 때문에. 그렇다면 인터랙션이 의미의 범위나 깊이에 도움이 되는 부분이 있기는 할까? 과연 인터랙션이 포함된 작업은 그렇지 않은 작업과 어떻게 의미적으로 달라야 할까?
  아무것도 거치지 않은 감각과 경험이 주는 에너지는 살아있다. 나는 TV화면이나 누군가에게 전해 듣는 이야기, 책, 각종 매체를 통해 얻는 감각과 경험만 ‘지적이고 의미있는’ 것이라 여기는 분위기 속에서 한 사람이라도 손끝에서, 망막 표면으로부터 전해져오는 생생한 느낌에 매료되었으면 좋겠다고 생각한다. 누군가 가공했거나 여러 차례 걸러진 경험이 아니라 그 어떤 매개체도 없는 아주 직설적이고 직접적인 전달. 그 전달에서만 느껴지는 스파크같은게 있다고 믿는다. 쉽게 말해서 ‘실물이 더 낫다’라는 얘기다.그런 의미에서 인터랙션은 철저히 계획되었어도 오히려 정적인 매체보다 훨씬 불안정하고 생생한, 살아있는 매체이다. 내가 그 공간에서, 그 오브제를 만지고 바라볼 때 일어나는 사건이 살아있다고 느끼는 그 감정은, 삐딱하게 서서 커다란 그림을 ‘해석’하려는 자세보다 훨씬 깊숙하고 본능적인 자리에서 피어오른다. 그리고 나는 그 감정이 별다른 현란한 의미부여가 없이도 그 자체로서 존재의 의미를 가진다고 생각한다.
2. 마음 현상소의 의미와 한계: 그래서 그거 왜 한건데?
최종영상 클립
youtube
youtube
youtube
‘한다’ 보다 ‘왜’가 중요했던때에는 언제쯤 그냥 ‘할까’ 고민했다. 그렇게 ‘한다’만 생각한 몇 달이 지나고나니 아주 작은 왜 앞에서도 쉽게 무너져버렸다. 작업이 끝나고 나서 한동안 계속 “그래서 그게 뭔데? 왜 했는데?”라는 질문 앞에 너무나 무력한 자신을 발견했다. 그냥 인스타에 올리기 적당한 그런, 시류에 편승하는 포토존 아트일까? 그건 정말 싫다고 생각했는데. 그렇게 열심히 하고 안되면 죽을 것처럼 달려들었는데도 실마리조차 찾기 어려웠다. 그래서 어쩌면 0번에서의 구차한 기존 작업들의 나열이 필요했는지도 모른다. 이번 작업도 원래 했던 것들의 맥락에 얹혀가려는 찰나, 1번같은 생각을 처음으로 문장화 할 수 있었다. 원초적인 감각과 경험의 중요성. 그리고 인터랙션만이 줄 수 있는 감상자에 대한 직접적인 타격. 그 외에도 이번 작업은 크게 두 가지 특징을 가진다.
2-1. 작업 매체로 공간 전체를 사용한다는 것
처음 텅 빈 스튜디오 공간에서 여기를 어떻게 아늑하고, 신비롭게 만들까? 라는 질문을 던지기도 전에 3미터도 넘는 높이에서 천을 달면서 공간을 만들었다. 놀랍게도 어느정도 공간이 채워지고 나자 그냥 텅 빈 전시공간이 아니라 ‘아늑한 방'의 느낌이 그 공간에 맴도는 것을 느낄 수 있었다. 이 경험은 직접 만들어보지 않으면 알 수 없다. 공간을 구성한다는 것은 하나의 독립된 대상을 만드는 것 보다 훨씬 복잡하고 통제하기 어려운 작업이다. 체험자중 한 명이 “여기서 자고 일어나면 기분 좋을 것 같아"라고 했을 때, 그리고 수업도 듣지 않았던 교수님께 원래 의도가 이게 아니다라는 변명을 하던 찰나 “그래도 공간 디자인 자체가 이미 잘 되어 있어서...”라는 말을 들었을 때, 마치 검증이라도 받은 것처럼 뿌듯한 마음이 들었다.
2-2. 천과 프로젝션, ‘나의 마음'을 ‘결과지'로 출력해주는 모든 ‘비쥬얼 요소'들
체험자들이 가장 많이 했던 말은 ‘예쁘다', ‘신비롭다'등의 감정적인 표현이었다. ‘뭔지는 모르겠지만'이라는 수식어 때문에 인터랙션에서의 실패를 체감하면서도, 함께 딱 봐도 아름다운 것들이 주는 영향에 대해 다시 한번 생각하게 되었다. 유치하게 생각할 지 몰라도, 결국 보기에 예쁜 것이 주는 감정적 울림이 있다. 충격을 주거나, 역겨움을 주는 방식과는 다르게 날카롭지 않아도 충분히 강력하다는 점이 강점이다. 내가 아무리 강력한 메세지를 가지고 있다고 해도, 사람들이 그 메세지를 받아들일 준비나 마음이 전혀 없을 때, 그 메세지를 폭력적으로 전달하는 것이 과연 좋은 작업일지, 그 방식이 보기에 아름다울 때 가질 수 있는 힘은 어떤지에 대해 더 깊게 고민해 보아야겠다고 생각했다.
작업의 의미를 자평하는 것은 그 자체가 한계를 가지지만, 이번 작업은 기존에 해왔던 모든 작업에서의 의문들을 다 포괄하고도 더 넓은 공간에서 길을 찾는 과정이었다고 생각한다. 그 과정에서 얻게 된 약간의 답과 새로운 의문으로 앞으로 무엇을 만들더라도 더 단단하고 더 의미있는 작품, 제품, ‘작동하는 무언가'를 만들고자 한다. 먼 미래, 마음을 읽어주는 마음 현상소가 생겨서 그 곳을 방문 했을때, 나는 이 때의 기억들이 반드시 마음 공간 어딘가에 영사되어 있을 것이라고 믿는다. 작업을 함께해준 강건우, 최한종, 그리고 걱정해주신 선생님, 조교님, 응원하고 도와준 모든 사람들에게 그저 감사한 마음이다.
*1 어쩌면 디자인과에 진학한 이유도 무언가 반응하는 작은 디바이스가 좋았던 게 전부일지도 모른다.
*2 물론 비언어적인 예술을 언어로 해석하는 것은 아주 중요하고, 그 역할은 평론가와 이론가들의 몫이라고 생각한다. 그들이 더 정확하게 의미를 짚어낼 수록 미술사는 앞으로 전진할 힘을 얻는다.
0 notes
needcaffeine2 · 6 years
Text
Final Project_report_과정
*본 포스트는 본 작업의 ‘과정’에 대한 내용입니다. 굳이 알고싶지 않을 수도 있는 의미 부분은 따로 모아서 다른 포스트에 정리하였으니 궁금하신 분들은 아래 링크를 통해 확인해주시기 바랍니다.
https://needcaffeine2.tumblr.com/post/175326959210/final-projectreport%EC%9D%98%EB%AF%B8%EC%B5%9C%EC%A2%85-%EC%98%81%EC%83%81-%ED%8F%AC%ED%95%A8
**본 포스트를 읽기전에 
https://needcaffeine2.tumblr.com/post/174752796640/final-projectprogress-report
를 먼저 읽어주세요.
프로세스
Tumblr media
작업의 기획대로 공간을 전체 다 활용하기로했다. 무모한 생각이지만 실행력이 좋은 두 팀원과 무모하기만 한 본인은 공간 구획부터 시작했다. 이미지밴드가 사용하고있는 구간과 구분하는 벽이자, 좁은 복도 공간을 만들어 공간적인 반전을 주기 위한 구간을 위해 2.5미터 정도 되는 구간을 천으로 둘렀다.
youtube
스케일 모델에서는 알 수 없었던 문제가 산더미같이 많았다. 가장 첫 질문은 ‘천을 어떻게 달 것인가?’였다.  시간이 없었기 때문에 천을 무작정 달아보기로 했다. 몇십 마를 달았음에도 공간은 비었고, 데모 이후 추가적으로 천을 달아야 했다. 천을 다는 노동 자체보다 힘들었던 건 연출이다. 어떻게 천을 다느냐; 팽팽하게 다느냐, 쫙 펴진 느낌을 줄 것인가, 방향은 어떻게 가야하는가. 이 모든 질문에는 전혀 어딘가에 나와있는 답이 없었다. 온전히 감각적이고 경험에 의존해야하는 과정이었고, 다행히도 결과적으로 꽤 괜찮은 공간 구성이 나왔다. 처음 머릿속에 있었던 면 단위의 설치가 아니라 첫 번째 데모 테스트 때 천을 자르기 애매해서 시도했던 아치형을 기반으로 다양한 각도로 공간을 구획했다. 입장하는 순간 헤쳐나가야하는 빽빽한 공간을 구성했고, 헤치자마자 보이는 침대 공간과 유일한 조명인 스탠드를 통해 자연스럽게 가야하는 방향을 암시하도록 했다. (아래 링크를 통해 입장 초반 공간 느낌 참조)
https://youtu.be/da-pVoSjzjk
Tumblr media Tumblr media Tumblr media
우리 팀의 가장 큰 장점이자 단점은 아주 명확한 역할분담이었는데, 설치를 주로 도맡은 팀원은 다 합치면 100미터는 족히 될 듯 한 분량의 선을 늘어뜨리고 현장에서 납땜을 했다. 5미터가 조금 넘는 넓은 공간을 다 감지하기 위해서는 생각보다 많은 전선이 필요했다.
Tumblr media
프린트 결과물을 ‘마음의 등고선'으로 정하고 등고선을 이미지로 만든 이후, processing에서 bitmap이미지를 아두이노에서 출력가능한 어레이 코드로 바꿔주는 라이브러리로 이미지를 코드로 전환했다. 하지만 등고선은 깨지기 일쑤였고, 에러는 계속해서 변주되는 것으로 보아 하드웨어적인 문제나 파일 형식의 문제, 크기의 문제 등일 가능성이 커보였다. 위의 사진은 처음으로 성공적인 인쇄가 끝나고 너무 기뻐서 촬영한 사진.
Tumblr media
약 1주일간 3-4번 이상 밤새다싶이 작업을 했고, 없는 재료는 어떻게 해서든 구했다. 어떻게 설치했나 싶을 정도의 분량이었다.
부품 명세서
[작동부]
Arduino Uno 4개
Arduino Mega 호환보드 1개
Adafruit Thermal receipt printer 1대
전선 70미터
144입 WS2812 LED strip 1개
HC-SR04초음파센서
iMac 2대
laptop 3대 (1대 제목 투사용)
BenQ MH680 2대
Epson EB-X31 1대
[연출]
매트리스2대
베개솜 2개
요가매트 4-5개
프로젝터 고정용 사다리 및 설치용 사다리 각 1대
이케아 스탠드 1대
아이보리화이트 쉬폰 20+35마
화이트 쉬폰 2마
블랙 기본 천 55마
흰색 모조실크 천 25마
10t 낚시줄 약 10미터
옷걸이 1
의자 1
장식용 전구 1
포그머신 1대
스키메틱
Tumblr media
코드
프로세싱
import processing.video.* ; import processing.serial.* ; import processing.net.* ;
Movie myMovie ; int endTime ; int timer ; boolean recentlyEnd ;
int state ;
Serial myPort ; String portName = "COM9" ; //update!!
final String name = "bed" ; // sonar0, sonar1, bed Client c ;
String serverIP = "192.168.0.27"; //update!! int port = 12345; //update!!
Movie[] movieName  ; Movie test ; Movie rain ; Movie city ; Movie campfire ; Movie space ;
boolean showRect ; int rectOp;
String testText ;
int serialCount = 0 ; int valueLength = 1 ; int[] sensedValue = new int[valueLength] ;
void setup() {  fullScreen();  //size(1280, 720);  background(0, 0, 0);  test = new Movie(this, "test.mp4");  city = new Movie(this, "space2.mp4");  rain = new Movie(this, "rain1.mp4");  space = new Movie(this, "space1.mp4");  campfire = new Movie(this, "Campfire.mp4");  Movie[] _movie = {test,    rain,    space,    test,    rain,    space,    test,    rain,    space,    test,    city,    campfire,    test,    city,    campfire,      test,    city,    campfire} ;  movieName = _movie ;  myMovie = movieName[0] ;  myMovie.loop();  state = 0 ;  colorMode(HSB, 100);
 c = new Client(this, serverIP, port) ;
 frameRate(30);
 myPort = new Serial(this, portName, 9600) ;
 showRect = false ;  rectOp = 100 ;
 testText = "0" ; }
void draw() {  image(myMovie, 0, 0, width, height);  if (state == 0)  {    if (recentlyEnd && timer - endTime > 120)    {      myMovie = test ;      myMovie.loop();      recentlyEnd = false ;      showRect = false ;    }    if (c.available() > 0)    {      if (c.readString().equals("start")) ;      {        state = 1 ;        showRect = false ;        timer = 0 ;        myPort.write("start");      }    }  } else  {    if (c.available() > 0)    {      String string_read = c.readString() ;      String[] area = string_read.split(" ");      if (string_read.equals("stop"))      {        state = 0 ;        showRect = true ;        endTime = timer ;        recentlyEnd = true ;        myPort.write("stop") ;      } else if(area.length == 3)      {        int num = int(area[0]) * 9 + int(area[1]) * 3 + int(area[2]) * 1 ;        changeMovie(movieName[num % 18]) ;      }    }  }  if (showRect && rectOp < 100) rectOp = rectOp + 2 ;  if (!showRect && rectOp > 0) rectOp = rectOp - 2 ;  fill(0, rectOp);  rect(0, 0, width, height) ;  /*fill(100);   textSize(100);   text(testText,width/2,height/2);*/ }
void movieEvent(Movie m) {  m.read(); }
void serialEvent(Serial port) {  int v = myPort.read() ;  if (state == 1)  {    sensedValue[serialCount] = v ;    if (serialCount == valueLength - 1) areaUpdate() ;    serialCount = (serialCount + 1) % valueLength   ;  } }
void areaUpdate() {  for (int i = 0; i < sensedValue.length; i++) print(sensedValue[i]);  println();  /////////////////////////////////////////////////////////////////////////////////////////for test!!!!!!!!!!!1////////////////////////////  if(sensedValue.length == 2) c.write(name + " " + sensedValue[0] + " " + sensedValue[1]);  else c.write(name + " " + sensedValue[0]); }
void changeMovie(Movie _name) {  myMovie.stop();  myMovie = _name ;  myMovie.loop() ; }
int mod(int a, int b) {  return a >= 0 ? a % b : a + b ; }
아두이노
#include "Adafruit_Thermal.h" #include "please2.h"
// Here's the new syntax when using SoftwareSerial (e.g. Arduino Uno) ---- // If using hardware serial instead, comment out or remove these lines:
#include "SoftwareSerial.h" #define TX_PIN 22 // Arduino transmit  YELLOW WIRE  labeled RX on printer #define RX_PIN 24 // Arduino receive   GREEN WIRE   labeled TX on printer
SoftwareSerial mySerial(RX_PIN, TX_PIN); // Declare SoftwareSerial obj first Adafruit_Thermal printer(&mySerial);     // Pass addr to printer constructor // Then see setup() function regarding serial & printer begin() calls.
// Here's the syntax for hardware serial (e.g. Arduino Due) -------------- // Un-comment the following line if using hardware serial:
//Adafruit_Thermal printer(&Serial1);      // Or Serial2, Serial3, etc.
// -----------------------------------------------------------------------
int serialCount ; String userName ; int resultNum ;
void setup() {  Serial.begin(9600) ;  // This line is for compatibility with the Adafruit IotP project pack,  // which uses pin 7 as a spare grounding point.  You only need this if  // wired up the same way (w/3-pin header into pins 5/6/7):  pinMode(7, OUTPUT); digitalWrite(7, LOW);
 // NOTE: SOME PRINTERS NEED 9600 BAUD instead of 19200, check test page.  mySerial.begin(19200);  // Initialize SoftwareSerial  //Serial1.begin(19200); // Use this instead if using hardware serial  printer.begin();        // Init printer (same regardless of serial type)
 serialCount = 0; }
void loop() { }
void serialEvent() {  if(serialCount == 0) userName = Serial.readString() ;  else if(serialCount == 1)  {    resultNum = Serial.read() ;    printResult(userName, resultNum);  }  serialCount = 1 - serialCount ; }
void printResult(String _name, int _num) {  printer.justify('L');  printer.setSize('M');  printer.inverseOn();  printer.print(F("UserName:"));  printer.print(F(_name));  printer.print(F(",\n"));  printer.setSize('s');  printer.println(F("Your Mind-graphic \nis the following:\n\n"));  printer.inverseOff();
 //switch  printer.justify('C');  printer.setSize('L');    printer.println(F("Forest"));  printer.setSize('S');  printer.println(F("Rain"));  printer.setSize('S');  printer.println(F("Stars"));  printer.setSize('S');  printer.println(F("City"));
 printer.println(F(""));
 printer.printBitmap(please2_width, please2_height, please2_data);  //switch
 printer.inverseOn();  printer.justify('L');  printer.println(F("\nMind-graphic processing lab"));  printer.println(F("+82)10-AATB-1208"));  printer.inverseOff();  printer.println(F("KangGW KimKW ChoiHJ"));  printer.println(F("*Office Hour: \nDepends on your Mind\n"));  printer.println(F("------------------------------"));
 printer.printBarcode("KWK", CODE128);  printer.setBarcodeHeight(150);
 printer.feed(2);
 printer.sleep();      // Tell printer to sleep  delay(3000L);         // Sleep for 3 seconds  printer.wake();       // MUST wake() before printing again, even if reset  printer.setDefault(); // Restore printer to defaults }
최종발표 당시
youtube
youtube
지금 보면 눈물나는 영상. 이 당시만 해도 전혀 기획한 인터렉션과 달라질 이유도, 스케일을 줄일 이유도 없었다. 하지만 그때는 결국 디버깅 하지 못한, 영상 파일 한 두개가 재생되지 않는다는 문제로 우리는 이 때보다도 못한 작업을 전시해야했다.
과제전 전시 당시
youtube
youtube
모든 문제가 파악이 되고 해결한 지금, 너무 안타까워서 재생할 수 없는 영상들.
인터뷰
인터뷰1  엄청 몽환적이고. 저기 안에 들어가 있을 때 저기서 잠을 자면 진짜 기분이 좋아질 것 같은 그런 느낌. 색깔도 너무 예쁘고. 그런데 너무 아쉬운 것 같아요. 플레이테스트때만큼만 영상이 됐어도 너무 좋았을 것 같은데. 그거야 어쩔수 없는 거지만. 그런데 다른 불빛을 많이 해놓으셔서. 더 따뜻한 느낌이 전보다 들고. 그랬던 것 같아요. 아. 괜찮은데 저 천을 만졌을 때는 반응이 없는 거죠? 침대 앉았을 때 색깔이 바뀌는 게 좋은 것 같은데. 제가 몰랐잖아요. 어디에 앉아야 하는지를. 센서가 더 넓었으면 좋았을 것 같아요.
인터뷰2  어떻게 되는 건지 잘 모르겠지만 이쁘고 아름답고. 침대는 편안하고. 베개가 양쪽에 있어서 행복했다. 뭐가 어떻게 진행되는지 몰라서, 바뀌는 느낌을 많이 못 받았다.
인터뷰3  재밌는 것 같아요. 상당히 집에 해놓고 싶은 데코와. 사실 해석이 있으면 좋을 것 같은데, 그거와 별개로 재밌는 경험이었다. 처음부터 끝까지 신기한 경험이었다. 빛색깔이 달라지는 것 같았는데 자세히 못봤다.
인터뷰4  들어가서 아무것도 안 해도 된다고 해서 가만히 있었는데. 조금 더 돌아다녀볼걸, 이라는 생각을 했다. 공간이 굉장히 몽환적이었다. 편하고 좋긴 한데. 왜 몽환��인지는 잘 모르겠다는 느낌을 받았다. 안개 나오는 게 신기해서, 그것 때문에 돌아다닐 유인이 생겼다. 더 이상 누워있어서는 안되겠다는 생각이 들었다. 그래서 돌아다녔다. 돌아다니면서 색깔 많이 바뀌어서 신기했다.
그래도 20명 정도의 관람자들이 있었고, 급하게 인터뷰를 땄다. ‘이쁘다' ‘안락하다'라는 1차적인 느낌과 ‘신기하다'라는 느낌이 주였다. 관찰 결과 사람들은 생각보다 쉽게 침대에 누웠고, 돌아다녔으며 인터렉션이 어디서 일어나는가보다는 무언가 변화한다는 그 자체에 더 집중했다. 자신의 이름이 들어간 결과지를 가져가고 밖의 밝은 공간에서 그것을 유심히 보고 사람들과 비교해보는 것이 생각보다 작업 전체에서 큰 부분을 차지함을 알 수 있었다. 
인터렉션 자체와 과정에 대한 평가 (의미에 대한 평가는 다른 포스트에)
교수님이 뒷풀이 자리에서 ‘실패한 작업은 없다'라는 말에 우리 작업에 대해 생각하신 것으로 알고있다. 맞다. 이번 작업은 또 다시 실패한 작업이다. 항상 어떻게 해서든 모든 기획을 실현은 하긴 하지만, 매번 100을 기획해서 80을 실현하다보니  50을 기획해서 50을 실현한 작업보다 실패한 작업이 되어버리는 듯 하다. 본 포스팅을 읽을 다음 수강생을 위하여 아래와 같이 몇가지 조언+자기평가를 해본다.
1. 스케일을 두 배로 키우는 순간 해야하는 일은 4배 이상으로 늘어난다.
2. 같은 느낌을 주기 위해 반드시 100을 하지 않아도 된다. 50으로도 충분히 가능하다.
3. 항상 작업의 본질적인 질문에 대해 고민하지 않으면 작업은 쉽게 다른 방향으로 새버린다.
4. 그럼에도 불구하고 당신이 정말 커다란 무언가(100)를 해보고 싶다면, 50을 하려는 사람을 보지 말고 200을 하는 사람의 마음으로 달려들어야 100을 해낼 수 있을 것이다.
5. 전시는 데드라인이다. 열리고 닫힌 이후에는 전시될 수 없다. 이틀 남았으면 줄이고 줄여서라도 실현 가능하게 만들어서 ‘전시를 해라'.
6 notes · View notes
needcaffeine2 · 6 years
Text
Final Project_Progress report
우리조의 주제는 초기 기획안에서 크게 벗어남 없이 ‘꿈 현상소'라는 키워드로 인터랙티브한 공간을 연출하는 작업이다.
Tumblr media Tumblr media
학관 근처에서 총연이 버린 매트리스2개와 요가매트 십수개, 베개솜 등을 구했고, 릴레이, 컴퓨터 2대, 아두이노 2개(아두이노 메가 1개로 교체 예정), 피에조 센서 4-5개, 영수증프린터(A7)1대로 1차 플레이테스트를 준비했다.
피에조로 진동을 받아서(아두이노) 프로세싱으로 그 데이터를 받아 물결이 이는 그래픽으로 보여주는 데모를 진행했고, 타이머 그래픽과함께 시간이 다 되면 지정된 내용을 영수증으로 출력하고 cut해주는 기능적인 인터렉션은 이미 구현이 되었다.(해당 영상 및 사진은 추후 본 포스팅에 수정 첨부)
youtube
Tumblr media Tumblr media Tumblr media Tumblr media
공간레이아웃을 그리기 위해 직접 전시공간인 스튜디오를 찾아가 측정했고, 가로 6.5, 세로 5.5, 높이 약 3.3미터의 공간을 사용할 수 있었다. 침��� 매트리스 2개를 놓고도 충분히 남는 공간이었고, 너무 넓어 와닿지 않아서 종이로 31:1 스케일모델을 만들어서 공간이 어떻게 나올지 느낌을 봐야했다.
Tumblr media
뭐랄까 빨래 걸어둔 느낌이 나기도 하고, 레퍼런스상의 아래와 같은 ‘레이어를 거쳐가며 산란하는'빛이 어떤느낌일지 보기 위해서는 더 많은 천과 더 어두운 환경에서의 테스트가 필요했다. 그 외에도 컨텐츠를 제작하기 위해 어떤 내용이 들어가야할지, 어떤 동선으로 움직일지 등이 결정되어야 했기에 일단 동대문으로 향했다.
Tumblr media
youtube
(위 영상은 쉬폰+LED조명 테스트영상)
동대문 시장은 워낙 복잡해서 한 두번 가보고서는 구조를 파악하기가 힘든데, 다행히 이전에 몇 번 시행착오를 겪었던 터라 원하는 천을 쉽게 찾을 수 있었다.
Tumblr media Tumblr media Tumblr media
완전 하얀색의 쉬폰이 재고가 부족해서 아이보리 화이트로 20마를 구입했고, 복도를 만들기 위한 까만색 천은 가장 싼 재질로 40마 정도를 구입했다. 검정색 쉬폰과 완전히 하얀색 쉬폰도 테스트용으로 각각 2-3마씩 구입. 이번 한번에 10만원을 다 써버렸다 ;)
늦은밤 천장에 천을 매달아놓고 레이어되어 프로젝션이 비치는 느낌이 어떨지 보기 위해 8겹을 겹쳤다. 아직 자르기는 아까워서 자르지 않은 상태에서 붙이기만 해보았다.
Tumblr media Tumblr media
따로 프로세싱으로 그래픽을 테스트 한 것은 아니고, 유투브에서 우리가 생각하고있는 느낌이 드는 영상을 찾아 틀어보았다.
youtube
youtube
생각보다 분위기가 잘 연출되어서 놀라웠고, 생각보다 투과율이 좋지 않아서 안타까웠다. 천의 촉감이 너무 좋아서, 아무래도 초기의 가만히 있거나 누워있는 인터렉션이 아니라 천을 만지작 거리면 영상이 변화하는 인터랙션 + 앉는 순간 확 변하는 인터랙션 + 끝난 뒤 프린트된 자신의 ‘무의식’ 또는 ‘꿈'을 들고나가는 인터랙션의 구성으로 바꾸어야 할 듯 하다. 투과율로 인해  아마도 2-3개의 프로젝터를 써야할 것 같고, 사운드는 문자위(문화자치위원회)에서 4개 대형스피커 시스템을 예약해 공간을 울릴 정도의 연출을 할 수 있도록 하고자 한다. 스튜디오 내 대형TV 1대와 조명을 사용할 수 있게 되었으며, 해당 공간에서 상주하며 작업하는 동아리 이미지밴드와 협의후 테스트 및 설치일정 및 사용에 대해서는 비교적 자유롭게 진행할 수 있게 되어, 남��� 것은 공간 연출 및 반복적인 테스트를 통한 인터렉션 검증이 되겠다.
0 notes
needcaffeine2 · 6 years
Photo
Tumblr media
0 notes
needcaffeine2 · 6 years
Text
21,28/5/2018 Practice report
무려 개당 10만원 정도인 고가의 보드임에도, 겉보기에는 크게 차이가 나지 않아 그냥 ‘아두이노네~’하고 지나칠 수 있다. 윤이 비싼 이유는 사실상 아두이노+작은 컴퓨터의 성능을 갖고있기 때문인데, 단순히 전선으로 연결되거나 모듈을 사용하여 블루투스/와이파이 전송을 하는 것을 넘어서서 훨씬 복잡하거나 어려운 작업도 수행할 수 있다. 
생김새는 아래와 같다. 커다랗게 YUN이라고 적혀있는 알루미늄 패널이 아름답다. 언젠가부터 잘 배치된 회로도를 보면 알 수 없는 충족감을 느끼는데, 이거 위험한 현상이 아닌가 싶다...
Tumblr media
뒷면을 보면 QR코드가 있는데, QR코드를 읽지 않고 그냥 그 위에 적힌 코드를 입력해도 된다.
Tumblr media
생각보다 윤의 세팅을 해주는 작업이 꽤 오래 걸렸는데, 이는 와이파이 연결이 자꾸만 알 수 없는 타이밍에 끊겨서였다. 그럼에도 결국 윤을 와이파이에 연결하는데 성공!
Tumblr media Tumblr media Tumblr media
불이 들어와있다. 13번 핀에 LED를 꽂았던 사진이 생략되어있다.
사실 인미디를 통틀어 가장 신기했던 실습은 blynk이다. protopie에서 실험적으로 핸드폰과 아두이노를 연결하는 프로토타이핑 기능을 제공하고 있는데, 그게 아니라 아예 아두이노에 맞춰져서 앱이 나와있는 것을 보고는, 역시 이런 앱이 없을리가 없다는 생각이 들기도 했다.
blynk를 통해 마치 가상의 버튼이 있는 것처럼, ON/OFF 또는 PWM신호를 줄 수도 있다. 처음에는 이 개념이 이해가 되지 않았지만, 이해가 된 순간 절로 박수를 치게 되었고 이를 피지컬 컴퓨팅을 활용한 앱 개발에 쓴다면 아주 유용하리라고 생각되었다. 
Tumblr media
youtube
youtube
youtube
Temboo를 활용하면 인터넷상의 각종 정보를 가져와서 아두이노에 인풋으로 넣거나, 반대로 아두이노의 신호를 받아서 트윗을 날리는 등의 인터랙션이 가능하다. 우리의 실습 내용은 센서값을 받아서 트윗날리기!
Tumblr media Tumblr media Tumblr media
우여곡절끝에 성공!
아이디어
- 사실 중간발표때 정말 하고싶었던 아이디어인 ‘롱디 커플을 위한 인터랙션 인형'에 윤은 아주 유용할것 같다. 아이디어가 생각이 나지 않으실 많은 분들을 위해 설명하자면, 롱디 커플들이 떨어져있는 동안 서로 간단한 신체적 접촉도 할 수 없기에 인형을 쓰다듬어서 신호를 보내거나, 반대로 인형을 끌어안고 있다가 귀를 흔들어 상대가 나에게 어떤 신호를 보내고 있음을 확인한다면, 단순히 스크린 상의 텍스트로 인터랙션 하는 것보다 복합적이고 감각적인 인터랙션이 가능해진다. 물론 Blynk를 활용하면 핸드폰으로도 신호를 다양하게 보낼 수 있으니, 추상적이거나 구체적인 단어가 필요한 커뮤니케이션을 신체접촉, 감각이라는 새로운 영역과 엮어낼 수 있다. ‘우울해'라고 보내면 귀가 축 쳐지고, ‘보고싶어!’라고 보내면 귀를 살랑거리는 토끼 커플 인형. 생각만해도 너무 귀엽다!! 
0 notes
needcaffeine2 · 6 years
Text
14/5/2018 Practice report
퀴즈를 망쳤다!
가장 배우고 싶어했으면서 아장아장 배운 각종 전자공학적인 지식들을 소홀히 한 나의 탓이다. 열심히 팀프로젝트를 해서 뿌듯함이라도 건지는게 좋겠다.
간만의 실습시간! 프로세싱과 아두이노의 결합은.... 어마어마한 가능성의 신세계로 우리를 안내한다.
Tumblr media
아주 간단한 아날로그 인풋 / 시리얼통신을 통한 원 크기 조정하기.
생각보다 중독성 있다.
Tumblr media
youtube
0 notes
needcaffeine2 · 6 years
Text
Individual Project report
youtube
Chair?
April, 2018. 
Mixed media, 500x500x1000
어포던스(affordance)란, 어떤 사물이 사용자와 맺는 관계 사이에서 발생하는 사용 속성을 말한다. 의자의 affordance는 앉을 수 있도록 지탱하는 것이다. 하지만 웬만한 성인은 의자를 들어서 옮길 수 있기 때문에, ‘앉음’ 말고도 ‘들어서 옮김’ 또한 의자가 가진 affordance가 된다. 하지만 아이의 경우 의자를 옮길 수 없기 때문에, 아이에게 같은 의자의 affordance는 ‘앉음’밖에 없게 된다.
만약 우리에게 너무나 일상적인 이 사물에게 새로운 affordance를 부여하여 기존의 affordance를 빼앗는다면 어떠한 일이 벌어질까? 우리는 사물의 ‘당연하고’ ‘본질적인’기능을 건들지 않은 상태에서 오히려 새로운 능력을 부가함으로써 그 기능을 무력화 하고자 한다. 그에 따라, 우리 주변을 둘러싼 환경의 ‘당연한’ 속성을 ‘당연하지 않게’, 다시 생각하게 만들고자 한다. 앉을 수 있지만 앉을 수 없는 의자를 의자라고 부를 수 있을까?
사용된 재료 명세
아두이노 메가 호환보드- 1개
아두이노 모터쉴드 호환 YF Robot 모터쉴드 - 1개
브레드보드 - 1개
리튬이온 배터리 11.1V 3200mAh extreme - 1개(1개분실) 오프로드 바퀴용 30㎜ 황동 육각 허브 [SZH-GNPHUB01] - 2개 소형 회전바퀴 - 2개
기어박스장착모터 바퀴 SET (NP01D-48) - 2개
오프로드바퀴 130파이 - 2개
엔코더장착형 감속기어모터 IG-42GM+Encoder 01TYPE(12v)감속비옵션 1/24 - 2개 
엔코더장착형 감속기어모터 IG-32GM+Encoder 05TYPE (12V)감속비옵션:1/27 - 2개
초음파센서 HC-SR04 Ultrasonic Sensor Distance Measuring Module - 8개
MDF 1m x 1m - 2개
30x30x1200 나무각목 - 1개
아이소핑크 - 부분
3D프린팅(모터 고정용) / 레이저커팅(보드 제작용)
각종 굵기의 전선
핸드드릴
약 20개가량의 4파이(M4) 볼트 / 너트
프로토타입용 플라스틱 의자 - 1개
버려진 회전의자 - 1개
가벼운 접이식 의자 - 1개
Concept Development
Tumblr media
Figure 1) 3d model plan
Tumblr media
Figure 2) Module design layout
회로도 및 스키메틱
제대로 연결했음에도 불구하고 오류가 났으나, 8개의 초음파센서 스키메틱을 다시 그리면서 모터쉴드와 아두이노를 일일이 연결할 엄두가 나지 않아 일단 하드웨어 연결한 그대로를 복제한 브레드보드 이미지와 함께 첨부한다.
Tumblr media Tumblr media
Arduino code
/**set control port**/
#define CLOSE 0 #define LONG 1 #define check(a) (a > limit ? 1 : 0)
#define Speed 55 #define Turn 55 #define Turn_half 40
const int E1Pin     = 5;   const int M1Pin     = 4; const int E2Pin     = 6;                         const int M2Pin     = 7; //const int trigPin[8] = {22, 28, 36, 42, 23, 29, 35, 41}; //const int echoPin[8] = {24, 30, 34, 40, 25, 31, 37, 43}; const int trigPin[8] = {22, 28, 36, 42, 29, 23, 41, 35}; const int echoPin[8] = {24, 30, 34, 40, 31, 25, 43, 37};
const int Button    = 50;
const int limit = 40;
int sensor_count = 0; int last_sensor = 0;
typedef struct {    byte enPin;    byte directionPin; }MotorContrl;
const int M1 = 0; const int M2 = 1; const int MotorNum = 2; const MotorContrl MotorPin[] ={ {E1Pin,M1Pin}, {E2Pin,M2Pin} } ; const int Forward = LOW; const int Backward = HIGH;
long duration, RightSensor, BackSensor, FrontSensor, LeftSensor, FrontLeftSensor, FrontRightSensor, BackLeftSensor, BackRightSensor;
int  count = -1; long Sensor[8][5]={0,};
void setup() {  initMotor();
 Serial.begin (9600);
 for(int i = 0; i < 8; i++)  {    pinMode(trigPin[i], OUTPUT);    pinMode(echoPin[i], INPUT);  }  //pinMode(Button, INPUT);
 sensor_count = 0;  last_sensor = 0; }
void loop() {  sensor_count = 0; /*  if(++count >= 5)    count = 0;  for(int i = 0; i < 8; i++)    Sensor[i][count] = SonarSensor(trigPin[i], echoPin[i]);  FrontSensor = SelectValue(Sensor[0]);  BackSensor = SelectValue(Sensor[1]);  RightSensor = SelectValue(Sensor[2]);  LeftSensor = SelectValue(Sensor[3]);  FrontRightSensor = SelectValue(Sensor[4]);  FrontLeftSensor = SelectValue(Sensor[5]);  BackRightSensor = SelectValue(Sensor[6]);  BackLeftSensor = SelectValue(Sensor[7]);      */
 FrontSensor = SonarSensor(trigPin[0], echoPin[0]);  BackSensor = SonarSensor(trigPin[1], echoPin[1]);  RightSensor = SonarSensor(trigPin[2], echoPin[2]);  LeftSensor = SonarSensor(trigPin[3], echoPin[3]);  FrontRightSensor = SonarSensor(trigPin[4], echoPin[4]);  FrontLeftSensor = SonarSensor(trigPin[5], echoPin[5]);  BackRightSensor = SonarSensor(trigPin[6], echoPin[6]);  BackLeftSensor = SonarSensor(trigPin[7], echoPin[7]);
 Serial.print(" R : ");  Serial.print(RightSensor);  Serial.print(" B : ");  Serial.print(BackSensor);  Serial.print(" F : ");  Serial.print(FrontSensor);  Serial.print(" L : ");  Serial.print(LeftSensor);  Serial.print(" FL : ");  Serial.print(FrontLeftSensor);  Serial.print(" FR : ");  Serial.print(FrontRightSensor);  Serial.print(" BL : ");  Serial.print(BackLeftSensor);  Serial.print(" BR : ");  Serial.print(BackRightSensor);  Serial.print("\n\n");
if(!check(LeftSensor)){  sensor_count += 1;  last_sensor = 0; }
if(!check(RightSensor)){  sensor_count += 1;  last_sensor = 1; }
if(!check(BackSensor)){  sensor_count += 1;  last_sensor = 6; }
if(!check(FrontSensor)){  sensor_count += 1;  last_sensor = 7; }
Serial.println(sensor_count); Serial.println(last_sensor);
if(sensor_count == 1){  switch(last_sensor){    case 1:      setMotorDirection(M1,Forward);      setMotorDirection(M2,Forward);      setMotorSpeed(M1,Turn);      setMotorSpeed(M2,Turn);      break;
   case 0:      setMotorDirection(M1,Backward);      setMotorDirection(M2,Backward);      setMotorSpeed(M1,Turn);      setMotorSpeed(M2,Turn);      break;
case 6:      setMotorDirection(M1,Backward);      setMotorDirection(M2,Forward);      setMotorSpeed(M1,Speed);      setMotorSpeed(M2,Speed);      break;
case 7:      setMotorDirection(M1,Forward);      setMotorDirection(M2,Backward);      setMotorSpeed(M1,Speed);      setMotorSpeed(M2,Speed);      break;
default:      setMotorSpeed(M1,0);      setMotorSpeed(M2,0);
 }
} else{      setMotorSpeed(M1,0);      setMotorSpeed(M2,0); } }
/**functions**/ void initMotor( ) {  int i;  for ( i = 0; i < MotorNum; i++ )  {    pinMode(MotorPin[i].enPin, OUTPUT);      pinMode(MotorPin[i].directionPin, OUTPUT);    digitalWrite(MotorPin[i].enPin, LOW);  
 } }
/**  motorNumber: M1, M2     direction:          Forward, Backward **/ void setMotorDirection( int motorNumber, int direction ) {  digitalWrite( MotorPin[motorNumber].directionPin, direction);   }
/** speed:  0-100   * */ inline void setMotorSpeed( int motorNumber, int speed ) {  analogWrite(MotorPin[motorNumber].enPin, 255.0 * (speed/100.0) );   //PWM }
long SonarSensor(int trigPin,int echoPin) {  digitalWrite(trigPin, LOW);  delayMicroseconds(20);  digitalWrite(trigPin, HIGH);  delayMicroseconds(100);  digitalWrite(trigPin, LOW);  duration = pulseIn(echoPin, HIGH);  return (duration / 2) / 29.1; }
long SelectValue(long *Sensor) {  long tmp[5]={0,};  for(int i = 0; i < 5; i++)    *(tmp + i) = *(Sensor + i);  for(int i = 0; i < 5; i++)    for(int j = i + 1; j < 5; j++)      if(*(tmp + i) > *(tmp + j))        Swap(tmp + i, tmp + j);  return *(tmp + 2); }
void Swap(long *a,long *b) {  long tmp = *a;  *a = *b;  *b = tmp; }
Process
Tumblr media
Figure 3)   Test prototype1
Tumblr media
Figure 4)  Test prototype2
Tumblr media
Figure 5)    1/2 scale working prototype
Tumblr media
Figure 6)  Module finished
Tumblr media
Figure 7) 1st Final  product
youtube
원래 의도된 버전의 의자 테스팅 영상. 중간에 가다 잡는 것 처럼 보이지만, 멈춘 후 가지 않는 문제가 이때부터 발생했다. 단순히 토크 문제라고 생각했지만, 전날 밤 교수님과 조교님과 함께 확인한 결과 모터드라이버의 문제였다.
Tumblr media
Figure 8) 2nd  version Final
Tumblr media
Figure 9) Side view
Tumblr media
Figure 10) Perspective view
Scene 
Tumblr media Tumblr media
User Test
youtube
youtube
관람자 1
발을 휘휘 젓는다. 의도한 대로 작동하지 않음을 인식하고 아쉬워 하는 눈치를 보였다. 코드를 수정해 다시 실행했더니 한번 더 시도한 후, 신기하다고 외침.
관람자 2
프로토타입 때 훨씬 잘 돌아갔던 것 같은데. 모터드라이버가 아쉽다는 점 외에는 딱히 피드백을 줄 수 있는게 없다.
관람자 3
오… 어?..오.. 재밌는데?
관람자 4
의자가 떠다니는게 아니라 실제 의자가 움직이는 모양이라면 더 좋았을텐데.
관람자 5
(부딪히자) 으앙.
관람자 6
발로 휘휘 저으며 익숙하게 의자를 밀어내다, 의자가 생각보다 빠르게 멀어져가는 것을 보고 뛰어가서 의자를 잡음.
관람자 7
마치 초능력을 쓰는듯한 (쓸데없지만 자연스러운) 제다이인지 장풍일지 모를 모션을 보여주심.
이번 작업의 화두는 스케일이다. 어떤 아이디어가 떠올랐고 그것을 어떻게 현실화 할지까지 다 알고있는 상태에서, 성공적으로 테스트를 완료하더라도 스케일이 커지면 그 테스트는 무용지물이 되기도 한다. 무언가를 크기만 크게 만든다고 되는 것이 아니라, 변수가 그만큼 다양해지고 복잡해지기 때문에 스케일은 다른 변수와는 차원이 다른 변수라고 할 수 있겠다. ‘움직이는 의자를 만들어야지'라는 이 아주 단순한 아이디어에서조차, 의자를 움직일 구조를 무엇으로 만들어야 하는지, 바퀴, 바퀴와 모터를 연결할 샤프트 허브, 결국 포기하긴 했지만 바큄 모듈을 어떻게 감춰야 하는지 등의 수만가지 문제가 프로토타입 단계에서는 어딘가에 숨어있다가 갑자기 짠 하고 나타난다. 이렇게 질질 끌면서 스케일에 대한 이야기를 하는 이유는, 당연히 핑계를 대기 위함이다.
이번 작품의 인터랙션은 엄밀히 말하면 실패했다.
원래의 의도였다면, 의자는 마치 스스로 살아 움직이며 도망가는 모션을 보여주어야 했을 것이고, ‘작동'하는것이 아닌 실제로 사용자로부터 ‘도망'을 가야만 한다. 하지만 도망가는 것이 아닌 사용자가 ‘갖고 노는' 느낌의 인터랙션만 가능했으며, ‘작동'하기 위해 작가가 전원 선을 연결하는 초기 설정과정 때문에 이 인터랙션은 더더욱 작위적일 수밖에 없다. 물론 그 행위가 주는 재미도 있긴 하지만, 도망가는 느낌을 주지 못한 코딩/하드웨어 세팅과 모터드라이버의 문제, 기어비를 잘못선택 한 점 등 여러가지 문재의 혼합으로 이번 인터렉션은 초기 기획에 비해 많이 부족한 작업이 되었다.
하지만 사람들이 생각보다 작은 것에도 재미를 느낀다는 점(장풍 쏘기 등)과, 스케일이 크게 차이는 작업에서 조심해야할 점을 알았고, 좀 큰 모터를 다뤄보았다는 점에서 이번 작업의 의의를 찾을 수 있겠다. 
지인을 통해 모터드라이버를 새로 얻었고, 기회가 된다면 다시 고쳐서 테스트 해볼 생각이다. 정말 의자다! 싶은데 움직이는 그 이상한 느낌을 꼭 포착하고 싶어서.
P.S.
1. 본 작업은 SNU Zebracrossing project에 선정된 기획안으로, 미술대학,음학대학의 기획 아래  총동창회의 지원금을 받아 제작되었으며, 과제를 위한 것이라기 보다는 하나의 독립 작업입니다.
2. 본 작업은 1년 전 팀장인 저를 포함(디자인과), 기계공학과, 조선해양공학과, 조소과로 다양하게 구성된 팀원들과 함께 고민하여1차 프로토타입을 제작하였고, 코드 및 하드웨어 구성에도 협업하였습니다.
3. 본 작업을 진행함에 있어 가장 핵심인 프로토타입 -> 실제 작품 제작 과정은 과제를 진행한 온전히 제 작업의 결과물입니다. 하지만 전체 작업의 지적 소유권은 개인이 아닌 팀에게 있으며, 작업 내역 중 과거 팀 협업 과정 또는 지원금을 받은 부분 등으로 과제에 대한 평가가 달라져야 한다면 충분히 감수하고자 합니다. 
0 notes
needcaffeine2 · 6 years
Text
Idea feedback report
모터가 도착하지 않아서 프로토타입으로 테스트를 진행하였으나, 아직 버벅거리는 부분이 있기도 하고, 디바운싱을 하는 구체적인 방법(어레이로 값을 받아서 중앙값만을 취하는 방법)에 대한 조언을 들을 수 있었다! 
당일 개인적으로 피드백을 많이 드렸다고 생각하여, 그것을 기록하지는 않고 추가적으로 생각나는 것들만 적으려 한다.
CAT - 화면에 Touch / Don’t touch를 쓰는 것보다, ^-^ 등의 이모티콘을 사용하는 것은 어떨지, 그리고 외형이 생각보다 인터랙션에 주는 영향이 클 듯 하다.
어색함 구현하기 - 지적한 바 있지만, 어색함에 대한 좀 더 구체적인 고민과 상황 부여가 필요해 보였다.
동전 넣으면 공연 - 최소한의 예산으로 최대한의 인터랙션을 구현했다는 생각은 들지만, 개인적으로
디퓨저 독서대 - 작품이 아닌 제품형 아이디어에는 피드백을 많이 안드렸는데, 이는 접근 방식이 아예달라지기 때문이다. 이미 다른 분들께서 많은 피드백을 드렸지만 디퓨저와 독서대의 결합이 꼭 일체형이여야 할지, 만약 떨어져 있다면 어떤 식으로 상호작용해야할 지 등 생각해볼만한 문제가 많은 아이디어였다.
공부좀 해 - 개인적으로 바이럴 영상 만들어서 잘 퍼지면 팔릴수도 있겠다 싶은 아이디어였다.
저금통 -  생각보다 내부에 회로를 집어넣는 작업이 매우 귀찮고 어려울 듯 했고, 그냥 돼지 저금통인데 동전이 세어지네? 라는 느낌을 주는 것이 디자인적인 측면에서 많이 어려운 과제로 보인다.
0 notes
needcaffeine2 · 6 years
Text
Idea / prototyping report
어포던스 없애기
의자 = 앉는 것, 바퀴가 달려있지만 스스로 움직이지 않음. 공공장소의 ‘비어있는 의자’ 
  =>  ‘앉을 수 있는 의자다’=> (앉기 위해) 다가감=> 도망감!
Tumblr media
모듈을 제작
Tumblr media
제작 후 의자와 결합하여 하단에 부착
아직 모터가도착하지 않아서 프로토타입만 제작하였다.
Tumblr media Tumblr media
예정된 테스트 장소인 사회대 카페. 공간 사용 허락을 구했고, 최대한 비슷한 의자도 구해두었다.
Tumblr media
0 notes
needcaffeine2 · 6 years
Text
2/4/2018 Practice report
이번엔 실습 중심의 수업이었다!
1번 실습은 부저 이용해 키보드 만들기
Tumblr media
youtube
스타워즈 브금을 듣고 재밌어서 뭔가 상큼한 멜로디를 찾다가... 포기했다..
2번 실습은 원래 예제에 있는대로 해야하는데, 아두이노 키트를 멍청하게 들고오지 않은 상태로 원래 갖고있던 재료들도 아이디어팩토리에서 무단 보관하다 다 사라지는 바람에 비상상태가 되었다.
임시로 과거에 연습했던 서보모터 + 스테핑모터 동시에 돌리기를 첨부한다 ㅠㅠ
(다음 주 과제에 예제대로 실행한 영상 함께 첨부하겠습니다~ㅠㅠ)
youtube
0 notes
needcaffeine2 · 6 years
Text
1/4/2018 Practice report
저번 수업을 나가지 못한 관계로, 직접 책을 참고해서 실습을 해보았다.
Tumblr media
youtube
사실 이 연결을 한 시간은 새벽 2시즘으로, 제정신이 아니었다. 작동이 안되기에 왜 안되나 해서 잘 살펴보니
Tumblr media
일단 +에 꽂아야 하는 선을 -에 꽂았었고
Tumblr media
색을 잘못봐서 다른 값의 저항을 꽃아놓았다.
이런 잘못은 사실 스스로 기획해서 저항 값 계산하고, 스키메틱 그려본 후에 회로를 연결하면 일어날 수 없는문제다 ㅎㅎ…
youtube
다시 제대로 연결하고 실행해보니
값이 일정하지 않고 변화되는 것처럼 보이지 않았다. 딜레이를 너무 많이 줘서인가 싶어 다시 딜레이 없이 + 포토리지스터도 1개는 교체하고 색상 커버도 보완해서 실행해보았으나
youtube
제대로 되지 않는다!
ㅠㅠ
점검이 필요해보니 수업으로 가져가는걸로.
0 notes
needcaffeine2 · 6 years
Text
Making Interactive Art: Set the Stage, Then Shut Up and Listen by Tom Igoe
HIGHLIGHTS
Once you’ve made your initial statement by building the thing or the environment and designing its behaviors, shut up. Let the audience listen to your work by taking it in through their senses.
이번 글은 짧기도 했지만, 구어체라 그런지 유난히 머릿속에서 장면이 상상됐다. 마치 한 교수님과 1:1로 면담을 하고 있는데, 포트폴리오를 보시고는 한숨을 한번 푹 쉬고나서 약 1.3분간의 정적후 장장 연설을 들은 것만 같았다. 누굴까 궁금해서 찾아봤더니, 저자는 뉴욕대 ITP 교수님이다. 역시 교수님이 맞았던거다! ;)
저 말이 얼마나 어렵지만 또 맞는말인지 경험을 통해 알고있다.
인생 처음으로 인터렉티브 아트를 시도했던 것은 1학년 입체조형 키네틱 아트 수업에서인데, Kinect를 활용해 손을 움직이면 원이 따라다니는 아주 단순한 예제를 (정말) 힘겹게 성공했다. 
youtube
당시에 ‘손을 움직여 보세요'라고 팻말을 만들어 붙여놨음에도 불구하고 제대로 시도해보는 사람들은 없었고 이게 뭐지? 하면서 프로젝터를 가로막는 사람들만 여럿 지나갔다. 실망한 나는 그날로 컴퓨터를 뽑고 남은 전시날동안 그 작품은 전시되지 않았다.
그 다음으로는 조금 큰 프로젝���로 학교 전시에 참가를 하게됐는데, 사진을 보면 대략 작업의 규모가 어느정도였는지 알 수 있다. 이후로 이것보다 더 큰 작업은 아직 해본적이 없다.
Tumblr media
아래는 실행 영상이다.
youtube
관람자가 인공 무대에 올라서면 그 사람의 움직임을 인식하고(불이 깜빡임), 오른손으로는 불빛을, 왼손의 높낮으로는 음량을 조절해 마치 지휘하는듯한 기분을 느끼게 해주는 작업이다.
하지만 결론은 망했었다.
그것도 아주 처참하게 망했는데, 지금 생각해보면 망한 이유가 너무 많아서 굳이 꼽아야만 할 정도다. 워낙 복잡한 구조에다 아두이노+키넥트+컴퓨터로 돌아가기때문에 걸핏하면 에러가 났기도 했고, 어느 날은 비가와서 전원을 꺼둬야 했다. 비가 올까봐 다리 밑에서 전시를 하지 않았다면 아마 그날 장치가 다 망가져서 다시는 실행하지 못했을 수도 있다. 그런데 그 무엇보다도, 생고생을 해서 만든 무대와 장치, LED가 잘 세팅이 됐는데도 단 한명도 올라서서 시도해보지 않았다는 게 문제였다.
그렇다. 사람들은 그렇게 적극적이지 않았다. 아니, 사실 정확하게 말하면 사람들이 문제가 아니라 내 착각이 문제였다. 비를 피할 수 있는 곳 + 학교가 허락하는 장소 + 사람이 많이 다니는 곳 이라는 조합에서 그나마 가장 최적의 장소인 농생대 식당 다리 아래를 골랐는데도 사람들은 웬 이상한 물체가 있네, 하고 지나가기만 했다. 나를 비롯한 팀원들은 온갖 고생을 하고 남은건 영상 뿐이었다. 내가 의도한 바 대로 사람들은 절대 움직이지 않았다. 어쩌면 인터렉티브 아트에서는 작업 자체보다도 어떻게 사람들을 작품에 참여하게 만드느냐가 중요할 수도 있다는 것을 절실히 깨달았다.
그 다음 해, 나는 같은 전시 지원 프로그램에 지원해 거의 같은 팀원들과 함께 다른 작업을 했다. 
youtube
So if you’re thinking of an interactive artwork, don’t think of it like a finished painting or sculpture.  Think of it more as a performance. (글 중)
이 작업(사실 작업이라고 부르기도 민망한, 무언가)은 정말 단순하다. 무대용 비눗방울 기계를 3대 빌려와서 캠퍼스 곳곳에서 그냥 틀어놓았다. 하지만 사람들은 누가 뭐라고 안하고 팻말도 없어도 그냥 와서 사진을 찍고 즐겼다. 심오한 메세지도 없었고, 사실 뭐가 어떻게 될지도 모른채 재미있는거 해볼까? 해서 가볍게 시작한 작업이었다. 그런데도 전년도에 비해 인터랙션 측면에서는 대성공을 거두었다.
자신이 한 작업을 Crawford의 interactivity, Norman의 affordance 개념을 가져와서 설명하는 것은 좀 민망하고 말도 안된다고 생각하지만, 시도해보고자 한다. 그냥 푸훗, 하고 지나가주시거나 귀엽게 봐주시면 좋겠다 :)
첫 번째 작업의 경우, 식사 후 근처를 지나가는 대부분의 사람들에게 affordnace는 넘쳐난다. 60cm정도의 무대는 150kg까지도 버틸 수 있는 구조로 되어있으니 누구나 무대 위로 올라갈 수 있다. 올라가면 2.5m짜리 가벽에 매달린 빛을 손짓 한번으로 조절 할 수 있고, 웅장한 클래식의 음량을 왼손으로 가볍게 조절할 수 있다. 그럼에도 실제로 사람들과 작품의 interaction은 0이었다!! Crawford의 인터렉티비티의 개념을 가져와서 분석해 보면, listening, thinking, speaking을 고려했어야 하는데 우리는 말하고자 하는 것을 담아 stage를 만들어 놓았지만 그 방식이 잘못됐기에 사람들은 듣지 않았고, 그러므로 작가 입장에서는 listening이 없었고, 사람들 입장에서는 사실상 아무일도 일어나지 않았다. 
두 번째 작업에서는 아주 단순한 affordance 하나만 있다. 비눗방울이 여기저기서 나온다는 것. 그 외에는 원래 존재하는 환경 그대로, 평소 마주하는 일상 장면 그대로이다. 하지만 사람들은 그 차이 하나에서 흥미를 느끼고(listening), 어린시절 추억을 떠올리거나 사진을 찍어야겠다고 마음을 먹고(thinking), 함께 사진을 찍거나 인스타그램에 공유하는 등의 행동을 했다(speaking). 전부는 아니더라도 나는 그들의 행위를 다 관찰하며 마음에 담았다(listen). 심지어 사진동아리 회장이라고 자신을 소개한 어떤 분은 우리의 사진을 찍어도 좋겠느냐는 부탁을 하기도 했으며, 연락처를 교환했고 멋진 사진을 메일로 보내주셨다. 어떤 커플은 거의 영화에나 나올법한 키스신을 보여주었는데, 사진을 찍어달라 하기에 그 장면들을 잘 정리해서 보내주었다. ‘오래오래 예쁘게 사귀세요~’라는 말과 함께.
결국 인터랙션에서 가장 중요한건 어떻게 설계하고 무엇을 할 수 있느냐보다는, 어떻게 대화를, 눈빛 교환을, 하다못해 텔레파시를 시작할 수 있느냐라고 생각한다. 그 시작의 명분과 자리만 잘 만들어도 나머지는 소통 과정에서 각자의 방식으로 완성될 수 있다. 그러니 문제는 어떻게 시작하느냐이다.
Igoe가 말한 Set the stage, Shut up, Listen / Crawford의 Listen, think, Speak / Norman의 Affordance와 그것을 효율적으로 만드는 각종 기제(Signifier, Mapping, Constraints 등), 그리고 그 설계의 기저에 깔린 Conceptual Model. 이 모두는 연결되어있다. Norman이 설명한 각종 기제를 효과적으로 사용하여 Affordance를 설계하고나면 Igoe의 말대로 Shut up하고 기다리는게 작가가 할 일이다. 물론 설계 과정에서 자신의 Conceptual Model과 사람들의 Conceptual Model이 어떻게 다를지에 대한 끊임없는 고민이 필요하고, 그 갭을 좁히기 위해 노력해야 할 것이다. 과연 제품이 아니라 작품에도 그게 적용되는가? 라고 물을 수 있겠지만, 일단 작가가 특정한 인터랙션을 의도하기로 한 이상 이 과정을 거치지 않을 수는 없다. 그러므로 사실 성공적인 작업을 위해서는 좋은 제품과 마찬가지로 prototyping과 test는 필수적이다. (위의 실패작에서는 테스트가 없었다.) 그렇게 작업이 덩그러니 놓여지고 나면, 사람들이 작업의 존재를 인지하고(listen), 그로부터 think->speak ---> listen->think->speak ---> 의 사이클이 반복될 것이다. 각 관람자들은 각기 다른 방식으로 작업을 받아들일 것이며, 그에 따라 각자 다른 의미로 작업을 마음에 담고 돌아갈 것이다. 때때로 그들은 서로의 의미가 더 맞다며 싸우기도 할테고, 그 각 의미는 작가가 생전 생각해 본적도 없는 의미일 수도 있다. 그렇더라도 그 모든 대화와 충돌, 기억도 작업의 일부라고 볼 수 있지 않을까.
감히 단언하자면, 좋은 인터렉티브 아트는 교훈적인 메세지, 화려한 인터렉션, 아름다운 형태에서 비롯되지 않는다. 좋은 인터렉티브 아트는 좋은 인터렉션에서 탄생하고, 좋은 인터렉션은 작가의 끊임없는 고민과 test 없이는 탄생할 수 없다.
0 notes
needcaffeine2 · 6 years
Text
The Design of Everyday Things Ch.1
HIGHLIGHTS
- “You are designing for people the way you would like them to be, not for the way they really are.”
진짜 속이 다 시원한 말이다. 우리는 컴퓨터를 잘 못다루는 사람들을 ‘컴맹’이라고 부른다. 물론 좋은 의미는 아니다. 그리고 대부분의 컴맹은 자신이 컴퓨터를 잘 못다룬다는 사실에 대해 부끄러워한다. 컴퓨터는 좀 많이 복잡하니까 그렇다고 치자. 책상에 걸려 넘어진다던지 하는 행동들도 사실 그 사람을 비난할 것이 아니라, 그 사물을 만든 디자이너에게 책임을 돌려야 한다. 
- Great designers produce pleasurable experiences. Experience: note the word.
저자는 엔지니어들은 경험이라는건 너무 주관적이고 테스트하거나 통제할 수 없다고 생각하기 때문에 별로 좋아하지 않는다고 말한다. 하지만 좋아하는 자동차에 대해서는 소리, 마감, 재료, 심지어 냄새까지 온갖 경험적 요소를 늘어놓는다면서, 결국 디자인이 사람에게 가져다주어야 하는건 ‘좋은 경험’이라고 말한다.
Fundamental Principles of Interaction
Affordance와 Signifiers
- ’The presence of an affordance is jointly determined by the qualities of the object and the abilities of the agent that is interacting.’
저자는 affordance가 단순히 한 사물이 가진 속성이 아니라, 관계라고 강조한다. 그렇기에 저자가 소개한 이 개념이 디자이너들에게 잘못 소비되어지는 것을 한편으로는 이해하면서도, 그 해결책으로 signifier를 제시한다.
저자가 제시한 단순한 예시들로 쉽게 두 개념의 차이를 알 수 있다. 의자의 affordance는 앉을 수 있도록 지탱하는 것이다. 하지만 웬만한 성인은 의자를 들어서 옮길 수 있기 때문에, ‘앉음’ 말고도 ‘들어서 옮김’ 또한 의자가 가진 affordance가 된다. 하지만 아이의 경우 의자를 옮길 수 없기 때문에, 아이에게 같은 의자의 affordance는 ‘앉음’밖에 없다. 한편, UI디자이너가 버튼을 누르도록 유도하기위해 튀어나와 보이도록 버튼 그래픽을 디자인 한다면, 그것은 affordance가 아니다. 누른다는 행위 자체는 스크린 전체에서 유효하기 때문에, 그 중에서도 하필이면 그 버튼을 누르도록 유도하는 것은 signifier이다. 재미있던 또 다른 예시로는 책이 있는데, 책갈피를 꽂으면 앞으로 책이 얼마나 남았는지 분명하게 보이지만, ebook에서는 디자이너가 clue를 제공하지 않는 한 남은 분량을 바로 알 수 없다는 것이었다.
Mapping과 Constraints
- Natural mapping, by which I mean taking advantage of spatial analogies, leads to immediate understanding.
저자는 자연스러운 매핑은 보자마자 알아챌 수 있어야 한다고 말한다. 사실, 매핑의 개념은 주변에서 정말 쉽게 발견할 수 있는데, 가스레인지와 조절 벨브가 각각 어떤 것 끼리 매칭하는지, 거실같은 커다란 공간의 여러개 전등을 어떻게 여러개 스위치와 매칭하여 바로 알아차릴 수 있게 하는지 등이 mapping의 개념이다. 그를 보조하거나 별개로 인터랙션에 커다란 영향을 주는 constraints는, 예로, 선풍기가 아날로그 방식처럼 회전식 버튼을 달고 있더라 해도 1-2-3단의 세 단계밖에 조절하지 못하는 경우를 들 수 있다. 이는 사실 회전 속도를 자유롭게 조절하는 것보다 1-2-3단계로 제한했을 때 모터의 수명이 더 오래가고 에러가 날 확률을 줄이기 때문이라고 한다.
Feedback
- Feedback must be immediate - Too much feedback can be even more annoying than too little - Feedback has to be planned
너무 간단하다. 내가 뭔가 했으면 그 행동에 대한 반응을 보여주는 것이다. 예를들어, 엘레베이터에서 원하는 층의 버튼을 눌렀는지 불빛으로 확인시켜주지 않으면 계속해서 버튼을 누르려 할 것이다. 페이지의 끝에 다달았을 때 끝임을 알려주지 않으면 계속해서 스크롤을 내릴 것이다. 피드백은 인터렉션에서 빠질 수 없는 요소이다.
Conceptual Models
- Why did the manufacturer suggest the wrong conceptual model? We will never know.
디지털 손목시계를 생각해보라. 버튼이 4개가 있는데, 어떤 버튼을 눌러야 타이머를 실행할 수 있고, 어떤 버튼을 눌러야 시간을 조정할 수 있는지 전혀 알 수 없다. 매뉴얼을 찾아봐야만 하고, 그 매뉴얼을 제작하는 제작자의 머릿 속 시계의 Conceptual model, 매뉴얼 상에 표현된 문장, 그래픽이 나타내는 모델, 사용자의 모델은 다 미세하게나마 다르다. 그 차이가 커질수록 우리는 사용에 혼란을 겪게 된다. 또한, 옛 컨셉츄얼 모델이 다음 세대에 전달 될 때 없던 혼란이 생기는 경우도 있는데, 그 예로 대부분의 OS/프로그램의 GUI에서 저장 버튼을 ‘플로피디스크’모양으로 해놓은 것을 들 수 있다. 아마 2000년대 생 학생들은 왜 이게 저장일까?라는 질문에 대답하지 못할 것이다.
**** The goal is to produce a great product, one that is successful and that customers love. It can be done. *****
정말 빛나는 말.
내가 선정하는 interactive product는 ipod이다. affordance :  원형의 휠이 아래쪽에, 디스플레이는 위쪽에 있다. 휠은 자연스럽게 엄지로 훑을 수 있고, 4개의 방향으로는 누를 수도 있으며, 상단에는 의도하지 않은 작동을 방지하기 위한 물리적인 lock버튼이 있다.
Tumblr media
mapping : 사실 아이팟의 mapping이 좋다고는 할 수 없다. table형태로 된 화면상의 인터페이스는 휠로 조작하기에는 직관적이지는 못한 것이 사실이다. 
Tumblr media
하지만 4개의 위, 아래, 양옆 버튼을 사용해서 조작한다는 기능을 익히고 나면 나름대로 GUI와 물리적 버튼이 매칭되어 작동한다는 것을 깨닫게 된다. 사실, 아이팟 UI의 정점인 커버플로우를 넘길 때 mapping이고 뭐고 촤라락 넘어가는 그 느낌이 모든 불편함을 다 잊게 만든다.
youtube
constraints : 가장 좋은 constraints는 휠이라는 새로운 인터페이스의 활용법이다. 음악의 중간 즈음으로 탐색하기 위해서는 대부분의 mp3에서 >>를 오래 누르다가 타이밍을 맞춰 떼어야만 했는데, 아이팟은 그런 것 없이 휠을 통해 자연스럽게 원하는 부분을 찾아가기가 쉽다. 버튼을 누르는 시간을 재는 것보다는 휠을 얼마나 넘기느냐에 따라 조절하는게 사용자에게는 훨씬 쉬운 것이다.
(충격적이게도, 영상을 찾아보려 했으나 대부분의 사용자들은 여전히 << 또는 >>버튼으로 네비게이션을 작동하는 듯 했다. 초기 아이팟에는 휠로 네비게이션을 할 수 없었나?)
feedback : 스크롤을 올리다 보면 촤라라락 넘어가는 소리가 들리는데, 그 소리가 리스트의 끝에 다다르면 멈춘다. 이는 이후 아이폰에서 화면이 튕겨져 나오는 rubber band scrolling과도 맞닿아 있다.
youtube
youtube
P.S. anti-affordancef를 재치있게 활용한 작업을 소개한다. 개인적으로 취향과 맞지는 않지만, 디자인사에 기록될만한 재미있고 가치있는 작업이라고 생각한다.
Tumblr media Tumblr media
쓰레기를 버릴 수 없는 쓰레기통이다. 자세히 보니 쓰레기를 버리지 못하게 막는 뚜껑의 형태가 지구본의 모양이다. 그러니까 사실은 쓰레기통 모양의 공익광고인 셈이다. 제품이 아닌, 메세지를 가진 오브제에 가깝다. 좋은 제품이 아닌 좋은 작품.
.
0 notes
needcaffeine2 · 6 years
Text
19/3/2018 Practice report
첫 시간에 자기소개를 하면서 설문지에 들어갔던 질문.
인터렉티브 미디어 수업에서 가장 배우고 싶은건 무엇인가요? 
인터렉티브 아트쪽에서 내 능력 안에서 할수있는 건 다 해봤다고 생각하지만, 기획한 아이디어가 기술적인 제약으로 안된다는 말을 들을때 정말 답답했다. 마치 하늘을 날아다니다가 진흙탕에서 웬 덩굴이 튀어나와 나를 잡아채서 가둬놓고, 이 문제를 해결하기 전까지 날아가는건 꿈도 못꿀 줄 알아! 하는것만 같았다. 하지만 어쩌면 당연한 일이다. 아이디어는 찰나에도 나올 수 있지만 그걸 구현하는 일이 작업의 90퍼센트 이상이고, 낮선 개념이나 공부를 전혀 안해본 분야를 끌어들이기라도 하면 예상했던 작업 분량은 200퍼센트, 500퍼센트로 금세 늘어나버린다. 그게 어떤날은 심지어 화가나서 계속 찾아보고 이해도 못하는 코드를 복사해서 붙여넣기 해봤고, 중학교 체험 이후로 해본적 없는 납땜을 했고, 꼭 써보고 싶은 장비(키넥트 같은)는 돈을 모아서 아예 사버렸다. 하지만 그 모든것보다 더 알고싶은 분야가 있었으니, 하드웨어다. 내가 직접 설계하는 건 바라지도 않았고, 부품을 구글링 해서 스키메틱 이미지를 겨우 찾아도 그걸 해석하지 못했던 그 분한 기억이 되살아났다. 오늘 수업은 그 이미지를 읽을 수 있도록 문맹인 나를 구원해주는 내용이었다. 물론 완전히 이해되고 익숙해지려면 수많은 연습을 더 해야겠지만 말이다.
설명을 들어도 아직 잘 모르겠어서 일단 실물을 먼저 만져봤다.
Tumblr media
일단은 해본다.
youtube
콘솔에 값을 띄우는데, 줄바꿈( \n)을 입력하려고 하다가 이게 아닌가 싶어서 여쭤봤더니 println을 쓰면 되는거였다. 
youtube
이후 스키메틱을 연습하기위해 Fritzing을 켜고,
역시나 바로 그리지는 못하고 익숙한 실물모양 회로도를 만져본 다음 스키메틱으로 전환해봤다.
Tumblr media
어쩔수 없는 직업병(?)인지, 선을 깔끔하게 직각으로 정리하다보니 자꾸 오류가 생긴다.
Tumblr media
친절하게도 프릿징이 연결이 어디가 안됐는지 알려줬지만 어디가 잘못됐는지를 찾지 못했기 떄문에 저 회로를 갖다 버리고 다시 스키메틱에서 그리기 시작했다.
Tumblr media
겨우겨우 성공한 스키메틱 그리기!
앞으로 스키메틱에 익숙해지고 기본적인 전자공학 개념을 익히고 나면 나의 머리가 허락하는 수준에서 더 공부하도록 해야겠다. 
0 notes
needcaffeine2 · 6 years
Text
Interactive Media 변형
제목이 수상하다. ‘개선'이 아니라 ‘변형'이라고 쓴 이유는 포스트를 읽게 되면 알게 된다.
youtube
닛산은 종종 이상한 짓을 해서 프로모션을 하는데, 그 중 꽤나 오오~! 를 끌어낸 영상이다. 박수를 치면 사무실 모든 의자들이 제자리를 찾아 돌아간다. 
들리는가? 전 세계 모든 인턴들이, 신입사원들이 열광하는 소리가!
물론, 저 의자 한대의 값이 어느정도일지 대충이라도 감을 잡을 수 있는 사람이라면 열광하지 않을 것이다. 저 모든 부품들의 값이 종이만큼 싸질 그날까지, 우리는 계속 의자를 정리하고 뒷정리를 도맡아야 할 테니, 너무 흥분하지는 말자.
원래 우리가 의자를 정리하는 과정은 아래와 같다
- input : 사용자가 random상태의 의자를 잡아서 든다.
- process : 사용자가 판단하는 정해진 위치로 의자를 움직인다. 
- output : return된 의자
저 영상이 좋아보이는 이유는 input을 박수라는 아주 간단한 행위로 바꿔주었기 때문이다. 나머지는 다 의자가 알아서 한다. 물론 여기서 엔지니어들이 며칠일지 몇 주일지 모를 밤을 새서 짠 하드웨어와 코드, 테스팅에 대한 인풋은 생략되어있다. 그리고 만약 에러라도 나서 위의 기존 방식으로 의자를 움직일 경우 훨씬 무거워서 더 힘들 것이라는 조건도 생략되어있다. 아아, 닛산은 에러가 안나는 완벽한 팀이라고? 회의실에서 팀장님 부장님이 아이디어가 좋아서 박수라도 한번 탁! 치면 모두가 앉은 상태로 책상과 바짝 붙어버릴텐데, 이는 어쩐담? 스위치라도 만들어야하나?
저렇게 좋아보이는데 사실은 사기인 그런 거 말고, 아예 대놓고 사기를 치고 싶다. ‘움직이는 의자'라는 것만 가져가고, 나머지를 다 바꿔본다면 어떨까.
- input : 사용자가 의자를 잡아서 들기 위해 다가간다.
- process : 의자가 그 사용자를 인식하고 반대 방향으로 도망간다
- output : input으로 돌아간다. (loop)
간단히 말해 쫓아가면 도망가는 의자다!
아래는 테스팅 모듈 영상. 사실 현재 진행중인 프로젝트의 일부이다.
youtube
참고로, 웬만한 모든 인터렉티브 아트 / 미디어에 대한 간단한 아이디어는 검색하면 비슷한 것을 영상이나 사진으로 찾을 수 있는 듯 하다. 그런데 신기하게도 앉으려고 하면 도망가는 의자나, 무너지는 의자 등은 없었다. 물론 너무 유치해서일 수도 있겠지만, 간단하면서도 어려운 프로젝트라서 그런 것일 수도 있겠다 싶다. 
관련된 신기하고 artistic한 작품을 하나 소개하겠다. 무려 10년도 더 지난 작품! 설명보다는 영상을 직접 보시길.
youtube
0 notes
needcaffeine2 · 6 years
Text
12/3/2018 Practice report
Tumblr media
두번째 실습은 ‘우주선 인터페이스’.
왜 우주선 인터페이스일까 해서 생각해보니 
세 불빛이 나란히 반짝이다가 누르면 쪼로록 빛나는 것이 UFO에 달려있을 것만 같이 생겼다.
코드는 이러하다
Tumblr media
 if문의 등장이시다! 
처음에는 이해하지 못했던 딜레이(숫자) 도 있다. 처음 봤을때 저 250이 몇초일까 고민했었던 기억이 난다. HIGH /LOW도 있고 물론 example인 만큼 상세한 설명도 달려있다.
아래는 실행 영상! 
사실 약간의 시간이 더 있었다면 버튼을 누를 때마다 디폴트 LED가 바뀔 수 있도록 random함수를 써서 코드를 바꿔볼까 했으나 다음 스케쥴까지의 얼마 안남은 시간이 나를 압박하였다...
youtube
0 notes