情報処理学会研究報告, CE-57, Vol.2000, No.95, pp.103-110 (2000)

手書きによる壁紙新聞作成支援システムの試作
大即 洋子 加藤 直樹 中川 正樹
東京農工大学工学部
東京都小金井市中町２－２４－６
042-388-7144
E-Mail ： yhoko@hands.ei.tuat.ac.jp
本稿では、初等中等教育段階において、個人およびグループが行う創造的学習の例として壁紙新聞作成を取り上げ、その作成を支援するグループウェア環境の試作を報告する。創造性を育む学習では，個内の創造的思考とグループ内でのコミュニケーションが重要であり，そのためには，適切な情報処理支援，認知的負荷の少ないユーザインタフェース、個人作業およびグループ作業での作業環境の統一性が必要であると考える。このことから、子供たちに認知的負荷の小さいユーザインタフェースとしてペンインタフェースを採用し、個人作業とグループ作業をシームレスに統合するシステム設計を行った．具体的には、壁紙新聞の原稿となる記事素材を個人が表示一体型タブレットと電子ペンを使用して手書きにより作成する記事素材作成機能と、対話型電子白板を使用してグループで記事素材を編集する記事素材編集機能を開発した。本稿では、それらの設計と試作、そして実用してみて確認できた利点や問題点を述べる。こうした学習に必要な支援環境への要求事項とそれを解決するための設計指針を明確にすることを今後の課題とする。
CSCL,ペン入力,教育支援,電子白板,手書き

Prototyping of a Computer Supported System for Preparing Schools' Newspaper
by Handwriting-based User Interfaces

Yoko Otsuki, Naoki Kato and Masaki Nakagawa
Tokyo Univ. of Agriculture and Technology.
2-24-16 Naka-cho, Koganei, Tokyo, 184-8588, Japan042-388-7144
E-Mail ： yhoko@hands.ei.tuat.ac.jp
This paper describes prototyping of a computer supported system for preparing schools' newspaper as atypical example of computer-based environments for supporting creative learning made by both each student
and a group of students in primary and secondary schools. Learning to grow creativity seems to be trained
through individual creative thinking and communication among individuals. To support this, proper information processing, user interfaces that incur little
cognitive burden, and seamless coupling of individual work and group work, are all necessary. We have
employed pen-based user interfaces for both of individual work and group work and designed the groupware
so that individual and group works are combined seamlessly. Namely, materials are prepared by each student on a display-integrated tablet with a stylus, and then they are collected, edited and merged into schools'
newspaper by electronic markers while being displayed for a group of students on an interactive electronic
whiteboard. This paper presents the design, implementation and preliminary evaluation. Through the revision and evaluation, we hope to clarify what are required for this type of systems and how they are realized.
electronic interactive white board in the group.
CSCL, pen based interface, supported education, electronic whiteboard, hand writing情報処理学会研究報告, CE-57, Vol.2000, No.95, pp.103-110 (2000)

