プロジェクト（金岡グループ） ·...
TRANSCRIPT
プロジェクト（金岡グループ）第1回金岡 晃
プロジェクトの全体像
シラバスより
実践的なテーマに基づく、情報システム開発の演習を通して、目標設定、計画、実行、評価の基本的な流れを習得する。情報システム開発の演習を通して、ネットワーク、データベース、JavaScript、PHPなどのWebサービス開発用の言語についての基礎を習得する。自ら目標設定し、開発工程を管理し、グループメンバと協力して一つの目標を達成する経験を通して、プロジェクトの推進方法を理解し、メンバーと協力してプロジェクトに参画できるようになる。
授業の目的と学習成果
プロジェクト1
金岡プロジェクトテーマ
配布資料より
テーマC 独自チャットボット作成
コミュニケーションツールSlack上で動き回るチャットボットシステムを作成する。シェルスクリプトやJavaScriptなどのスクリプト言語と、外部APIやデータセットの活用により、チームごとに特色のあるチャットボットの実現を試みる。
Slack？
チャットボット？
外部API？データセット？
このあたりを今日解説します
プロジェクト2
金岡プロジェクトテーマ
配布資料より
テーマC 独自チャットボット作成
コミュニケーションツールSlack上で動き回るチャットボットシステムを作成する。シェルスクリプトやJavaScriptなどのスクリプト言語と、外部APIやデータセットの活用により、チームごとに特色のあるチャットボットの実現を試みる。
技術要素
なんらかの言語を使ったプログラミング
外部リソースの活用
HTTPによるアクセス
プロジェクト3
スケジュール
内容
第1回 プロジェクトの概要説明、基礎知識の学習（１）
第2回 基礎知識の学習（２）、Botデザイン
第3回 Botデザインまとめ、発表
第4回 開発（１）
第5回 開発（２）
第6回 開発（３）
第7回 成果発表会
プロジェクト4
成果報告の形式、提出物
成果報告の形式
• プレゼンテーション• 狙い、利用した技術、工夫した点や改善した点、残課題
• ライブデモ
プロジェクト5
• 出席状況＜プロジェクト参加状況＞• レポート（個人ごと）＜授業態度、実験成果＞• プレゼンテーション（チーム）＜授業態度、実験成果＞• 成果物（チーム）＜実験成果＞
評価
シラバスより
原則として、プロジェクト参加状況50％、授業態度25％、実験成果25％として評価する。プロジェクトの進め方、成果・作品等は改善点などを講評する。
金岡プロジェクトでの評価
独自性 面白さ ソースコードの質
プロジェクト6
金岡プロジェクトテーマ
配布資料より
テーマC 独自チャットボット作成
コミュニケーションツールSlack上で動き回るチャットボットシステムを作成する。シェルスクリプトやJavaScriptなどのスクリプト言語と、外部APIやデータセットの活用により、チームごとに特色のあるチャットボットの実現を試みる。
Slack？
チャットボット？
外部API？データセット？
このあたりを今日解説します
プロジェクト7
SLACKとは
プロジェクト8
Slackとは
Slack（スラック）
コミュニケーションツール。グループでのチャットを中心として、ユーザ間のダイレクトメッセージやトピックごとのチャットなどが可能なWebサービス
https://slack.com/
類似・近いサービス？
プロジェクト9
ブラウザからSlackにログインしたところ
プロジェクト10
Slackのポイント（１）
チームごとに作成
• チームごとにSlackの場所を作成可能• チームには複数のユーザが参加可能（ユーザ数無制限）• チームごとに独自URLが与えられる
• たとえば金岡研Slackの場合は https://toho-klab.slack.com/• 上記の”toho-klab”がチーム名• チームのドメインに使われる名称は重複してはいけない
プロジェクト11
Slackのポイント（２）
チャット
• チーム全体• ユーザ同士（ダイレクトメッセージ）• チャンネル
• チームのうち特定のユーザが参加したチャットルーム
• 他のチームユーザへ公開するものと、非公開にするもの（プライベートチャンネル）がある
• チャンネル名のあたまには「＃」が付く
• 厳密にはチーム全体のチャットも#general というチャンネルになる
プロジェクト12
Slackのポイント（３）
ファイル共有
• ドラックアンドドロップで簡単に可能
プロジェクト13
Slackのポイント（４）
リンクの貼り付け
• URLを貼り付けると、そのタイトルや要約、サムネイル画像などが出る
プロジェクト14
Slackのポイント（５）
スニペット
• 「切れ端」という意味
• ソースコードの一部などを貼り付けて共有可能
プロジェクト15
Slackのポイント（６）
対応プラットフォームの充実
• ブラウザから利用可能• 専用アプリケーション
• デスクトップアプリ：Windows OS, Mac OS X, Linux (Ubuntu, Fedora)
• モバイルアプリ：iOS (iPhone, iPad), Android OS, Windows Mobile
プロジェクト16
Slackのポイント（７）
連動アプリケーション
• 連動するアプリケーションが非常に多い
プロジェクト17
連動アプリ：Google Hangout
プロジェクト18
連動アプリ：Google カレンダー
プロジェクト19
コマンド：リマインド
プロジェクト20
コマンド：リマインド
プロジェクト21
Slackチームを作ろう
プロジェクト23
まずSlackのページにブラウザでアクセス https://slack.com/
ここにメールアドレスを入力して「Get Started」ボタンを押す
Slackチームを作ろう
プロジェクト24
Slackチームを作ろう
プロジェクト25
ページの下に移動する
「ワークスペースを新規作成」を押す
Slackチームを作ろう
プロジェクト26
Slackチームを作ろう
プロジェクト27
さきほど入力したメールアドレスに6桁のコードが含まれたメールが届いているのでそれを入力
Slackチームを作ろう
プロジェクト28
名前（氏名）とユーザアカウント名を入れて、「パスワードへ進む」を押す
Slackチームを作ろう
プロジェクト29
パスワードを入力して「ワークスペース情報へ進む」を押す
Slackチームを作ろう
プロジェクト30
こんな感じで入力してください
Slackチームを作ろう
プロジェクト31
グループ名を入力※ここは好きな名前を付けられます
Slackチームを作ろう
プロジェクト32
グループ名に従ったURLの決定※ここの名称はすでに誰かに使われてたらダメ
このURL、メモしておきましょう。
Slackチームを作ろう
プロジェクト33
同意しますか？と聞かれているので同意するなら「同意します」を押す
Slackチームを作ろう
プロジェクト34
ここで自分以外のユーザを招待（Invite）できるので、他のメンバを招待しましょう。
入力されたメールアドレスにメールが届きますので確認しましょう
Slackチームを作ろう
プロジェクト35
いろいろとSLACKをいじってみよう
プロジェクト36
いろいろいじってみよう
プロジェクト37
まずはみんなでチャットしよう
#general で入力すると、みんなにメッセージが届きます
個人同士でメッセージをやりとりしてみよう
DIRECT MESSAGESでユーザ名を選んで、そこで入力すると、そのユーザにメッセージが届きます。これは他ユーザには見えません。
いろいろいじってみよう
プロジェクト38
プロフィール画像の変更
このマークをクリック
いろいろいじってみよう
プロジェクト39
“プロフィール＆アカウント”をクリック
プロフィール画像の変更
いろいろいじってみよう
プロジェクト40
プロフィール画像の変更
“プロフィールを編集する”をクリック
いろいろいじってみよう
プロジェクト41
プロフィール画像の変更
アイコン画像の上にマウスカーソルを持ってくる
いろいろいじってみよう
プロジェクト42
プロフィール画像の変更
クリックするとファイルを選択する画面になるので画像ファイルを選択
いろいろいじってみよう
プロジェクト43
プロフィール画像の変更
“プロフィール写真を保存”で保存
いろいろいじってみよう
プロジェクト44
見た目を変えてみよう
いろいろなところの色を変更可能
いろいろいじってみよう
プロジェクト45
見た目を変えてみよう
このマークをクリック
いろいろいじってみよう
プロジェクト46
“環境設定”をクリック
見た目を変えてみよう
いろいろいじってみよう
プロジェクト47
“サイドバー”をクリック
見た目を変えてみよう
いろいろいじってみよう
プロジェクト48
見た目を変えてみよう
スクロールバーを下げていくと、いくつかのパターンが選択できる
いろいろいじってみよう
プロジェクト49
見た目を変えてみよう
細かく色を指定したい場合はここをクリック
いろいろいじってみよう
プロジェクト50
“Slackをカスタマイズ”をクリック
絵文字を登録してみよう
いろいろいじってみよう
プロジェクト51
絵文字を登録してみよう
その絵文字を出すときに入力する文字列を入力
出力される画像ファイルを選択
いろいろいじってみよう
プロジェクト52
絵文字を登録してみよう
画像ファイルは128ピクセルx128ピクセル
までなので注意
いろいろいじってみよう
プロジェクト53
絵文字を登録してみよう
その他のTips
プロジェクト55
Pin
「お気に入り」のように使える
Post
スニペットのようなものを、複数ユーザで共同編集できる
チャットボット
プロジェクト56
チャットボット
プロジェクト57
ボット
チャット上でユーザとして参加してくるボット（プログラム）を作ることができる
プログラムのこと。特に人間に代わって作業を行うものを指すことが多い。マルウェアの用語としての一面も持つ。SiriやContanaもボットの一種
さまざまなプラットフォームで利用
プロジェクト58
LINE
自動的に投稿がされるLINE NEWSや、その他企業や芸能人アカウントなど
• https://matome.naver.jp/odai/2135855964060612201
• http://www.appgaku.com/iphone-
pickup/2013/08/20130806006767.html
その他
Skype、Facebook Messengerなど
どんなボットがあるか
• 計算してくれる
• ランダムに画像投稿
• StackOverflow
• 猫ボット
• 電車の遅延連絡
プロジェクト59
代表的な事例 • 天気
• ニュース
• スケジュール
• タスク管理
• レストラン・ホテル予約
変わり種
Slackボット：天気
プロジェクト60
Weather App
“/weather 都市名”で天気を表示してくれる
Slackボット：ニュース
プロジェクト61
RSS
各サイトのRSSをチェックして、新着があったらつぶやく
Slackボット：スケジュール
プロジェクト62
Googleカレンダー
Googleカレンダーと同期して、予定が入力されたときや、週初めでのアナウンス、予定直前でのアナウンスなどがされる
Slackボット：変わり種
プロジェクト63
mathbot
http://plus.appgiga.jp/masatolan/2015/07/02/56363/
Slackボット：変わり種
プロジェクト64
猫ボット
http://www.e-agency.co.jp/column/slackbot_ai.html
簡単なボットならすぐできる
プロジェクト65
“Slackをカスタマイズ”をクリック
Slackbotへの登録
簡単なボットならすぐできる
プロジェクト66
Slackbotへの登録
“Slackbot”タブをクリック
簡単なボットならすぐできる
プロジェクト67
Slackbotへの登録
Botが反応するキーワードを入力
反応するコメントを入力
簡単なボットならすぐできる
プロジェクト68
Slackbotへの登録
簡単なボットならすぐできる
プロジェクト69
来週は
• より本格的なSlackbotを作るには
• このプロジェクトでSlackbotを作るための環境説明
• どんどん先に進みたい人は、以下のキーワードで調べ物をしておくといいかも
– “Node.js”と“Slackボット”
• JavaScriptでのSlackボット開発
– “Hubot”と“Slackボット”
• PythonでのSlackボット開発
• 次回資料も早晩アップするのでそちらも参照しておいてください
プロジェクト70