뒤로

설명

캔버스에 하나의 격자가 그려져 있고, 격자는 가로, 세로 일정한 간격으로 규칙적으로 나눠져 있습니다. 격자의 각각의 세로축을 확인해 보면 맨 위와 아래 영역이 두 개의 다른 색으로 되어있고 사이의 영역들은 두 색의 사이의 색들을 채워져 있습니다. ‘모드 2'를 선택하면 각각의 세로축이 나눠지는 개수가 불규칙해지지만 개수에 따라 나눠지는 영역의 높이는 여전히 일정합니다. ‘모드 3'를 선택하면 영역의 높이마저 불규칙해지면서 전체 이미지가 불규칙해집니다.

상호작용

모드 1 : 동일한 개수, 동일한 간격
모드 2 : 임의의 개수, 동일한 간격
모드 3 : 임의의 개수, 임의의 간격


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

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

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

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

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