論説

ソフトウェア開発プロセスの体得方法としてのプログラミングによる動画制作

中 島 豊四郎
松 山 智恵子
岩 田 員 典1 . はじめに
近年､ 大学におけるプログラミング教育は理系学部にとどまらず､ 文系の様々な学部において情報教育の中の一つの科目として実施されている｡ このように
プログラミング教育が一般化している中にあって､ 教育を受ける側の学生の中には､ プログラミングに興味を持たない者も多々見受けられ､ そのため魅力あるプログラミング教育のための種々の試みがなされている1-6｡ 一方､ プログラ
ミングは､ ソフトウェア開発の一つプロセスであるものの､ この視点に立った
プログラミング教育までには至っていない｡
筆者も担当している文系女子学生のプログラミング教育において､ プログラ
ミングに興味を持たせるため理系的題材に代えて､ アニメーション的動画を題材に取り入れることによって､ 履修者が積極的にプログラミングに取り組みことができることを明らかにしてきた7-9, 11｡ また､ 履修者のプログラム作成力の定量的評価について提案した10, 11｡ しかし､ プログラミングがソフトウェア開発の一つプロセスであることを､ 動画制作を通して体得できることについては― 65 ―

言及していなかった｡ そこで､ ここではプログラミングによる動画制作がソフ
トウェア開発の一つプロセスであることを体得させることができることについて述べる｡

2 . プログラミング演習の目的と概要
2. 1

プログラミング演習の目的

プログラミングが初めてである文系女子学生に対して､ 事務系､ 制御系に限らず広範囲な分野で利用されている C 言語を用い､ 特に数値計算などの難し
い数学的知識を必要としないで､ かつ､ 学生が興味を持ってプログラミングに取り組めるように､ プログラミング演習の中でグラフィックス関数を使い､ 課
題として動画を制作することを試みた｡ また､ この動画制作においては､ 言語の習得を目的とするのではなく､ プログラムで作成する対象物の仕様作成から設計､ コーディング､ デバッグ等の一連のプロセスとその繰り返し､ すなわち
図 1 に示すようなシステム進化の過程全体12を理解し､ 体得させることを目的
とした｡

2. 2

プログラミング演習の概要

動画課題を取り入れたプログラミング演習は女子大学文系学科の情報関係科
目の選択科目の一つとして､ 3 年次前期 (2 コマ/週) に開講されている｡ その概要を表 1､ 演習内容を表 2 に示す｡
本演習の履修者は､ 40 名で､ Word､ Excel 等のアプリケーションソフトの使用経験はあるが､ プログラミングについては初学者がほとんどである｡ 言語
処理系として､ Ultra-C Pro を用いたのは､ 本ソフトが基本的なグラフィック
ス関数をサポートしていることとインタプリタ方式で､ 1 ステップ実行やトレース､ 変数のモニタリング等のデバッグ機能を有し､ かつソースプログラム､ 標
準入出力､ グラフィックス､ エラー画面等が独立したマルチウィンドウになっ― 66 ―

ソフトウェア開発プロセスの体得方法としてのプログラミングによる動画制作

図1

システム進化 (開発) のプロセス
表1

学

生

数

3 年次

演習の概要
40 名

総時間数

2 コマ (1.5 h×2) ／ 週

T

2名

A

言語処理系

×14 回

Ultra-C Pro (株式会社ソフトボード)
Windows 環境ており､ 初学者でも扱いやすいためである｡ パソコン (PC) は履修者 1 人 1台で､ PC 2 台に 1 台の割合で､ 教員の PC 画面や資料､ また､ 学生の PC 画
面が配信できるモニタ (教材モニタ) が学生の PC の間に配置されている｡ 演
習の進め方は､ 前半 (1 コマ目) と後半 (2 コマ目) の始めに､ その時間に学習する内容の説明をし､ その後､ 履修者がそれに従って演習をする｡ TA(Teaching Assistant) は 2 名で､ 履修者の質問に適宜対応できるようにしている｡ 演習の内容は､ 表 2 に示すように 9 回目の前半までは､ プログラミングの概説､ 言語処理系の利用方法､ C 言語の基礎を毎回単元毎に説明し､ それぞれ簡単な例題を与える方式であるが､ 9 回目の後半より､ 動画制作の基本とな― 67 ―

表2
回

演習の内容
内

容

1

履修上の注意､ 演習の進め方､ プログラミングとは､ アルゴリズム・プログ
ラム・プログラミング言語の関係､ プログラム言語､ C 言語とは､ Ultra-C の使い方､ C プログラムの概要

2

Ultra-C の操作方法､ C プログラミングの基礎､ 定数と変数

3

変数､ データ型､ 画面への出力

4

キーボードよりの入力､ 演算子

5

演算子

6

分岐､ 繰り返し､ 関数

7関数の作り方8

記憶クラスと通用範囲､ 配列 (数値)9

配列 (文字)､ C 言語のまとめ､ グラフィックスの説明､ 課題 (C 言語の基礎的な問題と動画制作) の提示､ 動画およびグラフィックスのテキスト配布

