뒤로

설명

캔버스 중앙에 다양한 색과 두께의 세로 줄무늬가 하나의 블록을 이루고 있습니다. 블록위치 슬라이더를 오른쪽으로 움직이면 하나의 블록이 실은 여러 개의 블록으로 분할되어 있다는 것을 알 수 있습니다. 그리고 분할된 작은 블록 들은 각자의 비율로 오른쪽 혹은 왼쪽으로 움직이면서 세로줄무늬가 재배열됩니다. 세로 줄무늬가 가로로 재배열되면서 리듬감 있는 이미지가 만들어집니다.

상호작용


스케치는 설명, 상호작용, 캔버스 세 개의 부분으로 구성되어 있습니다.

1. 설명 부분은 스케치를 열었을 때 캔버스에 그려져 있는 이미지를 설명하고, 이미지와 상호작용하는 방법을 설명합니다. 그리고 해당 관점에 기초해서 스케치가 만들어진 의도를 담고 있습니다.

2. 캔버스 부분은 이미지를 보여주는 부분입니다. 상호작용을 통해 변화하는 이미지를 확인할 수 있습니다.

3. 상호작용 부분은 캔버스에 보이는 이미지와 상호작용하는 부분입니다. 상호작용하는 방법은 스케치마다 다릅니다. 상호작용하는 방법은 캔버스에 직접 상호작용, 슬라이더, 상태 선택, 버튼 이렇게 네 가지 종류가 있습니다.

3_1. 캔버스에 직접 상호작용은 스케치마다 방법이 다르기 때문에 글로 설명되어 있습니다.
3_2. 슬라이더는 두 개의 값 사이를 조절할 때 사용합니다.
3_3. 상태 선택은 두 가지나 세 가지 모드 중 하나를 선택할 때 사용합니다.
3_4. 버튼은 새로운 색상이나 새로고침과 같이 한 번 입력할 때 사용합니다.
3_5. 이미지 저장 버튼은 모든 스케치의 상호작용 부분의 마지막에 위치해 있습니다. 이미지 저장 버튼을 누르면 현재 캔버스에 보이는 이미지를 본인의 컴퓨터에 png파일로 저장합니다.