VicPy | 프로세싱 - 삼색 LED 제어하기
본문
※ 영상을 선명하게 보기 안내
- 유튜브 영상에서 오른쪽하단에 톱니바퀴를 클릭합니다.
- 팝업목록에서 "품질" 선택하세요.
- 원하는 해상도를 선택해주세요.
※ 모바일에서 Wifi가 아니라면 데이타가 소진될 수 있으니 주의바랍니다.
VicPy님의 아두이노강의 청각장애인을 위한 자막
de 5
안녕하세요 이번시간에는 3 섹 led 를 이용해서 프로세싱 에서 제어하는것을 해 보도록 하겠습니다
혹시 필리스 휴 라는 제품을 보신 적이 있으신가요
필리스 효 라는 제품은
여러분들이 스마트폰에서 손으로 드래그해서 원하는 색을
형광등을 led 등에서 색깔의 표시가 되도록 하는 제품입니다
여러분들도 여러분들이 가지고 있는 아두이노 와 3색 led 를 가지고
이아 거의 똑같은 것을 만들어 낼 수 있는데요 이번 시간에는 하나하나
살펴보면서 필리스 휴 와 같은 것을 구현해 보도록 하겠습니다
먼저 프로세싱 을 이용해 키보드로 3색 led 에 색을 바꾸는 것을 해
보도록 하겠습니다
여러분들이 키보드 r g b
그리고 또 c 를 통해서 아 를 입력하면 빨간색이 증가하고
뒤로 입력하면 초록색의 증가하고 b 를 입력하면 파란색의 증가하고 또
실의 누르면 다시 모든 색이 초기화가 되도록 해서 제어하는 것을 해
보도록 하겠습니다
재료는 3세계 립이 하나가 필요하고요
회로도는 이와 같이
그라운드에 해당되는 부분을 3세에게 립 이에 그라운드 라고 표시돼 있는
부분에 연결 해주시구요
그리고 압박 10 11 봐
10번 9번 핀을 3색 led 에 빨강 초록 파랑 바로 이제 영어로 숫자
영어로 한글자도 rc b 라고 표시가 되어 있었는데 rgb 에 연결해
주시면 됩니다
바로 플러싱 코드를 보도록 하겠습니다
프로세싱 에서는 아두이노 라이브러리를 사용할 거고요
기본적으로 아두이노 라이브를 뒤에 대한 필요한 설정에 대한
라이벌의 선언과 변수를 입력해 주시고
아 이집 이는 빨강 초록 파랑의 현재 상태 값을 저장하기 위해서 설정에도
변소 드리고요
레드 핑크 림 p 블루핀 2 빨강 파랑 초록 을 제어하는 핀 들에 대한
정보를 입력한 것입니다
그리고 현재 배경 색깔을 그냥 rgb 로 한번 총이 초기화 시켜 줬는데
이 같은 경우에는 이제 배경색이 검은색의 되겠죠
밑에는 이제 기존의 아두이노 라이벌을 사용하는가 동일하구요
드로 쪽에 한번 살펴보도록 하겠습니다
키 프레스드 변수를 이용해서 여러분들이 만약에 기보 dp 를 입력하면 은
극히 값을 기준으로 수 이치 문에서 이제 한번 걸러 내게 됩니다
그래서 알을 입력한 경우 쥐를 입력한 경우 b 를 입력한 경우 또는 실외
입력한 경우로 나눠서 이렇게 작동하게 됩니다
a 입력한 경우에는 아까 설정에 2 어떠한 이라는 변수 빨강을 있는 빨
방에 대한 정보 값을 하는 앓이 라는 변수를 증가시키고 r 값이 255
를 넘지 않도록 이렇게 설정에 는 것을 보실 수가 있고요
마찬가지로 치 b 도 동일하게 된 되어 있는 것을 볼 수가 있습니다
c 를 보시면 은 좀 특이하게 되어 있는 것을 볼 수가 있는데
알코올 칩이 코비 콧 0 이라고 적혀있는 것을 볼 수가 있습니다
이건 컴퓨터에서는 이제 오른쪽부터 왼쪽으로 이동 되면서 코드가 익히는데
0이라는 값이 비해 할 땅이 되고 b 라는 값이 다시 주의해야 할당되고
쥐 라는 값이 다시 아래 할당됩니다
결국에는 영입이 의 입력해서 b 가 0이 되고 b 의 영이 있기 때문에
지구 또한 0이 되고
뒤에 0이 있기 때문에 r 또한 여기 된다고 보시면 됩니다
이렇게 변경된 알가 쥐 아비의 대한 변수 값을 각각 레드 핀 의 ir
그림 핀의 쥐 블루핀 의 b
아날로그 라이트 를 설정해 주시면 은 이제 아두이노 쪽에서
3색 led 에 값이 변경되고 요 다시 그것을 화면에 표시해 주게 해서
백그라운드 함수를 메서드를 이용해서 알지 필요 출 해줍니다
그리고 같은 것은 천 분 100분의 1초 단위로 변경 되도록
설정되어 있습니다
한번씩 좀 확인해 보도록 하겠습니다
고대 를 실행하시면 요
처음에 어두운 색으로 되어 있지만은
제가 를 한번 누르고 있으면 은 화면이 빨간 스케 변환과 동시에
3색 led 에 색깔도 빨간색을 변하는 것을 볼 수가 있죠
여기다가 b 를 눌러서 섞어주시면 은 화면에 보라색의 되는 것처럼 3색
led 에 색깔도 보라색으로 변하는 것을 볼 수가 있습니다
다시 설정 하기 위해서 씨를 한번 눌러주시면 은 led 가 꺼지면서
화면에 색깔도
검정 으로 바뀐 것을 볼 수가 있습니다
이제 프로세싱 으로 아 2인의 3색 led 를 제어하는 것을 해 보았구요
다음으로는 이제
어떤 이미지를 화면에 표시 한 다음에 그 이미지의 특정 부분에 있는 색깔
정보를 얻어오는 곳에 회복합니다
이거 왜 하냐면 은 어떤 사진을 불러온 다음에 사용자가 그 사진의 특정
부분을 손으로 선택을 하면 은 그 특정 부분 의 색깔 정보를 얻어서 바로
이제 삭 그쪽 led tv 색깔을 바꾸게 하거든요
따라서 우리도 여기서 색깔 정보를 얻어 온 다음에
색 3색 led 색깔을 바꿔 주기 위해서 한번 특정 사진을 놓고 그
사진에서 색깔 정보를 없는 것을 한번 해보도록 하겠습니다
여기서는 준비된 사진의 야 마치 표시를 해 주었구요
프로세싱 코드를 살펴보겠습니다
여기서는 준비된 사진의 이름은 레인보우 점 jpg 라고 저장해 두었습니다
저장된 멤버 첫 jpg 를 img 라고 해가지고 p 이미정 변수로
불러오는 것을 해주고 그 다음에
불러온 다음에 윈도우의 창 크기를 ing 적 미드 img 천 헤이트 라는
것을 입력을 해 줘서
이 이미지의 넓이 랑이 미제 높이 값으로 윈도우 창에 크기를 설정 하도록
해 두었습니다
그리고 백그라운드 한 다음에 img 를 입력하면 은 이 이미지가 바로
윈도우 창 의 대경 이 되도록 설정 하는 겁니다
드로 에서는 별도의 코드는 없고 마우스 드래그 들을 보시면은
칼라가 c 하시고 깨끗이 있는 이렇게 메소드를 사용 하시는 것을 볼 수가
있습니다
이게 시라는 메서드 는
설명을 드리면 은 바로 특정 위치에 있는 색깔 정보를 불러오는 함수입니다
예전에 칼라는 함수가 탈라 라는 칼라용 데이터를 초기화 하는 함수 였다면
게시 라는 것은 x 좌표와 y 좌표 를 통해서 그 좌표에 있는
픽셀이 라고 하죠 픽셀의 색깔 정보를 불러오는 함수입니다
바로 마우스 x 마우스 커서 x 좌표 마우스 y y 좌표가 여기서
x-fi 좌표 넘어가게 되고요
이렇게 넘어온 정보가 c 에 저장되며 는 여기서 이제 그 정보를 다시
분석하는 것들이 나오는데
바로 레드 그린 블루 라는 함수 입니다
2 레드 그린블루 라는 함수는 각각 그 컬러 0 변수에서
레드 바로 빨강의 해당되는 값 녹색의 해당 되는가
파랑에 해당되는 값이 어느 정도인지 불러오는 함수입니다
따라서 지금 같은 경우에는 프린트 ln2 이제 문자를 찍어 내는 건데
레드 라고 적고 레드 암소를 적은 값을 통해서 이제 빨간 각도 찍어주고
그린 이라고 적고 그린이나 함수를 통해서 녹색 값을 찍어주고
불루 라고 적고 블루 함수를 통해서 파랑 값을 찍어주는 것을 볼 수가
있을 겁니다
한번 코드를 실행해 보도록 하겠습니다
코드를 실행 화면은 이렇게 사진이 표시된 것을 볼 수가 있죠
그 다음에 마우스를 드래그 하시면 은
여기 콘솔 부분에 네드 그린블루 라고 적혀있는 것을 볼 수가 있습니다
만약에 이제 파란 부분 에 가시면 은 블루 가스 좀 더 높이 올라가 있는
것을 볼 수가 있죠
만약에 좀 빨간 부분에 하시면은 레드 부분이 증가되는 것을 볼 수가 있고
이와 같이 이미지에서 특정 픽셀의 칼라 정보를 불러오는 것을 한번
해보았습니다
이번에는 좀더 본격적으로 2를 엮어서
여러분들이 마우스를 움직임 하는 그 마우스 움직임 권의 색깔을 바로 3색
led 의 색깔 변경 하는 것을 한번 해보도록 하겠습니다
먼저 여러분들의 앱이 d 에 색깔을 바꾸기 위해서 그냥 사진을 이용하면
은 색깔이 표시가 잘 안되기 때문에
뭐 칼라 피커 라고 하죠 여러분들이 색깔을 볼 수 있는 테이블을 만들
건데
기존의 있는것을 사용하는게 아니라 랜덤하게
칼라 그 색깔 표가 생성되도록 한번 해 보고요
그 다음에 이 색깔 표 위에서 마우스를 드래그하면 은 해당 커서 에 있는
색깔이
3 세계 빅 2 의 에 빛이 나도록 한번 해보도록 하겠습니다
바로 프로세싱 코드를 보시면 은
앞에 봤던 것처럼 이제 아두이노 라이벌 유리를 사용하는 것은 동일 하고요
그 다음에
3 각 부분에서 윈도우 크기 설정하시고
여기서 선을 사용 업 태 도리를
그리는 것을 사용 안 할 보기 때문에 노트 워크 라는 명령어를 사용해
주시고
여기서 난수를 쓸고 쓸 거기 때문에 마찬가지로 랜덤 씨드
그 랜덤 cd 에 특히 값은 세컨드 라는 함수를 통해서 해주시고 또 여기
밑에 보시면 은
반복문 인데 이중으로 되어있는 것을 볼 수가 있어요
여기서는 폼은 인데 하나는 아이를 카운터로 하고 하나는 제의를 카운터로
하는데 바로 이런 식으로 되어 있는 이유는 이렇게 저희 창에 크기가
정사각형으로 되어있다면 은 앞의 봤던 것처럼
각 직사각형 들이
20개가 총 20주 리도록 만들어 주기 위해서 다음과 같이 이중 반복문을
사용한 겁니다
따라서 이의 중반 본문은 아내인 아 20 숨어 반복하는 반복문이
또다시 숨어 반복하기 때문에 곱하기 20 20 곱하기 10 때서 402
되게 됩니다
여기서 보시면은
음 가장 안쪽에 있는 반복문을 보시면은 필 하신다음에 랜덤 함수를
이용해서
면의 색깔을 설정 하는 것을 난수를 설정 하는 것을 볼 수가 있죠
그 다음에
i j 를 통해서 이제 사각형을 그리는 데
아이 곱하기 10 제 2 곱하기 10 i+1 곱하기 10
제 1+1 곱하기 10 서 처음에 이제 반복문이 실내악 되는 것을
간단하게 한번 설명을 드리면 은
아이가 지금 처음에 0부터 시작 하잖아요 보면 영이 까는 0 부터
시작하며 는
그리고 제이도 0부터 시작하는 전에요 제가요 봄부터 시작하니까 는
여기는 연구 파기 0 0 곱하기 20 연구 파기 싶어서 연구 파경 한
다음에
i+1 이니깐 의 20 20 에서 현재 여기 사각형의 그려지게 되구요
그 다음에 또 마찬가지로 아이는 안 바뀐 상태에서 제일 많 바뀌니까 는
여기 사각형이 그려지게 되겠죠 사각형을 불려 나가게 된 것이 이제
최종적으로
앞에서 보셨던 것처럼 이와 같은 화면이 보여지게 됩니다
다시 코드를 한번 살펴보시면 은 들어온 중에서는 이제 별도로 코드를
사용하지 않고요
여기서도 마우스 트레이드를 사용하는데 마우스 드래그 드
만약 사용 여러분들이 마우스를 드라이빙 하시면은
해당되는 마우스 좌표에 픽셀 정보 값을 c 로 얻으시고
불씨로 얻은 것을 레드 그린블루 라는 함수를 통해서
값을 얻어서 다시 각 빨간 레드 핀 블루핀 1 레드 크림 핏 블루핀
에다가 보내주는 것을 볼 수가 있습니다
또 지금 레드 그리 블루 를 사용했을때 실수 형태로 값이 들어오기 때문에
인트를 통해서 정수로 변환 해 주었죠
실제 코드를 실행 해서 한번 확인해보도록 하겠습니다
화면을 보면 이와 같은 색깔 칼라 피커 라고도 하는 이 제 색깔을 선택할
수 있는 표가 생겼죠
만약에 껐다가 다시 실행을 하시면 은
랜덤으로 하기 때문에 아까와는 다른 색깔 구조로 되어 있는 것을 볼 수가
있습니다
여기서 한번 마우스를 파란색 쪽에서 들에게 하시면은
3색 led 가 파란색의 됐고 다시 드래그해서 초록색 부분을 화면은
ng 가 초록색을 됐고 노란색을 되면 노란색이 됐고
다양한 세운 되면 빨간색의 됐죠
좀 아쉬운 점은 무엇이냐 며 는 저희가 사용하는 3세계 리가
좀 값이 싼 것이기 때문에 기존의 필리스 휴 와 같이 색깔이 좀 더
풍부하게 나오지는 않습니다 하지만 그래도 여러분들이 선택하는 세계 어느
정도 b비슷하게 표시가 되는 것을 볼 수가 있습니다
이번 시간에는 3 세계 리드를 아두 있는 연결해서 사진과 사진에서 특정
정보를 분석해서 그 색깔을
사진이나 이미지 색깔을 3색 led 표시 하는 것을 해 보았는데요
단순히 그냥 아무 사진니라 여러분들이 소중하게 생각한 사진이나
여러분들이 조항 연예인 사진이나 아니면 풍경 사진들로 바꿔서 한번 색깔
정보를 읽어와 사는 것으로 한번 수정 해 보시고요
또 지금은 마우스 드래그 이벤트 를 사용했지만
마우스 드래그 이벤트가 생각 마우스 부부나 다른 이벤트를 통해서도 한번
재미나게 수정 해 보시기 바랍니다
이번 시간에는 여기서 마치도록 하겠습니다 감사합니다
댓글 0개
등록된 댓글이 없습니다.