10

グラフィックス (動画の例題)､ Web 教材の提示

11

動画制作

12

動画制作

13

動画制作

14

動画およびソースプログラムの発表､ アンケート調査などるグラフィックスの説明と例題 (動画の例を含む) を 1.5 回行い､ その後課題として ｢動画制作｣ を課した｡ 動画の制作には 3 回 (3H×3＝9H) をあてた｡
ここで､ 第 1 回目の演習時に教員は､ ｢プログラミングは難しい｣ と言う先入観を捨てることと ｢プログラミングについて何も知らなくても大丈夫､ こらか
ら少しずつ身に付けていく｣ と言うことを強調した｡ 演習の最終回には､ 履修者全員の制作した動画とそのプログラムリストを各自の PC から教材モニタへ配信しながら､ 発表を行った後､ この動画制作を通して学生が興味を持ってプ
ログラミングに取り組めたか､ また､ プログラムの作成プロセスを理解できた
か等についてアンケートを実施した｡― 68 ―

ソフトウェア開発プロセスの体得方法としてのプログラミングによる動画制作

3 . 動画制作
動画制作の前に､ グラフィックスの基礎として､ グラフィックスに関する用
語､ 色や線種の種類等を表すマクロ名､ 関数の種類の説明をし､ すべての関数について一通りの使い方を練習させた｡ その後､ 図 2 に示す例題 (ソースコー
ドを図 3 に示す) で静止画を動いたように見せる動画の制作方法を学習させ､課題制作に取り組ませた｡

ԘԚԙ

《動画の例題：ウルトラマンの顔を動かす》
ウルトラマンの顔が順次 3 つの方向へ移動する｡
始点は画面左上とする｡① 始点から右へ移動し､② 始点から真下へ移動し､③ 始点から右斜め下へ移動する｡(注) Ultra-C Pro のグラフィックス画面は､ 座標 (0, 0) は画面左上､上図①が X 軸の正方向､ ②が Y 軸の正方向となる｡
図2

動画の例題

― 69 ―

<ソースプログラム>#include "graphic.h"void Ultraman(int i, int j);void main(){
int i, j, k;for(i = 100; i < 500; i += 10) /* 右へ移動 */{Ultraman(i, 100);for(k = 0; k < 10000; k++) ;DrawRectangle(i, 100, i+85, 215, WHITE, PSOLID, 1, WHITE, BSOLID, 0);}for(j = 100; j < 500; j += 10) /* 下へ移動 */{Ultraman(100, j);for(k = 0; k < 10000; k++) ;DrawRectangle(100, j, 185, j + 115, WHITE, PSOLID, 1, WHITE, BSOLID, 0);}for(i = 100, j = 100; i < 500, j < 500; i += 10, j += 10) /* 右斜め下へ移動 */{Ultraman(i, j);for(k = 0; k < 10000; k++) ;DrawRectangle(i, j, i + 85, j + 115, WHITE, PSOLID, 1, WHITE, BSOLID, 0);}}/* ウルトラマンの顔を描く関数
void Ultraman(int i, int j){
POINT point[4];* /DrawEllipse(i, j+15, i+80, j+115, BLACK, PSOLID, 1, WHITE, BSOLID, 0); /* 輪郭 */DrawEllipse(i+8, j+50, i+35, j+70, BLACK, PSOLID, 1, YELLOW, BSOLID, 0); /* 右目 */DrawEllipse(i+45, j+50, i+72, j+70, BLACK, PSOLID, 1, YELLOW, BSOLID, 0); /*左目 */point[0].x = i + 32;
point[0].y = j + 90;/* 口の座標を指定 */point[1].x = i + 48;
point[1].y = j + 90;
point[2].x = i + 45;
point[2].y = j + 100;
point[3].x = i + 35;
point[3].y = j + 100;
DrawPolygon(point, 4, BLACK, PSOLID, 1, WHITE, BSOLID, 0);/* 口 */
DrawLine(i + 40, j, i + 40, j + 80, BLACK, PSOLID, 1);/* 角 */}

図3

動画例題のソースプログラム― 70 ―

ソフトウェア開発プロセスの体得方法としてのプログラミングによる動画制作

3. 1

グラフィックス関数

静止画を作成するためにシンプルなグラフィックス関数､ 11 個を Ultra-C
でサポートされている関数を基に履修者が使いやすいように再定義した｡ それらの関数を表 3−1､ 3−2 に示す｡

3. 2

課題の提示と動画の制作

