[논문 리뷰] A visual programming language for drawing and executing flowcharts

Drazen Lucanin, Ivan Fabek|arXiv (Cornell University)|2012. 02. 10.

Model-Driven Software Engineering Techniques참고 문헌 11인용 수 5

한 줄 요약

이 논문은 Eclipse IDE 기반의 시각적 프로그래밍 언어인 vIDE를 제안한다. vIDE는 GMF 프레임워크를 사용하여 구현되며, 사용자가 플로우차트를 설계하면 자동으로 가독성 있는 파이썬 코드로 변환된다. OCL을 활용한 실시간 제약 조건 검사와 GOTO-to-WHILE 변환 알고리즘을 통해 문법적 정확성과 의미적 명확성을 확보함으로써, 시각적 알고리즘 설계를 통한 프로그래밍 학습에 유용하고 사용자 友好的한 환경을 제공한다.

ABSTRACT

With recent advances in graphical user interfaces, more and more tasks on computers have become easier to perform. Out of the belief that creating computer programs can also be one of them, visual programming languages (VPLs) have emerged. The goal of VPLs is to shift a part of work from the programmer to the IDE so that the programmer can focus more on algorithm logic than the syntax of the implementation programming language. In this article, the methods required to build a VPL are presented, with an emphasis on a novel method of code generation in a WHILE language. Also, the methods for achieving basic principles of VPLs will be shown - suitable visual presentation of information and guiding the programmer in the right direction using constraints. These methods are demonstrated on an example of vIDE, a VPL based on the Eclipse integrated development environment (IDE). The design of vIDE with respect to the Eclipse Graphical Modeling Framework (GMF) is described. The concept of a flowchart graphical notation is examined in contrast with the algorithm model it maps to. Finally, the disambiguity of the model representation of an algorithm is discussed and the methods for transforming it to an actual implementation in a programming language.

연구 동기 및 목표

• 사용자가 플로우차트를 통해 알고리즘을 시각적으로 설계할 수 있도록 프로그래밍의 진입 장벽을 낮추기 위해.
• 시각적 플로우차트 표현으로부터 자동으로 정확하고 가독성 있는 파이썬 코드를 생성하는 시스템을 개발하기 위해.
• 실시간으로 OCL을 사용하여 문법적 및 구조적 제약 조건을 검사하고 설계 중에 잘못된 프로그램 구조를 방지하기 위해.
• 시각적 프로그래밍에서 전통적 코딩으로의 매끄러운 전환을 지원하기 위해 생성된 소스 코드를 노출하기 위해.
• 기존 연결 상태에 기반해 여분의 옵션을 동적으로 숨기는 등의 지능형 UI 추론을 통해 사용성 향상시키기 위해.

제안 방법

• vIDE 시스템은 플로우차트 모델링 및 렌더링을 위해 Eclipse Graphical Modeling Framework(GMF)를 사용한 Eclipse 플러그인으로 구현된다.
• 플로우차트는 구조화된 WHILE 언어의 트리 구조의 추상구문나무로 모델링되어, 알고리즘을 모호하지 않게 표현할 수 있다.
• GOTO-to-WHILE 변환 알고리즘은 뒤로 가는 연결을 식별하여 플로우차트 내의 루프를 탐지하고, 루프 코드 생성을 가능하게 한다.
• 코드 생성은 추상구문나무의 전위 순회를 통해 수행되며, 각 명령어가 해당하는 파이썬 구문으로 매핑된다.
• 객체 제약 언어(OCL)는 실시간으로 문법적 및 구조적 제약 조건(예: 자기 자신으로의 연결 금지)을 정의하고 강제 적용한다.
• 지능형 UI 추론은 자바로 구현되어 사용자 의도를 추론한다(예: 하나의 선택지가 선택된 후 '참/거짓' 선택지 중 하나를 숨기는 등), 이는 뷰어의 혼잡함을 줄인다.

실험 결과

연구 질문

• RQ1 시각적 플로우차트 생성과 정확한 코드 생성을 동시에 지원할 수 있는 시각적 프로그래밍 환경은 어떻게 설계할 수 있는가?
• RQ2 플로우차트 작성 중에 실시간으로 문법적 및 의미적 제약 조건 검사를 보장할 수 있는 메커니즘은 무엇인가?
• RQ3 시각적 프로그래밍 도구는 사용자 의도를 어떻게 추론하고 동적 UI 적응을 통해 인터페이스 복잡성을 줄일 수 있는가?
• RQ4 플로우차트 표현이 어떻게 명확하게 구조화된 프로그래밍 언어(예: 파이썬)로 변환될 수 있는가?
• RQ5 생성된 소스 코드를 노출함으로써 시각적 프로그래밍 환경이 전통적 프로그래밍으로의 전환을 얼마나 효과적으로 지원할 수 있는가?

주요 결과

• vIDE 시스템은 사용자가 그린 플로우차트로부터 정확하고 인간이 읽을 수 있는 파이썬 코드를 성공적으로 생성한다. 유클리드 알고리즘을 통해 이를 검증하였다.
• OCL를 통한 실시간 제약 조건 검사를 통해 자기 연결과 같은 잘못된 구조를 방지함으로써 사용성 향상과 오류 예방이 가능해졌다.
• GOTO-to-WHILE 변환 알고리즘은 뒤로 가는 연결을 탐지함으로써 플로우차트 내의 루프를 정확히 식별하고, 적절한 WHILE 루프 생성을 가능하게 하였다.
• 지능형 UI 추론은 예를 들어 '참' 분기 이미 존재할 경우 '거짓' 선택지를 생략함으로써 의미적으로 중복되는 옵션을 동적으로 숨김으로써 뷰어의 시각적 혼잡함을 줄였다.
• 생성된 파이썬 코드를 노출함으로써 시스템은 시각적 프로그래밍에서 텍스트 기반 프로그래밍으로의 매끄러운 교육적 전환 경로를 제공한다.
• GMF와 OCL의 통합은 시각적 모델링과 형식적 제약 조건 검증을 모두 지원하는 견고하고 확장 가능한 프레임워크를 가능하게 하였다.