1．はじめに
近年、小学校の教育現場においてコンピュータの利用が重要視されはじめている。情報社会
では情報へ の理解や情 報活用能力 の習得が不可欠となっているからである。平成 10 年 12 月に改定された小学校学習指導要領においては、「各教科等の指導に当っては、児童がコンピュータや情報 通信ネット ワークなど の情報手段に慣れ親しみ、適切に活用する学習活動を充実するとともに、視聴覚教材や教育機器などの教材・教具の適切な活用を図ること」となっており、コンピュータの特性を上手に利用した情報教育を目指している。たとえば、社会科においては資料の収集・活用・整理などにコンピュータを用いることが推奨されている。
ところが、小学校の教育現場で児童がコンピュータを利用するには、まだ多くの問題を抱えている。第一に、現在主流の入力装置であるキーボードやマウスは児童の手には大きすぎ、操作しにくいという点が考えられる。これらを使用することによって思考が妨げられ、結果として創造力の低下を招くこととなる。
第二に、児童による文字入力の方法である。
一般的な文 字入力の方 法はローマ 字入力であるが、児童がローマ字を学習するのは第 4 学年になってからである。学習するまでの 3 年間はキーボード による文字 入力を行う ことができず、授業でのコンピュータの利用が制限されてしまう。
第三に、デスクトップコンピュータでは授業の利用範囲が限られることがあげられる。授業の進行は主に黒板が使用されるが、デスクトッ
プコンピュ ータは黒板 の役割を果 たすものではない。
筆者が属す東京農工大学中川研究室（以下、当研究室と記す）では、従来人間が使用してきたペンで紙に書くように行うことができれば、思考を妨げ ることなく コンピュー タの操作や入力が可能であると考え、電子ペンによる手書きインタフェースの研究を行っている ２）。同時に、従来の黒板のように扱うことのできる対話型電子白板の研究も行っている ３） 。
そして、先に述べた小学校の授業にコンピュータを利用することの問題点解決に対し、電子ペンによる 手書き文字 の入力と対 話型電子白板の授業への導入に着目した。電子ペンによる手書き文字の入力は紙と鉛筆の代わりとなり、対話型電子白板は黒板の代わりとなる。これにより授業中 にコンピュ ータを使用 することに対する違和感を最小限に抑え、通常の授業の妨げになるこ となく情報 教育推進を 行うことができる。
一方、小学校学習指導要領において、グルー
プ学習、異年齢集団による学習などの多様な学習形態も推奨している。グループ学習を行うことで、児童同士の活発な議論や相互作用を通して、知識の不均質を克服し、問題の理解や学習効果を高め るという効 果が期待さ れるからである。また、児童間での新たな信頼関係を築くチャンスを 与えるとい う精神的な 効果も期待される。このグループ学習にコンピュータを用い る 研 究 は CSCL(Computer Supported Collaborative Learning) １） といわれており、学習者の相互作用を支援するものである。
我々も、グループ学習の例として壁紙新聞作成をあげ、これを支援するコンピュータ環境の試作を試みた。壁紙新聞の作成は、壁紙新聞の原稿となる記事素材を個人が作成する作業と、作成された 記事素材を 用いてグル ープで記事素材をレイ アウト編集 する作業の ２つに分けられる。個人作業とグループ作業をシームレスに統合する ために子供 達に認知的 負荷の小さいユーザイ ンタフェー スとしてペ ンインタフ
ェースを採用する。また、個人作業にはデスクトップを利用し、グループ作業には画面が大きく作業に適 した対話型 電子白板環 境を利用することにした。
本稿では、ペンインタフェースを採用した壁紙新聞作成支援システムの設計、試作、評価実験について述べる。

2. 壁紙新聞作成支援システムの設計方針
2.1 手書き入力の採用
本システムは、小学生を対象としている。そのため、使用者の大半はコンピュータの扱いに慣れていないことが想定される。また、従来のソフトウェ アの多くは キーボード とマウスに情報処理学会研究報告, CE-57, Vol.2000, No.95, pp.103-110 (2000)

よる操作を前提としているが、先に述べたように児童にと っては操作 しづらいと いう問題点があげられる。そこで、キーボードではなく電子ペンを用い、人間が長い間親しんできている紙に書くよ うに表示一 体型タブレ ット上に文字を記入することができるようにする。これは、キーボード を使用する ことによっ て生じる使用者のコン ピュータに 対する苦手 意識の抑制となる。同時に、画一化された文字フォントではなく、表現力豊かな手書き文字を入力することができるという効果を生じる。

2.2 個人とグループ作業各々に適した環境の利用
壁紙新聞とは、何人かでグループを作り、自分達が周囲 の人々に伝 えたいこと を文章や絵で表現し、新聞という形にしたものである。テーマを決め、各自が調査を行い記事となる素材をまとめ、それを元にメンバ全員で編集作業を行うことにより壁紙新聞は形成される。
これらの作業を行う際、個人で作業を行う記事素材作成 においては 従来のデス クトップを使用する。しかし、従来のデスクトップ環境では画面が小 さいためグ ループのメ ンバ全員で同時に画面 を見ること ができない という理由により、大人数のグループ作業には適さない。
そこで我々は、グループ学習となる編集作業においては、画面が大きくグループ作業に適した対話型電子白板環境を利用することにした。