課題として､ 全履修者に対して動画を制作することを課した｡ 内容は自由とし､ 制作の目標として通常の授業の演習量から想定し､ 図 2 に示す例題 (図 3より LOC：31､ 動画のファンクションポイント*：4*後述) 以上のものとした｡ 履修者はこの指示に基づいて､ 各自動画の仕様を考え､ それをコード化し､デバッグをし､ 動画を完成させる｡ 完成までの過程においては､ 仕様で考えたことが用意されたグラフィックス関数では実現できないことや､ もっと出来映
えをよくする等の理由から､ 図 1 12 に示すような仕様の見直し､ プログラム(コード) 変更､ デバッグが何回も繰り返し行われていることが観察された｡
また､ 制作に集中している姿や隣同士教え合ったりする履修者もみられた｡ さらに､ 完成した時の満足感や充実感も観察された｡ 履修者が制作した動画の概
要を表 4−1 から表 4−3 に示す (同表には後述の LOC およびファンクション
ポイントによる動画制作の評価を併記してある)｡ 表 4−1 から表 4−3 より､制作された動画は一人ずつ異なっており､ 履修者の一人ひとりが他人のプログ
ラムを真似しているのではなく､ 各自オリジナリティを発揮しながら､ 動画を制作していることがわかる｡ このことは､ 履修者が興味を持って動画作成に取り組んだことを示し､ この点からも動画制作がプログラミングに取り組むための動機付けになっていると評価できる｡― 71 ―

表 3−1

グラフィックス関数 (その 1)

No.

関

数

機

1

DrawBackground (色)機能：画面を塗りつぶす｡
説明：グラフィックス画面全体を指定した色で塗りつぶす｡

2

DrawPixel (x, y, 色)

機能：点を描く
説明：座標 (x, y) に指定した色で
点を描く｡

3

DrawLine (x1, y1, x2, y2,
色, 線の種類, 線の幅)

機能：線を描く
説明：座標 (x1, y1) から座標 (x2,y2) に指定した色で線を描く｡

4

DrawRectangle (x1, y1,
x2, y2, 輪郭線の色, 輪郭
線の種類, 輪郭線の幅, 内部の色, 内部のスタイル,
ハッチング)

機能：長方形を描く
説明：左上座標 (x1, y1)､ 右下座標(x2, y2) を対角の頂点とする長方形を描く｡

5

DrawEllipse (x1, y1, x2,
y2, 輪郭線の色, 輪郭線の種類, 輪郭線の幅, 内部の色, 内部のスタイル, ハッ
チング)

機能：円・楕円を描く
説明：左上座標 (x1, y1)､ 右下座標(x2, y2) を対角の頂点とする長方形に内接する楕円を描く｡

6

DrawRoundRect (x1, y1,
x2, y2, w, h, 輪郭線の色,
輪郭線の種類, 輪郭線の幅,
内部の色, 内部のスタイル,
ハッチング)

機能：角の丸い長方形を描く
説明：左上座標 (x1, y1)､ 右下座標(x2, y2) を対角の頂点とする長方形に内接する小さな楕円を描き､ 角の丸い長方形を描く｡

7

機能：円弧を描く
説明：座標 (Lx, Ly)､ 座標 (Rx,
Ry) を対角の頂点とする長方形のDrawArc (Lx, Ly, Rx,
内接する楕円の円弧を描く｡ 座標
Ry, x1, y1, x2, y2, 線の色,
(x1, y1) と楕円の中心を結ぶ直線が線の種類, 線の幅)
交わる点 a が円弧の開始点に､ 座標(x2, y2) と楕円の中心を結ぶ直線が交わる点を b が円弧の終了点になる｡― 72 ―

能

・

説

明

例

・

ソフトウェア開発プロセスの体得方法としてのプログラミングによる動画制作

表 3−2

グラフィックス関数 (その 2)

DrawChord (Lx, Ly, Rx,
Ry, x1, y1, x2, y2, 輪郭線の色, 輪郭線の種類, 輪郭
線の幅, 内部の色, 内部のスタイル, ハッチング)

機能：弓形を描く
説明：座標 (Lx, Ly)､ 座標 (Rx,
Ry) を対角の頂点とする長方形の内接する楕円の弓形を描く｡ 座標(x1, y1) と楕円の中心を結ぶ直線が交わる点 a が円弧の開始点に､ 座標(x2, y2) と楕円の中心を結ぶ直線が交わる点を b が円弧の終了点になる｡

9

DrawPie (Lx, Ly, Rx, Ry,
x1, y1, x2, y2, 輪郭線の色,
輪郭線の種類, 輪郭線の幅,
内部の色, 内部のスタイル,
ハッチング)

機能：扇形を描く
説明：座標 (Lx, Ly)､ 座標 (Rx,
Ry) を対角の頂点とする長方形の内接する楕円の扇形を描く｡ 座標(x1, y1) と楕円の中心を結ぶ直線が交わる点 a が円弧の開始点に､ 座標(x2, y2) と楕円の中心を結ぶ直線が交わる点を b が円弧の終了点になる｡

10

DrawPolygon (配列の名前, 頂点の数, 輪郭線の色, 機能：多角形を描く
輪郭線の種類, 輪郭線の幅, 説明：POINT 配列で指定された
内部の色, 内部のスタイル, n 個の頂点を順に結ぶ多角形を描く｡
ハッチング)

11

DrawText (x, y, 出力する文字 , 文字の色, フォントの名前 , フォントサイズ, 文字の種類, 下線)

8

機能：文字を出力する
説明：座標 (x, y) に指定された色､フォント､ フォントサイズで文字を出力する｡― 73 ―

