- 追加された行はこの色です。
- 削除された行はこの色です。
- CSL11HCI へ行く。
[[ItiroSiio]]
#contents
*ヒューマンコンピュータインタラクション入門 [#n804a296]
[[http://ec2.images-amazon.com/images/I/51SsP4P1UiL._SL500_AA300_.jpg:http://www.amazon.co.jp/dp/4781912605]]
サイエンス社発行の，
ヒューマンコンピュータインタラクション入門 (Computer Science Library 11) の，
著者によるサポートページです．
誤りなどの訂正情報や，
講義などで使っていただくための図版，
プログラムのソースコード，
音声ファイルなどを提供していきます．
サイエンス社 ( http://www.saiensu.co.jp/ ) のサポートページもご覧ください．
また，サイエンス社からも，本書に掲載されている図をまとめたPDFが，
講義用資料として用意されています．
必要な方は，ご連絡先を明記の上，サイエンス社編集部( rikei@saiensu.co.jp )までご連絡ください．
**まえがき [#r9e85f86]
***訂正 [#vd2c9401]
署名が間違っていました．（誤：梶尾，正：椎尾）
**第1章 ヒューマンコンピュータインタラクション(HCI) [#ff43db39]
***図1.2 Sketchpad (1963) [#d70ca051]
-http://www.google.co.jp/images?um=1&hl=ja&client=safari&rls=en&biw=1144&bih=1365&tbs=isch%3A1&sa=1&q=sketchpad+sutherland&aq=f&aqi=&aql=&oq=&gs_rfai=
***図1.3 ダグラス・エンゲルバートのNLS (1968) [#w3a766b3]
-http://www.google.co.jp/images?um=1&hl=ja&client=safari&rls=en&biw=1144&bih=1365&tbs=isch%3A1&sa=1&q=nls+engelbart&aq=f&aqi=&aql=&oq=&gs_rfai=
**第2章 人のインタフェース特性 [#z8f6a60e]
***図2.2 等ラウドネス曲線 [#r32abe67]
-http://tiny.cc/ulcj2
***図2.3 CAPTCHAによる確認 [#jfde973b]
-http://www.google.co.jp/images?um=1&hl=ja&client=safari&rls=en&biw=1144&bih=1365&tbs=isch%3A1&sa=1&q=captcha&aq=f&aqi=g1&aql=&oq=&gs_rfai=
***図2.4 一般的なメニューの例 [#i4a7910d]
-http://is.ocha.ac.jp/~siio/hci/menuitems.png
***章末問題2：音のファイル [#t0b39380]
-正弦波（24dB, 16bit, 44,100Hzサンプリング）
--[[30Hz 正弦波:http://is.ocha.ac.jp/~siio/hci/Sin30Hz@-24dB16bit44100HzM.aiff]]
--[[60Hz 正弦波:http://is.ocha.ac.jp/~siio/hci/Sin60Hz@-24dB16bit44100HzM.aiff]]
--[[80Hz 正弦波:http://is.ocha.ac.jp/~siio/hci/Sin80Hz@-24dB16bit44100HzM.aiff]]
--[[100Hz 正弦波:http://is.ocha.ac.jp/~siio/hci/Sin100Hz@-24dB16bit44100HzM.aiff]]
--[[300Hz 正弦波:http://is.ocha.ac.jp/~siio/hci/Sin300Hz@-24dB16bit44100HzM.aiff]]
--[[600Hz 正弦波:http://is.ocha.ac.jp/~siio/hci/Sin600Hz@-24dB16bit44100HzM.aiff]]
--[[800Hz 正弦波:http://is.ocha.ac.jp/~siio/hci/Sin800Hz@-24dB16bit44100HzM.aiff]]
--[[1,000Hz 正弦波:http://is.ocha.ac.jp/~siio/hci/Sin1000Hz@-24dB16bit44100HzM.aiff]]
--[[1,500Hz 正弦波:http://is.ocha.ac.jp/~siio/hci/Sin1500Hz@-24dB16bit44100HzM.aiff]]
--[[2,000Hz 正弦波:http://is.ocha.ac.jp/~siio/hci/Sin2000Hz@-24dB16bit44100HzM.aiff]]
--[[3,000Hz 正弦波:http://is.ocha.ac.jp/~siio/hci/Sin3000Hz@-24dB16bit44100HzM.aiff]]
--[[4,000Hz 正弦波:http://is.ocha.ac.jp/~siio/hci/Sin4000Hz@-24dB16bit44100HzM.aiff]]
--[[5,000Hz 正弦波:http://is.ocha.ac.jp/~siio/hci/Sin5000Hz@-24dB16bit44100HzM.aiff]]
--[[6,000Hz 正弦波:http://is.ocha.ac.jp/~siio/hci/Sin6000Hz@-24dB16bit44100HzM.aiff]]
--[[8,000Hz 正弦波:http://is.ocha.ac.jp/~siio/hci/Sin8000Hz@-24dB16bit44100HzM.aiff]]
--[[10,000Hz 正弦波:http://is.ocha.ac.jp/~siio/hci/Sin10000Hz@-24dB16bit44100HzM.aiff]]
--[[12,000Hz 正弦波:http://is.ocha.ac.jp/~siio/hci/Sin12000Hz@-24dB16bit44100HzM.aiff]]
--[[15,000Hz 正弦波:http://is.ocha.ac.jp/~siio/hci/Sin15000Hz@-24dB16bit44100HzM.aiff]]
--[[17,000Hz 正弦波:http://is.ocha.ac.jp/~siio/hci/Sin17000Hz@-24dB16bit44100HzM.aiff]]
--[[20,000Hz 正弦波:http://is.ocha.ac.jp/~siio/hci/Sin20000Hz@-24dB16bit44100HzM.aiff]]
-矩形波（24dB, 16bit, 44,100Hzサンプリング）
--[[600Hz 矩形波:http://is.ocha.ac.jp/~siio/hci/Sqr600Hz@-24dB16bit44100HzM.aiff]]
--[[800Hz 矩形波:http://is.ocha.ac.jp/~siio/hci/Sqr800Hz@-24dB16bit44100HzM.aiff]]
--[[1,000Hz 矩形波:http://is.ocha.ac.jp/~siio/hci/Sqr1000Hz@-24dB16bit44100HzM.aiff]]
--[[1,500Hz 矩形波:http://is.ocha.ac.jp/~siio/hci/Sqr1500Hz@-24dB16bit44100HzM.aiff]]
--[[2,000Hz 矩形波:http://is.ocha.ac.jp/~siio/hci/Sqr2000Hz@-24dB16bit44100HzM.aiff]]
***章末問題3：ソースコード [#k497ebbd]
#include <time.h>
#include <sys/time.h>
#include <stdio.h>
double gettimeofday_sec()
{
struct timeval tv;
gettimeofday(&tv, NULL);
return tv.tv_sec + (double)tv.tv_usec*1e-6;
}
int main(void) {
double t1, t2;
sleep(5);
printf("hit now");
t1=gettimeofday_sec();
getchar();
t2=gettimeofday_sec();
printf("time = %10.30f\n", t2 - t1);
return 0;
}
**第3章 人と人工物のインタフェース [#t4fe023a]
**第4章 ヒューマンインタフェースデバイス [#aadd010a]
***図4.8 カラーフィルタの例 [#a03b2a40]
-[[http://is.ocha.ac.jp/~siio/hci/800px-LCD_RGBS.jpg:http://en.wikipedia.org/wiki/File:LCD_RGB.jpg]] &br; (クリックで拡大および出典へ)
***図4.9 電子ペーパの例 [#p1806d3c]
-[[http://is.ocha.ac.jp/~siio/hci/epaperS.png:http://is.ocha.ac.jp/~siio/hci/epaper.png]] &br; (クリックで拡大)
**第5章 ハードウェアインタフェース [#ufa2e421]
***p.90 ソースコード [#pdc12bbe]
byte result; //スイッチの状態を読み込む変数
while(1) { //以下を無限に繰り返す
result=inb(100); //スイッチの状態を読み込む
if((0x01 & result)==0) outb(1, 101); //スイッチオンで点灯
else outb(0,101); //スイッチオフで消灯
usleep(30000L); //30ms待つ
}
***p.93 ソースコード [#b4b26842]
main(void) {
int paraport;
unsigned char value;
paraport= open("/dev/para",O_RDWR);
if(paraport < 0) exit(1); //openに失敗したら中止
for (;;) { //無限ループ
usleep(100000L); //0.1秒待つ
if ( read(paraport, &value, 1) <= 0 ) break;
print("value is %x･n", value);
usleep(100000L); //0.1秒待つ
if((value & 0x10) == 0)
value=value | 0x01; //LSBを1にする
else
value=value & 0xFE; //LSBを0にする
write(paraport, &value, 1); //ポートに書き出す
}
close(paraport);
}
***p.94 ソースコード [#w8077c39]
static unsigned int busy = 0;
static int para_open (struct inode * inode, struct file * file) {
if (busy) return -1;//使用中だったら中止
request_region(0x378,1, "para"); //never fails
busy = 1;//使用中であるフラグを立てる
return 0;
}
static int para_release (struct inode * inode, struct file * file) {
release_region(0x378, 1);
busy = 0;//使用中であるフラグを下ろす
return 0;
}
static ssize_t para_read
(struct file * file, char * buf, size_t count, loff_t * ploff) {
int i;
char result;
result = inb(0x378);//ポートから読む
i = verify_area (VERIFY_WRITE, buf, count); //利用可能？
if (i) return i;
copy_to_user (buf, &result, 1);//bufの場所へ読んだ結果を書く
return 1;
}
static ssize_t para_write
(struct file * file, const char * buf, size_t count, loff_t * ploff) {
char value, data;
copy_from_user (&value, buf, 1);//bufの値を読む
outb(value, 0x378); //ポートに書き込む
return 1;
}
static struct file_operations para_fops = { //関数対応表
NULL, //struct module *owner
NULL, //lseek
para_read, //read
para_write, //write
NULL, //readdir
NULL, //select
NULL, ///ioctl
NULL, //mmap
para_open, //open
NULL, //flush
para_release, //release
NULL, //fsync
NULL, //fasync
NULL, //lock
NULL, //readv
NULL //writev
};
int init_module (void) {//デバイスドライバと対応表を登録
int i;
i = register_chrdev (63, "para", & para_fops);
if (i) return - EIO;
return 0;
}
void cleanup_module (void) {
unregister_chrdev (63, "para");
}
**第6章 グラフィカルユーザインタフェース(GUI) [#u98abc4c]
**第7章 GUIプログラミング [#ud5e68b2]
***p.124 ソースコード [#u417da05]
\#include <X11/Xlib.h>
\#include <stdio.h>
int main (){
Display *display = XOpenDisplay (NULL);
XEvent event;
Window window = XCreateSimpleWindow(display, DefaultRootWindow(display),0,0,150,100,0,0,0);
XSelectInput(display,window,KeyPressMask | ButtonPressMask);
XMapWindow(display, window);
XFlush(display);
while(1) { //無限ループ
XNextEvent(display,&event); //イベントを受け取る
switch (event.type) { //イベントの内容に従って分岐
case KeyPress: //キーボードが押されたら
printf("key\n"); //keyと表示
break;
case ButtonPress: //マウスボタンが押されたら
printf("button\n"); //buttonと表示
break;
}
}
return 0;
}
***p.131 ソースコード [#l0c046ba]
import java.awt.*; //GUI関連のクラスを利用することの宣言
public class SimpleWindow { //クラスSimpleWindowの記述
public static void main(String args[]) { //クラスメソッドmainの記述
Frame f; //クラスFrameのインスタンスを参照する変数
f = new Frame(); //Frameクラスからインスタンスを生成，fに代入
f.setTitle("hello world");//インスタンスメソッド呼び出し
f.setSize(300,200); //インスタンスメソッド呼び出し
f.setVisible(true); //インスタンスメソッド呼び出し
}
}
***p.134 ソースコード [#zcdf2af6]
import java.awt.*;
public class SimpleWindow extends Frame {//Frameクラスを継承
public void initialize (String title) {//インスタンスメソッドの記述
setTitle(title); //スーパークラスのインスタンスメソッドを呼び出し
setSize(300,200); //これもスーパークラスのインスタンスメソッド
setVisible(true); //これもスーパークラスのインスタンスメソッド
}
public static void main(String args[]) {//クラスメソッドmainの記述
SimpleWindow f;//SimpleWindowのインスタンス格納用変数
f=new SimpleWindow(); //インスタンスを生成，fに代入
f.initialize("hello world");//インスタンスメソッド呼び出し
}
}
***p.135 ソースコード [#v126466f]
import java.awt.*;
import java.awt.event.*;
public class SimpleWindow extends Frame implements ActionListener {
//Frameクラスを継承し，ActionListenerを実装する
public void initialize (String title) {//インスタンスメソッドの記述
setTitle(title); //スーパークラスのインスタンスメソッド呼び出し
enableEvents(AWTEvent.WINDOW_EVENT_MASK);
Button b = new Button("Push Me!!"); //インスタンスを作ってbに代入
b.addActionListener(this); //イベント受取り先に本インスタンスを登録
add(b); //本インスタンスにボタンを貼り付け
setSize(200,100); //インスタンスメソッドsetSizeを呼び出し
setVisible(true); //インスタンスメソッドsetVisibleを呼び出し
}
public void actionPerformed(ActionEvent e) { //イベントハンドラー
System.out.println("thank you."); //ボタン押されたら文字を表示
}
public static void main(String args[]) {//クラスメソッドの記述
SimpleWindow f;//SimpleWindowクラスのインスタンスを参照する変数
f=new SimpleWindow(); //インスタンスを生成，fに代入
f.initialize("Simple Button");//インスタンスメソッド呼び出し
}
}
***p.141 ソースコード [#c00c5f9f]
\#import "FCConverter.h"
@implementation FCConverter
- (IBAction)takeIntValueFrom:(id)sender {
}
@end
***p.142 ソースコード [#r6af7f71]
\#import "FCConverter.h"
@implementation FCConverter
- (IBAction)takeIntValueFrom:(id)sender {
int degreeF; //華氏の値を保持する変数
float degreeC; //摂氏の値を保持する変数
degreeF = [sender intValue]; //スライダから値を得る
[fText setIntValue: degreeF]; //華氏の文字フィールドに書出す
degreeC=(float)(degreeF-32) * 5.0 / 9.0; //華氏摂氏換算計算
[cText setFloatValue: degreeC]; //摂氏の文字フィールドに書出す
}
@end
***章末問題ソースコード [#b08dda7d]
public class SampleWindow extends Frame {
public static void main(String args[]) {
SampleWindow w = new SampleWindow();
w.setVisible(true);
}
}
**第8章 インタフェースの評価 [#v3d40951]
**第9章 インタフェースの手法 [#c93bf7a0]
***図9.8 バーコードの例 [#k4406d41]
-http://is.ocha.ac.jp/~siio/hci/barcode_HCI_Code39.png
-http://is.ocha.ac.jp/~siio/hci/barcode_URL_QRcode.png
***章末問題2 図A.3 [#p8bdb869]
-[[http://is.ocha.ac.jp/~siio/hci/barcode_decodeS.png:http://is.ocha.ac.jp/~siio/hci/barcode_decode.png]] &br; （クリックで拡大）
**第10章 次世代インタフェース [#u6b4c7b5]
-----
ご質問，ご要望などは siio@is.ocha.ac.jp までお寄せください．
![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