2.3 ユーザインタフェースの設計方針
本システムは、従来のコンピュータ環境とは異なる電子ペン、表示一体型タブレット、対話型電子白板を使用しているため、特有のユーザインタフェースを必要とする。
電子 ペ ン に よる 手 書 き 文字 の 入 力 はキ ー ボード入力と異なり、多くの入力画面が必要となる。特に、児童の文字サイズは大人の文字サイズに比べ大きくなりがちである。そこで文字入力画面をで きる限り広 く確保する ための工夫が不可欠となる。また、大画面の対話型電子白板は使用者 の身長によ り操作不可 能な部分ができる、立ち位置により他のメンバから画面が見えない等の問題を生じるため、これらの問題に依存しな いユーザイ ンタフェー スでなくてはならない。
この 他 に も 対象 者 が 小 学生 と い う こと を 十分に考慮して、マニュアルを読むことのない直感的な操作、使用者が自分の実行したい機能を迷うことな く探し出せ る必要最小 限の機能を設計方針とする。

3. 壁紙新聞作成支援システム
壁紙新聞作成支援システムでは、壁紙新聞の原稿となる 記事素材を 個人が表示 一体型タブレットと電子ペンを使用して作成する機能と、対話型電子 白板を使用 してグルー プ全員で記事素材の紙 面レイアウ トの編集を 行う機能が必要である。このため、前述を記事素材作成機
能、後述を記事素材編集機能とし、本システムではこれら 2 つの機能を設けることとする。図
1 に壁紙新聞作成支援システムの機能構成を示す。

個人で記事素材を作成
記事素材作成機能
図 1

グループ全員で記事素材を編集
記事素材編集機能

壁紙新聞作成支援システムの機能構成

3.1 記事素材作成機能
記事素材作成機能は、児童が壁紙新聞の元となる原稿を 表示一体型 タブレット とパソコンで作成する機能である。本機能の典型的な画面を図 2 に示す。

情報処理学会研究報告, CE-57, Vol.2000, No.95, pp.103-110 (2000)

図 2

記事素材作成機能

キー ボ ー ド と電 子 ペ ン の併 用 と い う面 倒 な作業を無くすために、本機能の入力方法の統一化を図る。保存と読み込みの際にウィンドウズ標準のダイ アログボッ クスと同時 にファイル名を入力す るための手 書き文字入 力画面が表示される。ファイル名入力終了後、枠無文字列認識を行い、結果をウィンドウズ標準のダイアログボック スのファイ ル名入力部 分に転送することでファイル名の入力を行う。保存と読み込みのダイアログボックスを図 3 に示す。

3.1.1 機能設計
本機能は、手書きによる文字入力を行う文字入力モードと、自動改行を行う際に必要となる手書き文字 の正確な区 切り位置を 入力する区切り位置修正モードの 2 つのモードがある。
文字入力モードでは、手書き文字の入力、消去を行うことができる。手書き文字の入力の際は、太さ、色の変更が可能である。また入力画面には入力 しやすいよ う横書きの 罫線が表示され、使用者は自由に罫線幅の変更を行うことができる。必要に応じて罫線を非表示にすることも可能である。
区切り位置修正モードでは、手書き文字の区切り位置（各文字を構成するストローク列の区切り）の自動判定を行い、それに対して修正を加えることができる。区切り位置は 3.2.2 で述べる自動改行に用いる。区切り位置の自動判定には当研究室の枠無文字列認識 ４ )を使用する。

3.1.2 ユーザインタフェースの設計
自分の実 行したい機 能を探し出 せるユーザインタフェースとするため、各処理の実行はボタンにより行い、基本的に 1 回の操作で処理が完結する。たとえば、図 2 左上の切替えボタン
において鉛 筆のボタン が押されて いる時は文字を入力することができ、消しゴムのボタンが押されてい る時は文字 の消去を行 うことができる。また、罫線表示時に罫線付近にカーソルを移動するとカーソルの形状が変化し、この状態で罫線を ドラッグさ せることで 罫線の幅を任意に変更可能とする。これにより罫線の幅の変更を実際 の入力画面 でリアルタ イムに確認できる。

図 3

保存と読み込みのダイアログボックス