ABC

表 4−1

履修者が制作した動画プログラム (その 1)

No.

タイトル

内

容

LOC FP

1

不思議な
ステージ

①小玉が画面のふちに並べられていく｡ ② 2 人のピエロが玉乗りをしながら､ 玉をけりあう｡ けっている玉だけ 157
が左右に飛び交う｡ ③画面ふちの小玉が順に消えていく｡

17

2

ドラえもん

①ドラえもんが絵描き歌のように順に描かれる｡ ②ドラ
えもんがドラ焼きを食べ､ ③右へ竹コプターで飛んで行229
く｡ ④画面中央に ｢おわり｣ を表示し､ 後姿のドラえもんが上の方へ飛んで行く

12

3

くすだま

①クスダマが割れ､ 紙ふぶきが散り､ ②垂れ幕がおり､③ ｢お疲れ様！｣ の表示｡

64

9

4

UFO

①UFO が飛んできて､ ②小包を落とす｡ ③小包が地面へ届くと､ ｢Happy Birthday!｣ の文字が表示される｡

80

12

5

おにぎり

①おにぎりが水溜りに落ちていくのをピンクの熊が傍らで見ている｡

30

7

6

クジラ

①くじらがしおをふくのくりかえす｡

69

10

7

魚

①魚が右へ泳ぐ｡ ②魚が左へ泳ぐ｡

90

11

8

ひよこ

①ひよこがとことこ歩いてきて､ ②木にぶつかり､ ③りんごが落ちる｡

47

11

9

お花

①お花の横を 4 匹の蝶々が飛んでいくと同時にクモも動105く｡ ②夜になると月と星がでる｡

12

10 雪だるま①雪だるま (は動かない) と降ってくる雪｡

92

7

11 ちょうちょ①帽子のわきを右下へ蝶が飛んでいき､ ②次に蝶が右上へ飛んでいく｡

24

5

12 気球

①空を気球がふわふわととんでいく｡

120

7

16

13

夜空に
UFO が

①白 UFO 点滅②水色､ ピンク､ 紫 UFO 点滅③②のUFO が動く④パールグリーン､ プラム UFO 点滅⑤④のUFO が動く⑥水色 UFO 点滅⑦オレンジ UFO 上に上が 312る｡ (たくさんの UFO が夜空に点滅している｡ そのうち､複数の UFO があちらこちらに飛んでいく｡)

14

空飛ぶ
・・・!?

①風船が上へ飛んで､ ②気球が左から右へ飛んでいく｡③その後､ 右から左へピンクの動物が飛んでいく｡

46

9

15

うさぎの
シャボン玉

①うさぎがシャボン玉を膨らまそうとして②一回目は失敗､ ③2 回目はうまく膨らみ､ ④上へ飛んで行く｡

81

21― 74 ―

ソフトウェア開発プロセスの体得方法としてのプログラミングによる動画制作

表 4−2

履修者が制作した動画プログラム (その 2)

16 くま

くまとりんごの木｡ ①太陽が昇り､ ②りんごが落ちて､くまの手の上に｡

141

12

17 冬の夜空

冬の夜空に星が見える｡ 星を線で次々と結び､ 星座の名前を表示して行く｡ ①こいぬ座②おおいぬ座③オリオン 149
座④冬の大三角19

18 ｢星空｣①星空の星が一通り点滅し､ ②流れ星がひとつ流れる115(わかりにくい)719 色玉①同心円の半径をだんだん小さくし､ カラフルな色で見せる｡ ②その後､ 星が流れ､ ③半径をだんだん大きくし､176
もとの円の大きさまで描く｡ ④その後､ クスダマがわれ､
☆が出る｡

22

風船を持った犬｡ ①風船が飛んでいく｡ ②おなかのあた
りで別の風船が膨らみ､ ③しぼむ｡

41

8

21 うららか①雪だるまのカップルがキスすると溶けてしまう｡ ②太214
陽と虹と蝶々､ 花がでて ｢春がきた｣ と表示する｡

20

22 まる

①四角の線で囲まれた通路を 2 つの●が通過し､ 途中出
142
会うが､ 通過してゴールまでいく｡

12①気球に乗ったドラえもんを､ ②竹コプターをつけたね
ずみが追いかける｡ ③途中で背景が夜に変わる｡

61

7

24 くじら

①くじらがしおを吹いた後､ ②海面へ沈んでゆき､ ③ふ
たたび浮かんでくる｡

64

825 宇宙飛行

①●と UFO がとんでいく｡ ②上陸

136

11

26 うさこ①うさこ (うさぎ) が持っていた風船を鳥が飛んできて割ってしまう｡ ②うさこが泣く｡ ③そのあと鳥が風船を177持って飛んできて､ うさこに渡す｡ ④うさこは風船とともに空へ飛んで行く｡

15

27 陽子さんへ①ドアを開けて人が入ってきて､ ②台の乗り､ ③紐を引っ張ると④クスダマが割れて､ ⑤ ｢陽子さんお誕生日オメ 424
デト｣ の垂れ幕がでる｡

22

