지난 수년간 Blockly 및 Blockly Games팀은 많은 교훈을 얻었습니다. 새로운 블록을 개발하는 데 적용할 수 있습니다. 다음은 Google이 저지른 실수의 모음 또는 다른 사람이 흔히 범하는 실수를 모은 것입니다.
이러한 교훈은 Google에서 Blockly의 시각적 스타일과 다양한 기술을 사용하여 일부 사용 사례나 디자인에 적용되지 않을 수 있습니다. 다른 솔루션도 있습니다. 이것은 사용자가 겪을 수 있는 문제의 전체 목록이 아니며 있습니다. 모든 사례는 조금씩 다르고 장단점이 있습니다.
1. 조건문과 루프 비교
신규 사용자에게 가장 어려운 차단은 조건문과 루프입니다. 여러 항목 블록 기반 환경은 이러한 두 블록을 동일한 '컨트롤'으로 그룹화합니다. 카테고리에 속하며, 두 블록 모두 모양과 색상이 동일합니다. 이 때문에 신규 사용자가 두 블록을 혼동하기 때문에 종종 짜증이 날 수 있습니다. Blockly는 조건문과 루프를 별도의 'Logic'으로 이동하도록 권장함 및 '루프' 카테고리마다 각기 다른 색상으로 표시됩니다. 이렇게 하면 이들은 모양은 비슷하지만 다르게 동작하는 고유한 아이디어입니다.
권장사항: 조건문과 루프를 별도로 유지하세요.
2. 단일 기반 목록
초보 프로그래머는 처음에 0부터 시작하는 목록을 발견하면 형편없이 있습니다. 그 결과 Blockly는 Lua와 Lambda Moo의 리드를 1부터 시작하는 문자열 색인 생성입니다.
Blockly의 고급 사용을 위해, 0 기반 목록을 사용하여 더 쉬워졌습니다. 젊거나 초보 시청자용 단일 기반 색인 생성을 사용하는 것이 좋습니다.
권장사항: 1은 첫 번째 숫자입니다.
3. 사용자 입력
사용자로부터 매개변수를 가져오는 방법에는 세 가지가 있습니다. 드롭다운은 제한적이며 간단한 튜토리얼과 연습에 적합합니다. 입력란 자유로움을 더하고 더 많은 창의적인 활동에 적합합니다. 값 블록 입력 (일반적으로 섀도 블록 포함)은 값을 계산할 기회를 제공합니다. (예: 임의 생성기)를 사용해야 합니다.
권장사항: 사용자에게 적합한 입력 방법을 선택하세요.
4. 라이브 블록 이미지
블록 관련 문서에는 참조 중인 블록의 이미지가 포함되어야 합니다. 있습니다. 스크린샷은 쉽게 찍을 수 있습니다. 하지만 이러한 이미지가 50개 있고 50개 언어로 번역되었는데, 갑자기 2,500개가 만들 수 있습니다 그런 다음 색 구성표가 바뀌고, 2,500개의 이미지를 업데이트해야 합니다. -- 다시.
악몽 같은 유지관리 업무에서 벗어나기 위해 Blockly Games는 읽기 전용 모드에서 Blockly 실행 인스턴스가 포함된 모든 스크린샷 결과 사진과 동일하게 보이지만 최신 상태를 유지합니다. 읽기 전용 국제화가 가능해졌습니다.
권장사항: 2개 이상의 언어를 지원하는 경우 읽기 전용 모드를 사용하세요.
5. 또 다른 좌파
미국 어린이의 피드백 (흥미롭게도 다른 나라의 아동은 아님) 왼쪽과 오른쪽 사이의 혼란이 만연하다는 것이 밝혀졌습니다. 이 문제는 화살표가 추가되었습니다. 방향이 상대적 (예: 아바타)인 경우 중요합니다. A → 직선 화살표 또는 ↱ 회전 화살표가 혼동됨 아바타가 반대 방향을 향하고 있을 때 발생합니다. ⟳ 원형이 가장 도움이 됨 사용할 수 있습니다.
권장사항: 가능하면 텍스트를 유니코드 아이콘으로 보완하세요.
6. 상위 수준 차단
가능하다면 더 높은 수준의 접근방법을 사용해야 합니다. 유연성을 발휘할 수 있습니다 다음 Apps Script 표현식을 살펴보겠습니다.
SpreadsheetApp.getActiveSheet().getDataRange().getValues()
모든 잠재적 기능이 보존되는 1:1 매핑에서 위 표현식은 4개의 블록을 사용하여 작성됩니다. 하지만 Blockly는 더 높은 수준의 전체 표현식을 캡슐화하는 하나의 블록을 제공합니다. 목표는 나머지 5% 가 더 어려워지더라도 95% 사례에 맞게 최적화하도록 선택할 수 있습니다 Blockly는 텍스트 기반 언어를 대체하기 위한 것이 아니며, 이는 사용자가 초기 학습 곡선을 넘어서서 텍스트 기반 언어를 지원합니다.
권장사항: 맹목적으로 전체 API를 블록으로 변환하지 마세요.
7. 선택적 반환 값
텍스트 기반 프로그래밍의 많은 함수는 작업을 수행한 다음
나타냅니다. 이 반환 값은 사용될 수도 있고 사용되지 않을 수도 있습니다. 예를 들어 스택의
pop() 함수를 사용하세요. 마지막 요소를 가져오고 삭제하기 위해 Pop을 호출할 수 있습니다.
또는 반환 값이 있는 마지막 요소만 삭제하기 위해 호출할 수 있습니다.
무시됩니다.
var last = stack.pop(); // Get and remove last element. stack.pop(); // Just remove last element.
블록 기반 언어는 일반적으로 반환 값을 무시하는 데 적합하지 않습니다. 가 value 블록은 값을 허용하는 것에 연결해야 합니다. 현재 이 문제를 해결할 수 있는 몇 가지 전략이 있습니다.
a) 문제를 우회합니다. 대부분의 블록 기반 언어는 이러한 경우를 방지할 수 있습니다 예를 들어, Scratch에는 부작용과 반환 값이 모두 포함됩니다.
b) 두 개의 블록을 입력하세요. 도구 상자의 공간이 문제가 아니라면 간단한 해결책은 이러한 유형의 블록을 하나씩 두 개의 사용할 수 없습니다. 단점은 검색 결과에 혼동을 야기할 수 있다는 것입니다. 거의 동일한 블록이 많이 있는 도구 상자입니다.
c) 하나의 블록을 변경합니다. 드롭다운, 체크박스, 기타 컨트롤을 사용하여 사용자가 반환 값의 존재 여부를 선택할 수 있습니다. 블록 옵션에 따라 모양을 변경합니다. 그 예로 차단될 수 있습니다.
d) 값을 먹습니다. App Inventor의 첫 번째 버전은 특별한 파이프를 만들었습니다. 차단될 수 있습니다. 사용자가 개념을 이해하지 못함 두 번째 버전의 App Inventor는 파이프 블록을 제거하고 대신 일회용 변수에 값을 할당하기만 하면 됩니다.
권장사항: 각 전략에는 장단점이 있으므로 적합한 전략을 선택하세요 확인할 수 있습니다
8. 늘어나는 블록
특정 블록에는 가변적인 수의 입력이 필요할 수 있습니다. 예시: 임의의 숫자 집합을 합산하는 덧셈 블록 또는 if/elseif/else 임의의 elseif 절 집합으로 블록 생성 또는 목록 생성자 초기화된 요소의 임의 개수입니다. 여러 가지 전략이 있는데 각각 장단점이 있습니다
a) 가장 간단한 접근 방식은 사용자가 더 작은 크기의 블록으로 블록을 구성하도록 하는 것입니다. 있습니다. 두 개의 숫자를 중첩하여 세 개의 숫자를 더하는 것을 예로 들 수 있습니다. 추가할 수 있습니다. 또 다른 예는 if/else 블록만 제공하는 것이고 사용자가 이를 중첩하여 elseif 조건을 생성하도록 합니다.
이 접근 방식의 장점은 초기의 단순성입니다 (사용자와 개발자에게 문의) 단점은 CPU 사용률이 낮거나 매우 번거로워지고 사용자가 할 수 있습니다
b) 대안은 항상 1개가 되도록 블록을 동적으로 확장하는 것입니다. 끝부분에 자유롭게 입력할 수 있습니다. 마찬가지로 0이 있는 경우 블록은 마지막 입력을 삭제합니다. 마지막에 두 개의 무료 입력이 있습니다. 이것이 바로 App Engine의 첫 번째 사용된 앱 인벤터입니다.
자동으로 증가된 블록은 앱 인벤터의 사용자가 몇 명은 싫어했습니다. 몇 가지 이유가 있습니다. 첫째, 항상 자유로운 입력이 있었고 프로그램은 'complete'입니다. 둘째, 스택 중간에 요소를 삽입하는 것은 편집본 아래에 있는 모든 요소의 연결을 해제하고 가상 머신을 다시 연결합니다 하지만 순서가 중요하지 않고 사용자가 이 방법은 매우 편리한 옵션입니다.
c) 구멍 문제를 해결하기 위해 일부 개발자는 구멍이 있는 블록에 +/- 버튼을 추가하여 수동으로 입력을 추가하거나 삭제합니다. Open Roberta는 이러한 두 개의 버튼을 사용하여 하단에서 입력을 삭제할 수 있습니다. 다른 개발자는 각각에 두 개의 버튼을 추가합니다. 스택의 중간에서 삽입 및 삭제가 있습니다. 다른 업체는 각 행에 위/아래 버튼을 두 개 추가하여 수용할 수 있습니다.
이 전략은 블록당 단 두 개의 버튼부터 한 행당 버튼을 4개까지 추가할 수 있습니다. 한 쪽 끝에는 사용자가 방심하지 않고 작업을 수행할 수 있도록 하는 데, 다른 쪽 끝에는 UI가 우주선 엔터프라이즈의 다리처럼 보이는 버튼입니다.
d) 가장 유연한 접근 방식은 블록에 뮤테이터 버블을 추가하는 것입니다. 이 구성 대화상자가 열리는 단일 버튼으로 표시되며 차단될 수 있습니다. 엘리먼트를 원하는 대로 추가, 삭제 또는 재정렬할 수 있습니다.
이 접근 방식의 단점은 돌연변이자가 직관적이지 않다는 점입니다. 있습니다. 뮤테이터를 도입하려면 일종의 지시가 필요합니다. 어린 아동을 대상으로 하는 블록 기반 애플리케이션에는 뮤테이터를 사용하면 안 됩니다. 일단 배운 것은 고급 사용자에게 매우 중요합니다.
권장사항: 각 전략에는 장단점이 있으므로 적합한 전략을 선택하세요 확인할 수 있습니다
9. 클린 코드 생성
Advanced Blockly 사용자는 생성된 코드 (JavaScript, Python, PHP, Lua, Dart 등)를 사용하고, 작성한 프로그램을 즉시 인식할 수 있습니다. 즉, 기계 생성 코드를 유지하기 위해 추가 작업이 필요 있습니다. 불필요한 괄호, 숫자 변수, 잘린 공백 및 상세 코드 템플릿은 모두 우아한 코드를 생성하는 데 방해가 됩니다. 생성된 코드에는 주석을 포함해야 하며 다음 사항을 준수해야 합니다. Google 스타일 가이드
권장사항: 생성된 코드를 자랑하세요. 사용자에게 보여주세요.
10. 언어 의존성
깨끗한 코드를 원하는 경우의 부작용은 Blockly의 동작이 크게 크로스 컴파일된 언어가 동작하는 방식의 측면에서 정의됩니다. 가장 일반적인 출력 언어는 JavaScript이지만, Blockly가 크로스 컴파일한다면 다른 언어로 된 배포판에 포함된 저작권 지침의 준수 여부를 두 언어에서 모두 정확하게 동작합니다. 예를 들어 자바스크립트에서 빈 문자열은 false인 반면 Lua에서는 true입니다. 인코더-디코더 아키텍처를 대상 언어에 관계없이 블록리의 코드가 GWT 컴파일러에서 생성된 것처럼 보이는 유지 관리가 불가능한 코드가 생성됩니다.
권장사항: Blockly는 언어가 아닙니다. 기존 언어가 영향을 줄 수 있습니다