天神おしごと学校 ar技術を使ったミライの仕事

69
2016.08.18 AR(拡張現実)技術を 使ったミライの仕事 ARコンテンツ作成勉強会

Upload: yusuke-matsumoto

Post on 20-Mar-2017

265 views

Category:

Technology


0 download

TRANSCRIPT

Page 1: 天神おしごと学校 AR技術を使ったミライの仕事

2016.08.18

AR(拡張現実)技術を使ったミライの仕事

ARコンテンツ作成勉強会

Page 2: 天神おしごと学校 AR技術を使ったミライの仕事

今日の先生

吉永崇松本祐典

Page 3: 天神おしごと学校 AR技術を使ったミライの仕事

撮影・録音などの記録

撮影OK 録音OK

Page 4: 天神おしごと学校 AR技術を使ったミライの仕事

今日のハッシュタグ

#AR_Fukuoka

今日の様子は、SNSやWebサイトに掲載する場合がございますご理解ご協力よろしくお願い申し上げます

Page 5: 天神おしごと学校 AR技術を使ったミライの仕事

お手元にありますか?

パソコン スマートフォン

Page 6: 天神おしごと学校 AR技術を使ったミライの仕事

アプリをダウンロードしましょう

Zapparザッパーー

iPhoneiTunes Storre

AndrroidGoogle Plaay

Page 7: 天神おしごと学校 AR技術を使ったミライの仕事

きょうのプログラム

オリジナルAR名刺を作ろう後半

AR技術を使ったミライの仕事前半

Page 8: 天神おしごと学校 AR技術を使ったミライの仕事

ARってなに?

知っってている人??(挙手)

Page 9: 天神おしごと学校 AR技術を使ったミライの仕事

ARってなに?

Page 10: 天神おしごと学校 AR技術を使ったミライの仕事

ARってなに?

Page 11: 天神おしごと学校 AR技術を使ったミライの仕事

ARってなに?

Page 12: 天神おしごと学校 AR技術を使ったミライの仕事

ARってなに?

参照元NHK

Page 13: 天神おしごと学校 AR技術を使ったミライの仕事

ARってなに?

Page 14: 天神おしごと学校 AR技術を使ったミライの仕事

ミライのARって?

Page 15: 天神おしごと学校 AR技術を使ったミライの仕事

ミライのARって?

Page 16: 天神おしごと学校 AR技術を使ったミライの仕事

ARってなに? まとめ

ミライをもっっとと豊かににする技術

Page 17: 天神おしごと学校 AR技術を使ったミライの仕事

AR名刺をつくろう

Page 18: 天神おしごと学校 AR技術を使ったミライの仕事

制作の流れ

自己紹介ムービーを撮影する1アプリのの使い方を学ぶ2名刺を完成させる3

Page 19: 天神おしごと学校 AR技術を使ったミライの仕事

制作の流れ

自己紹介ムービーを撮影する1アプリのの使い方を学ぶ2名刺を完成させる3

Page 20: 天神おしごと学校 AR技術を使ったミライの仕事

自己紹介ムービーを撮影しよう

ルール

1.始めのあいさつ

2.名前を教える

3.趣味を教える

4.特技を教える

5..終わりののああいいささつつ

Page 21: 天神おしごと学校 AR技術を使ったミライの仕事

自己紹介ムービーを撮影しよう

カンペを作る

1.始めのあいさつ

2.名前を名乗る

3.趣味を教える

4.特技を教える

5..終わりののああいいささつつ

はじめまして。

よろしくお願いします。

Page 22: 天神おしごと学校 AR技術を使ったミライの仕事

自己紹介ムービーを撮影しよう

撮影

Page 23: 天神おしごと学校 AR技術を使ったミライの仕事

自己紹介ムービーを撮影しよう

保存

Page 24: 天神おしごと学校 AR技術を使ったミライの仕事

制作の流れ

自己紹介ムービーを撮影する1アプリのの使い方を学ぶ2名刺を完成させる3

Page 25: 天神おしごと学校 AR技術を使ったミライの仕事

今回、使うアプリの紹介

Zapparザッパー

専用マーカーや画像認識につかって、テキストや画像、動画、音声など、コンテンツを表示するスマートフォンアプリ。

Page 26: 天神おしごと学校 AR技術を使ったミライの仕事

ログインhttps://zap.works/ にアクセス

Page 27: 天神おしごと学校 AR技術を使ったミライの仕事

ログイン

ログイン((22回回目目以以降降))ユユーーザザーー登登録録をを作作るる((初初回回))

Page 28: 天神おしごと学校 AR技術を使ったミライの仕事

ログイン

ログインボボタタンををククリリッックク

Page 29: 天神おしごと学校 AR技術を使ったミライの仕事

ログイン

①Emailを入力

②Passwordを入力

③ボタンンをクリック

EmailとPasswordを入力すするる

Page 30: 天神おしごと学校 AR技術を使ったミライの仕事

ログイン成功

クリックダッシュボード(アカウントの管理画面)

Page 31: 天神おしごと学校 AR技術を使ったミライの仕事

情報の登録

クリックマーカーと情報の管理画面

Page 32: 天神おしごと学校 AR技術を使ったミライの仕事

情報の登録

情報をを登録すするる

Page 33: 天神おしごと学校 AR技術を使ったミライの仕事

情報の登録

1つのの画像を登登録録たくさんのの画像をアルバムとして登登録録

1つのの動画を登登録録1つのの音声を登登録録連絡先を登登録録

カレンダーイベントを登登録録WebサイトURLを登登録録

Page 34: 天神おしごと学校 AR技術を使ったミライの仕事

情報の登録

1つのの画像を登登録録たくさんのの画像をアルバムとして登登録録