28 ビリヤード①白い玉をつくと､ ② 9 ボールが散りころがる｡

92

629 ねずみ①ねずみの親子がチーズに寄っていく｡ ②はねかえる｡③また近づく｡

52

8

88

9

20

23

プクプク
ワンワン

ドラえもん
気球の旅

30 パンダちゃん ①パンダがじゃんけんを繰り返す｡― 75 ―

表 4−3

履修者が制作した動画プログラム (その 3)

31 koaｌa

3 匹のコアラがスピードを変えて､ 順に緑の綱を①下り､173②上る｡ ③最後は寝ている｡

18

32 星座

星座を表示し､ ①上へ移動｡ ②赤い線が出て､ ③太陽が
278
でる｡

10

33 たまご①たまごにひびが入り､ ②何が生まれるかなと期待させ
158て､ パンダが生まれる｡ ③文字が大きくなる

11

34 雪だるま①白い玉が左から動いてきて中央でとまる｡ ②上からやや小さめの白い玉が動いてきて､ 雪だるまができる｡ ③
横一列にならんだ雪のつぶが④降ってくる｡ ④←2 回

55

10

35 花火

①同心円の半径を順に描いていき､ 花火にみたててある｡
155②花火が複数出る｡

7

36 ボーリング

①ボーリングのボールが転がってくる②ピンを全部倒して ｢ストライク｣40

7

37 cake

ショートケーキの上に立っているローソクの炎が①点滅
し､ ②まわりがピカピカする｡

96

938 折り紙

①折鶴を順に折っていく過程の図を見せる②完成した鶴564が飛んでいく｡

19

39 作品

雪だるまと月｡ 雪の粒が点滅

26

6

40 海

船とカモメ｡ ①海面が動く｡ ②船の汽笛から煙がもくもくと出る｡ ③トビウオが海面から出る｡

85

13

4 . プログラム作成力の評価方法と結果履修者がどのくらいプログラムを作成する力がついたかを客観的にみるために､ ソフトウェアの生産性を計る指標として用いられている LOC 13, 14とファンクションポイント13-18の 2 つの方法で評価した｡ ここで､ ファンクションポイ
ントについては､ 動画を単機能に分解し､ 評価基準を定義した｡

4. 1

LOC による評価

表 4−1 から表 4−3 に示した履修者が制作した動画のソースリストの LOC― 76 ―

person

ソフトウェア開発プロセスの体得方法としてのプログラミングによる動画制作

5

ᐔ ဋ
ਛᄩ୯
ᦨ㗫୯
ᦨ ዊ
ᦨ ᄢ
ᮡᧄᢙ

4
3

131.2
94
64
24
564
40

2

㪌㪍㪇䌾㪌㪍㪐

㪋㪉㪇䌾㪋㪉㪐

0

㪇䌾㪐
㪈㪇䌾㪈㪐
㪉㪇䌾㪉㪐
㪊㪇䌾㪊㪐
㪋㪇䌾㪋㪐
㪌㪇䌾㪌㪐
㪍㪇䌾㪍㪐
㪎㪇䌾㪎㪐
㪏㪇䌾㪏㪐
㪐㪇䌾㪐㪐
㪈㪇㪇䌾㪈㪇㪐
㪈㪈㪇䌾㪈㪈㪐
㪈㪉㪇䌾㪈㪉㪐
㪈㪊㪇䌾㪈㪊㪐
㪈㪋㪇䌾㪈㪋㪐
㪈㪌㪇䌾㪈㪌㪐
㪈㪎㪇䌾㪈㪎㪐
㪈㪏㪇䌾㪈㪏㪐
㪈㪐㪇䌾㪈㪐㪐
㪉㪇㪇䌾㪉㪇㪐
㪉㪈㪇䌾㪉㪈㪐
㪉㪉㪇䌾㪉㪉㪐
㪉㪊㪇䌾㪉㪊㪐
㪉㪋㪇䌾㪉㪋㪐
㪉㪌㪇䌾㪉㪌㪐
㪉㪍㪇䌾㪉㪍㪐
㪉㪎㪇䌾㪉㪎㪐
㪉㪏㪇䌾㪉㪏㪐
㪉㪐㪇䌾㪉㪐㪐
㪊㪇㪇䌾㪊㪇㪐
㪊㪈㪇䌾㪊㪈㪐
㪊㪉㪇䌾㪊㪉㪐

1

step

図4

LOC の分布

を度数分布にしたものを図 4 に示す｡ ここで､ LOC は､ ソースの総行数から
空行､ コメント行､ 余分な

{

または

}