3.2 記事素材編集機能
記事素材編集機能は、記事素材作成機能を用いて作成された記事素材を元に、対話型電子白板を使用し て紙面レイ アウトの編 集作業を行う機能である。対話型電子白板は端末環境に比べ大画面である。そこで、使用者の身長が高かろうと低か ろうと気に せず操作が できるインタフェースを実現する。また、全ての編集作業はペンにより行う。これにより、使用者の思考を妨げることなく自然な操作が可能となる。記
事素材編集機能の典型的な画面を図 4 に示す。

3.2.1 機能設計
本機能は、記事素材作成機能を使用して作成された記事素材や、その他の記事素材である写真、絵、図、音声、動画等を元に自由に配置することで壁紙新聞を作成することができる。
はじめに、使用者がデータの格納されたフォルダを指定するシステムは、指定したフォルダから壁紙新聞の元となる記事素材を読みこみ、情報処理学会研究報告, CE-57, Vol.2000, No.95, pp.103-110 (2000)

これらを図 4 の右側の記事素材表示部分へ自動的に表示する。次に表示された記事素材に対し移動、拡大、縮小、削除を行い、メンバ全員で壁紙新聞のレイアウトを考える作業を図 4 左 側の記事素材編集部分で行う。この作業は、記事素材を記事 素材表示部 分から記事 素材変種可能部分へコピーする作業と、コピーされた記事素材のレイ アウトを考 える作業の 繰り返しによって行われる。最後に作業の現状を保存することで一連の作業は終了する。本機能における記事素材読み込みから保存までの流れを図 5 に示す。

をタップすることで任意の位置に表示できる。
メニ ュ ー バ ーを タ ッ プ する こ と に より メ ニューが表示された状態を図 8 に示す。これにより離れたところからでもメニューを手元に取

3.2.2 自動改行

3.2.3 ユーザインタフェースの設計
本機能は、大画面である対話型電子白板を使用することを大前提としているため、使用者の身長、立ち位置に依存しないユーザインタフェースが必要となるという設計方針に従う。使用者が身長を 考慮するこ となく自由 に操作を行うことができるよう、上の方にある画像を下に移動して低 い位置で編 集するため にスクロールバーを用いる。通常使用されているスクロールバーと対 話型電子白 板用スクロ ールバーを
図 6 に示す。これは、スクロール可能範囲をペンタップし ドラッグす ることによ り表示されている画面 を自由自在 にスクロー ルすることができるものである ５）。スクロール開始のためのペンタッ プはスクロ ール可能範 囲内であればどこでもよいため、使用者の身長によりスクロールの使用を制限されることがなくなる。
また、開くや保存などの各機能の選択は、メニューにより行う。メニューはメニューバー内

図 4

記事素材編集機能

記事素材読みこみ

記事素材

記事 素 材 作 成機 能 を 用 いて 作 成 さ れた 記 事
素材に対し、移動、拡大、縮小、削除というレイアウトの編集処理を行う際、システムが手書き文字を表 示すること のできる横 のスペースを自動的に計算し、そのスペースにあわせて自動改行を行うことができる。改行は、記事素材作成機能の 区切り位置 修正モード で入力された区切り位置で行う。手書き文字の自動改行の様子を図 7 に示す。

記事素材を編集可能部分へコピーコピーされた記事素材を編集

保存

図 5 読み込みから保存までの流れ

図 6 通常使用されているスクロールバー(左)と対話型電子白板用スクロールバー(右)情報処理学会研究報告, CE-57, Vol.2000, No.95, pp.103-110 (2000)

り寄せることができ、立つ位置に制限を加えず操作可能とした。

3.2.4 保存表示されている記事素材の状態、表示されている記事素 材と編集部 分の状態に 対して各々保存を行えることとする。前者の保存は、用意された記事素材の量が多かったために、使用していない記 事素材を用 いて別の壁 紙新聞を作成する場合に行うためのものである。通常、壁紙新聞は 1 枚だけ作成されることが多いため、本機能では 改ページと いう機能が ないからである。後者の保存は、壁紙新聞作成途中に壁紙新聞の作成を終了する場合に行われる。