1つのの動画を登登録録1つのの音声を登登録録連絡先を登登録録

カレンダーイベントを登登録録WebサイトURLを登登録録

Page 35: 天神おしごと学校 AR技術を使ったミライの仕事

1つの動画を登録

クリック

Page 36: 天神おしごと学校 AR技術を使ったミライの仕事

1つの動画を登録

アップロードををクリック

Page 37: 天神おしごと学校 AR技術を使ったミライの仕事

1つの動画を登録

クリック

sampleフォルダ > 011_video >撮影した動動画画 をを選ぶ

Page 38: 天神おしごと学校 AR技術を使ったミライの仕事

1つの動画を登録

クリック

クリック

Page 39: 天神おしごと学校 AR技術を使ったミライの仕事

1つの動画を登録

クリック

クリック

Page 40: 天神おしごと学校 AR技術を使ったミライの仕事

1つの動画を登録

撮影した動動画画ををクリック

クリック

Page 41: 天神おしごと学校 AR技術を使ったミライの仕事

1つの動画を登録/完了スマートフォンアプリで見てみよう

クリリック

Page 42: 天神おしごと学校 AR技術を使ったミライの仕事

スマートフォンアプリで見てみよう

グレーーになればOK

Page 43: 天神おしごと学校 AR技術を使ったミライの仕事

スマートフォンアプリで見てみよう

①アアププリリを起動させる ②ママーーカーーがででててきた ③かざしててみみよようう

Page 44: 天神おしごと学校 AR技術を使ったミライの仕事

連絡先を登録

クリック

Page 45: 天神おしごと学校 AR技術を使ったミライの仕事

連絡先を登録

クリック

5つの情報をを追加-画像 UPLOAD IMAGE-苗字 First name-名前 Last name-学校名 Company-電話番号 Home Phone

Page 46: 天神おしごと学校 AR技術を使ったミライの仕事

連絡先を登録

クリック

Page 47: 天神おしごと学校 AR技術を使ったミライの仕事

連絡先を登録

クリック

クリック

Page 48: 天神おしごと学校 AR技術を使ったミライの仕事

連絡先を登録

クリック

クリック

Page 49: 天神おしごと学校 AR技術を使ったミライの仕事

連絡先を登録

クリック

クリック

Page 50: 天神おしごと学校 AR技術を使ったミライの仕事

連絡先を登録

5つの情報をを追加-画像 UPLOAD IMAGE-苗字 First name-名前 Last name-学校名 Company-電話番号 Home Phone

Page 51: 天神おしごと学校 AR技術を使ったミライの仕事

連絡先を登録

クリック

Page 52: 天神おしごと学校 AR技術を使ったミライの仕事

スマートフォンアプリで見てみよう

クリリック

Page 53: 天神おしごと学校 AR技術を使ったミライの仕事

スマートフォンアプリで見てみよう

グレーーになればOK

Page 54: 天神おしごと学校 AR技術を使ったミライの仕事

スマートフォンアプリで見てみよう

①更新する ②ママーーカーーにかざす ③見見ててみみよようう

Page 55: 天神おしごと学校 AR技術を使ったミライの仕事

制作の流れ

アプリのの使い方を学ぶ1自己紹介ムービーを撮影する2名刺を完成させる3

Page 56: 天神おしごと学校 AR技術を使ったミライの仕事

名前

住所 〒

連絡先

学校名

名刺を完成させる

手書きで書く- 学校名- 名前- 住所- 連絡先(自宅の番号)

Page 57: 天神おしごと学校 AR技術を使ったミライの仕事

名刺を完成させる

完成

Page 58: 天神おしごと学校 AR技術を使ったミライの仕事

さいごに

http://www.vizyoshinaga.sakura.ne.jp/arfukuoka/

「ARコンテンツ作成勉強会」でインターネット検索してくだささいい

もっと詳ししくく知りたい方は

Page 59: 天神おしごと学校 AR技術を使ったミライの仕事

さいごに

もっと詳しく知りたい方は

Zapparで簡単AR: アカウントを作成ししようhttp://tks-yoshinaga.hatenablog.com/entry/2015/06/28/145947

Zapparで簡単AR: ARブラウザを使っってみようhttp://tks-yoshinaga.hatenablog.com/entry/2015/06/28/132305

Zapparで簡単AR: 動画表示コンテンツを作っってみようhttp://tks-yoshinaga.hatenablog.com/entry/2015/06/28/183053

Page 60: 天神おしごと学校 AR技術を使ったミライの仕事

2016年10月29日(土)30日(日)西新パレス

夏の自由研究を発表しよう

Page 61: 天神おしごと学校 AR技術を使ったミライの仕事

おまけ

マーカーの作り方

Page 62: 天神おしごと学校 AR技術を使ったミライの仕事

マーカーを作る(1/3)

ボタンををクリック

Page 63: 天神おしごと学校 AR技術を使ったミライの仕事

マーカーを作る(2/3)

①名前をを書く

②circleをを選ぶ

③ボタンををクリック

Page 64: 天神おしごと学校 AR技術を使ったミライの仕事

マーカーを作る(3/3)

①widgetsを選選ぶぶ

②②ボボタタンンをククリリッックク

Page 65: 天神おしごと学校 AR技術を使ったミライの仕事

マーカーの完成

クリックダッシュボード(アカウントの管理画面)

Page 66: 天神おしごと学校 AR技術を使ったミライの仕事

おまけ

削除の仕方

Page 67: 天神おしごと学校 AR技術を使ったミライの仕事

画像を削除する

クリック

Page 68: 天神おしごと学校 AR技術を使ったミライの仕事

画像を削除する(1/2)

クリックして削削除除すするる

Page 69: 天神おしごと学校 AR技術を使ったミライの仕事

画像を削除する(2/2)