の行を除いたものである｡ たとえば､ 図 3 に示した動画の例題のソースプログラムの場合､ (総行数：42) ＋ (1
行に 2 命令の行：4) − (空行､ コメント行､ { ､ } の行：16) から LOC は 31
ステップと計数する｡
表 4−1 から表 4−3､ 図 4 より､ 全履修者の LOC の平均値は 131.2､ 中央値
は 94､ 最頻値は 64 であり､ また､ 最小値は 24､ 最大値は 564 と LOC は広範
囲に分布していることがわかる｡
動画制作における LOC の目標は､ 図 3 の例題 (LOC：31) を超えることとしたが､ 目標を超えた履修者は全体の 92.5％である｡ また､ LOC が目標の約 3倍である 100 を超える履修者は約半数の 47.5％､ 200 を超える履修者は 6.7％である｡ 本課題が仕様作成､ 検討を含めて全てを履修者自身がクリエイトする必要があることを考慮すれば､ これらの履修者はプログラミングの初学者で､かつ制作期間が短いにもかかわらず､ 相当のプログラムを作成する力がついたと言える｡ このことからも､ 履修者はプログラミングに興味を持ち､ いかに積― 77 ―

極的に取り組んだかがわかる10, 11｡

4. 2

ファンクションポイントによる評価

履修者がプログラミングにより作成した動画の複雑さを評価するために､ 定義した動画の FP を表 5 に示す｡ ソフトウェア工学における FP 法 13-18は､ ソフ
トウェアの規模をそれが実現する機能 (Function) の数によって見積る方法
で､ ソフトウェアの機能を入出力の数やマスターファイルの数として捉えるものである｡ ここでは､ 動画を形成する複雑さを機能として数えるために､ 表 5に示すような 8 つの機能を定義し､ 評価基準とした｡ 動画を形成するためのファンクションは､ 描画しているオブジェクトの数､ オブジェクトの移動回数､ オ
ブジェクトの色の変化､ 複数のオブジェクトの描画､ オブジェクトを順次描き足し､ オブジェクトの一部だけの変化などに分類し､ その評価基準に従って､履修者の動画がいくつのファンクションで構成されているかを集計している｡
ただし､ FP の定義において､ 見る人の感性のよって評価が異なると思われる描画の美しさや動画のストーリーのおもしろさ等については除外している｡
表 5 の基準により全履修者の動画 (表 4−1 から表 4−3 参照) を評価し､ それを度数分布に表したものを図 5 に示す｡ 図 5 より最小値は 5､ 最大値は 22と広範囲に分布していることがわかる｡ ここで､ 例題の動画は､ 一つの図形が移動を繰り返したもので､ そのファンクションポイントは 4 であるが､ 履修者の作成した動画のファンクションポイントの平均値は 11.6､ 最頻値は 7 と例
題を上回っており､ 表 4−1 から表 4−3 に示したようにその多くは複数の図形が描かれ､ そのうちのいくつかが移動したり､ 色を変えたり､ 形を変えたりとその機能も多種組み合わせて作られていることがわかる｡
このようにオリジナリティのある動画が作られるということは､ 学生が自分なりに考えた仕様をプログラムで実現できることが理解でき､ かつ､ ｢こんな図形を追加しよう｣､ ｢こんなふうに見えるようにつくりたい｣ と言うように､いろいろな形や機能を組み合わせて作ってみようと言う創造的な態度でプログ― 78 ―

ソフトウェア開発プロセスの体得方法としてのプログラミングによる動画制作

表5
ファンクション

動画ファンクションの定義と評価基準
評

価

基

準

描

画

・一まとまりのオブジェクトについて 1 とする｡
・背景とみなされるものはまとめて 1 とし､ 一色で塗りつぶすのも 1
とする｡

移

動

・移動するオブジェクト (もしくはオブジェクトの一部) 一つを 1 とする｡
・オブジェクトの移動方向が変わったときには､ それも 1 とする｡

色 変 化

オブジェクトまたは背景に対して色の変化があれば 1 とする｡

複数描画

同じオブジェクトが複数配置されているとき､ 1 とする｡

順

次

オブジェクトに順次付け足しで描画しているものは､ そのまとまりを1 とする｡ (eg. 絵描き歌の場合､ 絵＋絵描き歌＝2)

点

滅

オブジェクトを描いたり､ 消したりし､ 繰り返すものを 1 とする｡
繰り返す回数は考慮しない｡ 星の輝き等はまとめての点滅を 1 とする｡

一部変化

オブジェクトの中の一部分だけが変形したり､ 追加されたりする場合1 とする｡
描

そ の 他画) 同じオブジェクトを複数配している場合は､ ｢複数配置｣ という一まとまりを 1 とする｡
移動 1 ) ただし､ 同じ方向に同じ物が移動する場合は ｢複数移動｣ という一まとまりを 1 とする｡
(eg. 雨､ 雪､ 流れ星の場合は､ 移動＋複数移動＝2)※ソースプログラムに関係なく同じ処理だと思われる場合はそれらを 1 とする｡
移動 2 ) 往復移動の場合は､ ｢移動方向の変化｣ で 1 とする｡
色変化) 色の変化は何色変化しても 1 とする｡ (eg. 花火の色変化)
ただし､ 場面の移り変わりを示す色の変化は各変化をそれぞれ 1 とする｡(eg. 朝→昼→夜､ 春→夏→秋→冬における木や背景等)
その他) 乱数などを使って､ まばらな処理をしている場合は､ その度合いにより考慮し､ 単純に ｢乱数使用｣ で 1 とする｡ (eg.
雨や雪で 1､ 星の輝きで 1 とする)