手書き文字による記事素材を指定し移動を行う↓システムがサイズを自動的に判定し自動改行を行う

4.システムの予備評価
本システ ムによりグ ループ学習 を支援できるかどうか、及び、各機能の有用性、ユーザインタフェー スの使いや すさを明ら かにするために、実現したプロトタイプを用いて予備評価を行った。予備評価は本システムの作成進行状
況に合わせて、記事素材作成機能に対する予備評価、壁紙新聞作成支援システムに対する予備評価の 2 回に分けて行った。

図 7 手書き文字の自動改行の様子

4.1 第 1 回予備評価
記事素材作成機能を小学校 2 年生から 6 年生までの児童 6 名に使用してもらい、評価後に個別に意見を聞いた。第 1 回予備評価の様子を図9 に示す。
その結果、被験者からの意見と、評価中に感じた我々の意見を次に示す。
（１）被験者の意見
・ 手書き文字の入力、消去の切替えは分かりやすい。
・ 文章の入力は罫線があったほうが使いやすい。
・ 通常、小学生新聞は縦書きであり、作文書く場合も縦書きの原稿用紙を使用する。そのため、手書き文字の入力は横書きより縦書きのほうが入力しやすい。
・ 手書き文字の区切り位置判定にかかる時間が長く、修正の量が多い。

図8

メニューが表示された状態

図9

第 1 回予備評価の様子

情報処理学会研究報告, CE-57, Vol.2000, No.95, pp.103-110 (2000)（２）我々の意見
・ 被験者である子供の字は図 10 に示すように間隔が狭い。そのため区切り位置の判定が難しく、被験者の区切り位置の修正作業の量が多くなる。
・ 被験者である子供の字は図 10 に示すように右下がりにだんだん小さくなっていくことが多い。
・ 手書き文字の修正は 1 つの文字を全部消去して書き直すのではなく、上から書き足すことが多い。
・ 文章を入力する際、ペンの色を 8 種類、ペンの太さを 10 種類用意していたが、ほとんどの被験者がデフォルトで選択されている黒色で細い太さを使用していた。
・ 一度消去した文字を「元に戻す」機能を用いて復元する被験者はいなかった。これは、通常紙と鉛筆を使用する場合、このような機能がなく使い慣れていないためと考えられる。
・ 罫線幅の変更を行う被験者はおらず、罫線の幅いっぱいに文字を書く被験者も少なかった。

図 10・ 図や絵に対して拡大・縮小等の編集作業は行うが、手書き文字に対してはあまり行わない。また拡大縮小の際は、縦横比を変化させると元となる記事素材が変化してしまうため、縦横比を等倍で行うことが多い。
・ 記事素材の量が多い場合、目的の記事素材を探しだすのに時間がかかる。
・ 電子ペンの操作によるオブジェクトのコピー、移動、削除、拡大・縮小の編集作業は、理解しやすい。
・ 2 人 1 組で編集作業を行う場合、2 人がペンを持ちお互いに譲り合いながらスムーズに操作を行うことができる。
・ ファイル名のタップや拡大・縮小のためのハンドル操作等、ペンをタップして操作を行う際のタップ可能範囲が小さいため、操作ミスを誘発しやすい。
・ 対話型電子白板上でのスクロールは上から下に行うことが多い。

評価実験で書かれた被験者の字
図 11

第 2 回予備評価の様子

4.2 第２回予備評価
記事素材 作成機能お よび記事素 材編集機能を小学校１年生から 5 年生までの児童 10 名に使用してもらい、その様子を 2 台のビデオカメラで撮影した。第 2 回予備評価の様子を図 11に示す。
予備評価を行った後、予備評価中に撮影したビデオの分析を行った。その結果を次に示す。
・ 対話型電子白板上での電子ペンによるカーソルの移動がスムーズではないため、拡大・縮小が行いにくい。

5. 考察
2 回の予備評価による被験者の意見、我々の意見、ビデオ分析の結果により次のことがいえる。
（１）区切り位置修正モードについて
今回試作した記事素材作成機能は、罫線のある画面を使用し手書き文字の入力を行った。本システムでは、編集作業の時に文字単位での改行を行える ように区切 り位置の判 定を行って情報処理学会研究報告, CE-57, Vol.2000, No.95, pp.103-110 (2000)