ラミングに取り組めた結果であると思われる｡ このことからも､ 履修者はプログラミングに興味を持ち､ いかに積極的に取り組んだかがわかる｡― 79 ―

図5

FP の分布また､ ファンクションポイントと LOC の間の相関係数は 0.62 で､ おおむね相関があると言え､ 動画の評価方法として適当であると判断できる10, 11｡

5 . 履修者のプログラミング演習に対する評価
本演習の中で課題として取り入れた動画に興味を持って取り組めたか､ また､その制作を通してプログラム完成までのプロセス等を理解できたかを最終回の授業の中で､ 履修者にアンケート形式で調査した｡ その結果を表 6､ 表 7 に示す｡
表 6 より､ ｢動画制作は楽しかった｣ と回答した履修者は 82.5％､ 否定的な履修者は 0％､ ｢動画を制作してプログラムを作成する力がついた｣ は 65％､
力がつかなかった履修者は 5％､ ｢動画制作は難しかった｣ は 90％､ 難しくな
かった履修者は 2.5％である｡ また､ ｢プログラミングに興味を持った｣ 履修者は 70％､ 否定的な履修者は 30％である｡ このように大半の履修者は､ 動画
をプログラムで制作することは難しいと思ったものの､ 興味を持ち楽しみながら取り組め､ かつ､ プログラムを作成する力もついたと認識していることがわ― 80 ―

ソフトウェア開発プロセスの体得方法としてのプログラミングによる動画制作

表6
選択肢

アンケート調査結果 1
はい

どちらとも
いえない

いいえ

無回答

グラフィックス (動画制作)
は楽しかったですか

82.5％

17.5％

0.0％

---

グラフィックスで動画を制作してプログラムを作成する力がついたと思いますか

65.0％

30.0％

5.0％

---

グラフィックス (動画作成)は難しかったですか

90.0％

5.0％

2.5％

2.5％

プログラミングに興味を持ち
ましたか

70.0％

30.0％

0.0％

---

項

目

表7

４

３

２

１

わ
か
っ
た

わ ど
か ち
っ ら
た か
と
い
え
ば

ど
ち
ら
と
も
言
え
な
い

わ ど
か ち
ら ら
な か
か と
っ い
た え
ば

わ
か
ら
な
か
っ
た

無
回
答

Q1

30.0％

27.5％

30.0％

7.5％

5.0％

---

Q2

37.5％

45.0％

15.0％

0.0％

0.0％

2.5％

選択肢

項

５

アンケート調査結果 2目

Q1：プログラミングとはアルゴリズムを特定の言語 (たとえば､ C 言語) で表現するものということが理解できましたか
Q2：実行できるプログラムができるまでの作成過程がわかりましたか

かる｡ ここで ｢プログラムを作成する力がついた｣ と､ 学生自身が認識していることは､ 学生が自分なりに考えながらプログラミングができる自信がついたと捉えられる｡ また､ 表 7 より､ プログラミングとはアルゴリズムを特定の言語 (例えば､ C 言語) で表現するものということを 57.5％の履修者が理解でき､― 81 ―

実行できるプログラムができるまでの作成プロセスを 82.5％が理解できたとしている｡ これらの要因としては､ 動画すなわち､ グラフィックスは視覚的に出力結果が確認できるので､ 学生自身が自分の考えた仕様に対して､ 完成プロ
グラムが一致しているかどうかを直感的に理解しやすいためと考えられる｡
これらより､ プログラミング演習に動画制作を導入したことは､ 履修者のプログラミングに対する興味を持たせることにつながり､ また､ 学生がプログラ
ミングの理解やプログラムを完成させるまでの作成プロセスを体得することができたと評価できる7, 11｡
また､ 一般的なソフトウェア開発工程は基本的にはウォーターフォールモデ
ル 19が採用されている｡このモデルの開発工程の概要を表 8 に示す｡ 表 8 に示すようにプログラミング (プログラムの作成) は､ ソフトウェア開発工程の一部であるが､ このモデルは､ 工程ごとに区切りをつけて次の工程に進むが､ 図
1 のシステム化のプロセスは区切りがないものの区切りを入れたらウォーター
フォールモデルとほぼ同じである｡ これより 8 割強の履修者は､ この演習を通してその概要を体得したと評価できる｡

表8

ソフトウェア開発の工程の概要

工程名

工 程 の 作 業 内 容

1

構想設計

いわゆるシステムエンジニアリング業務である｡ 顧客要件を分析し､ソフトウェアで実現する項目を開発要件 (ソフトウェア仕様書) として具体化する｡

2

設

計

CD 工程で作成された開発要件 (ソフトウェア仕様書) にしたがって､
ソフトウェアの機能分割・ソフトウェアのモジュールの組み合わせ・
ソースプログラムの作成などの設計業務を行う｡

3

デバッグ

設計工程で作成された成果物が､ 設計どおりに作成されていることを実機を使って動作確認する｡ 設計作業を行った当事者が実施する｡

4

テ ス ト

デバッグが完了したソフトウェア (プログラム) が､ 顧客要件を満足していることを確認する｡ 設計・デバッグ作業者とは異なる第三者が実施する｡― 82 ―

ソフトウェア開発プロセスの体得方法としてのプログラミングによる動画制作

6 . おわりにプログラミングの初学者が興味を持ってプログラミングに取り組むことができるように､ 課題として動画制作を取り入れ､ 実施した結果､ 履修者はプログ
ラミングを難しいと認識しながらも､ 楽しみながら､ かつ､ プログラミングに興味を持って積極的に取り組めたこと7, 11､ また､ プログラムの作成プロセスがどのようなものかを体得できたことが明らかになった｡ さらに､ 出来上がった動画の評価を LOC やファンクションポイントによって行った結果､ 初学者
でも相当な量のソースプログラムを書くことができ､ 動画も工夫されたものであった｡ このことは､ 動画制作が仕様検討を含め全てを履修者自身がクリエイトする必要があることを考慮すれば､ 履修者がプログラミングの初学者で､ かつ制作期間が短いにもかかわらず相当のプログラムを作成する力がつき7, 11､
また､ この演習を通してソフトウェア開発の工程の概要を体得したことは､ 評価できる｡ 今後は､ より良い教材の開発や環境､ また､ プログラミングに求められる知識・能力・資質等について検討すると共にソフトウェア開発の工程をより詳しく教育できる方法について検討していきたい｡

参考文献
1

朝倉宏一､ 渡邉豊英：｢情報工学系学部学生に対する並列プログラミング演習教育｣､ 情報処理､ Vol. 40, No. 5, pp. 2235-2245, 1999.
2 米沢宣義､ 志村武､ 南敏：｢多人数初心者向きプログラミング教育システムの基本設計について｣､ 情報処理､ Vol. 27, No. 1, pp. 96-102, 1986.
3 関本理佳､ 海尻賢二：｢プログラミングスタイルの診断システムの構築｣､ 教育システム
情報学会誌､ Vol. 17, No. 1, pp. 21-29, 2000.
4 ｢プログラミング教育における制御構造のイメージと理解度について｣､ 情報処理､ Vol.
39, No. 4, pp. 1190-1183, 1998.
5 不破泰､ 中村八束､ 山崎浩､ 大下眞二郎：｢Web を用いた CAI システムによる大学講義の高度化とその評価｣､ 教育システム情報学会誌､ Vol. 20, No. 1, pp. 27-38, 2003.
6 高橋参吉､ 佐野繭美､ 橋本はる美､ 牧野純､ 松永公廣：｢Web 問題集を使った C プログ
ラミングの授業設計｣､ 教育システム情報学会誌､ Vol. 20, No. 4, pp. 392-397, 2003.

― 83 ―

7

松山智恵子､ 中島豊四郎､ 石井直宏：｢プログラミング初心者における動画製作の試みと評価｣､ 電気学会論文誌 C､ Vol. 124, No. 12, pp. 2482-2488, 2004.
8 松山智恵子､ 中島豊四郎､ 石井直宏：｢プログラミング教育のための Web ベース教材の開発と評価｣､ 電気学会論文誌 C､ Vol. 125, No. 12, pp. 1900-1905, 2005.
9 松山智恵子､ 中島豊四郎､ 石井直宏：｢プログラミング初心者のソースプログラムの分
析と傾向｣､ 電気学会論文誌 C､ Vol. 125, No. 12, pp. 1914-1915, 2005.
10 中島豊四郎､ 松山智恵子､ ｢プログラム作成力の評価における LOC とファンクション
ポイントの相関についての検討｣､ 椙山女学園大学 文化情報学部紀要､ 第 10 巻､ pp. 7181, 201011 TOYOSHIRO NAKASHIMA, CHIEKO MATSUYAMA, NAOHIRO ISHII: "Development of Teaching Materials for Students to Tackle Programming with Interest andits Effectiveness", "Java in Academia and Research", pp. 37-60, iConcept Press Ltd.,2012
12 Mint (経営情報研究会)：｢図解でわかるソフトウェア開発のすべて｣､ 日本実業出版社(2000)
13 R. S. Pressman: "Software Engineering", McGraw-Hill, New York, 1992.
14 Ali Behforooz, Frederick J. Hudson: "Software Engineering Fundamentals", Oxford
University Press, New York, 1996.
15 Capers Jones 著､ 鶴保征城､ 富野壽 訳：｢ソフトウェア開発の定量化手法｣､ 共立出版､1993.
16 児玉公信：｢実践ファンクションポイント法｣､ 日本能率協会マネジメントセンター､
1999.
17 ㈱アレア：｢失敗しないファンクションポイント法｣､ 日経 BP 社､ 2002.
18 河村一樹：｢改訂新版ソフトウェア工学入門｣､ 近代科学社､ 2003.
19 Boehm, B. W.: "Software engineering", IEEE Trans. Softw. Eng., Vol. C-25, No. 12,
pp. 1226-1241, 1976.

― 84 ―