いる。しかし、児童の字は文字同士の間隔が狭いため、区切り位置の判定が難しく、判定後の修正作業の量が多くなる。また、判定に時間がかかるため児童の集中力を欠く原因となる。
この問題を改善するために、記事素材作成機
能の入力画面には罫線ではなく桝目を表示し、
枡目 1 つ 1 つに手書き文字を入力することで区切り位置の 修正を行う 必要のない 方法も提供し、両者の比較、検討を行いたい。
（２）手書き文字の入力画面について
記事素材 作成機能に おける手書 き文字の入力画面は、横書きの罫線を使用した。しかし、小学校にお いて新聞を 作成するた めの原稿や作文には縦書きの原稿用紙が用いられている。
本システム は小学校の 授業内での 使用が前提であるため、本来の授業内容との矛盾があってはならない。
そこで今後は縦書きの入力画面を試作し、評価実験を行いたい。
（３）ペンの属性について
記事素材作成機能において文字の入力、消去の切替え、色と太さの変更方法は使いやすく分かりやすい との評価を 被験者から 得ることができた。しかし一方で、ペンの色や太さを変更するための サンプル数 が多すぎる との意見もあり、事実、評価中もこれらの変更を行う被験者は少なかった。このような現状をふまえ、変更のための パレットを 表示させる 方法ではなく、プルダウンによる変更方法も今後検討していきたい。
（４）対話型電子白板のユーザインタフェース
について
対話型電 子白板を使 用した記事 素材編集機
能においては、編集作業を行う際のペンジェスチャを認識する領域が狭いため、何度も同じ作業を繰り返 さなくては ならないと いう問題点があがった。また、前面から投影するタイプの対話型電子 白板を用い て予備評価 を行ったた
め、電子ペンを持つ手の影ができカーソルが見えなくなる場合もあった。このように必要のない作業を削減するために領域の拡大を行い、より円滑に編 集作業を行 うことがで きるようにする。

（５）記事素材編集機能における記事素材の表示について
今回作成したプロトタイプにおいて、記事素材表示部分に表示される記事素材は、記事素材の左上の一部が等倍で表示される。しかし、記事素材が絵や図の場合、左上が空白の場合もあり内容が把握できないという問題点を生じた。
今後 は 全 体 を縮 小 し た もの を 表 示 する こ とでこの問題を解決したい。

6. おわりに
本研究は、電子ペンによる手書きインタフェースの統合 環境の中で 小学校にお けるグルー
プ学習を支援することを目的とした。この目的を達成するためのソフトウェアの一例として、壁紙新聞作成支援システムの試作を行い、プロトタイプを実現し、その予備評価を行った。しかし、壁紙新聞作成支援システムの予備評価から、本システムに対する様々な問題点が浮かび上がってきた。今後はこれらの問題点を考慮しソフトを改良するとともに、小学校の授業で実際に利用し て頂きなが ら評価を行 う予定である。

謝辞本システムの評価実 験に参加し ていただいたすべての方々に感謝する。
本研究は、科学研究費補助金基盤研究(B)(2)11558031 の一部補助による。

参考文献
1)

2)

3)

4)

5)

楠房子、杉本雅則、橋爪宏達：相互作用を促進したグループ学習支援システム、情報処理学会
第 41 回プログラミングシンポジウム報告集、
pp.167-168（2000）
Kaori Oomika, Atsushi Naito and Masaki
Nakagawa:Idea memo PDA in scalable handwritinginterfaces, Proc.HCI’97, pp.455-458（1997）
坂東宏和、根本秀政、澤田伸一、中川正樹：黒板の情報化による教育ソフトウェア、情報処理
学会研究報告 2000-CE-56、pp.63-70（2000）
福島貴弘、中川正樹：確立モデルに基づくオン
ライン枠なし手書き文字列認識、信学技報
PRMU98-139、pp.25-30（1998）
小國健、中川正樹：対話型電子白板を用いた種々のアプリケーションのプロトタイピング、情報処理学会研究報告、96-HI-67、pp.9-16（1996）