Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

第1回 IT講座 IT基礎知識

1,906 views

Published on

中学生・高校生向けにIT講座を開いてきました。
第1回目は自己紹介、webの世界について、ITの基礎知識について学びました。

■ 第1回 IT講座 IT基礎知識
https://www.slideshare.net/s-komori/1-it-it-82954806

■ 第2回 IT講座 ゲームを作るって?
https://www.slideshare.net/s-komori/2-it-83019937

■ 第3回 IT講座 ゲームを作ってみよう! 基礎編
https://www.slideshare.net/s-komori/3-it-82957912

■ 第4回 IT講座 ゲームを作ってみよう! 応用編
https://www.slideshare.net/s-komori/4-it-82958211

■ 第5回 IT講座 ゲームを作ってみよう! 実践編
https://www.slideshare.net/s-komori/5-it-82958449

【連絡先】
小森俊哉/Shunya Komori
株式会社デイブレイク Webディレクター
http://www.day-b.jp/

Published in: Education
  • Be the first to comment

  • Be the first to like this

第1回 IT講座 IT基礎知識

  1. 1. IT講座 第1回 株式会社デイブレイク
  2. 2. 講師紹介 小森俊哉 こもりしゅんや 1990年生まれ。横浜育ち。 2015年、株式会社デイブレイク入社。 Webディレクター。 中高時代はバスケットボール部に所属し、 勉強しつつ格闘ゲームにハマっていました。 大学・大学院にてデザインを学び、卒業後 デイブレイクに入社。 webの世界でエンジニア、デザイナーを経 て現在はディレクターの仕事に従事してい ます。 クライアントに満足してもらえる仕事がで きるよう毎日奮闘中です。 プライベートではゲームセンターでよく遊 んでいます。
  3. 3. 講師紹介 中島宏美 なかじまひろみ 1992年生まれ。東京都出身。 2015年、株式会社デイブレイク入社。 Webデザイナー。 PhotoshopやIllustratorを使ったWebサイ トのデザインや画像加工、HTML、CSSでの サイト構築などを行っています。 よくハンバーガーやラーメンを食べていま す。ファーストフードだとロッテリアが一 番好きです。 タワーレコードをうろうろするのが趣味。 最近は欅坂46にはまっています。 高校生の頃は、油絵描いたりしてました!
  4. 4. 全講義内容について 1. IT基礎知識 自己紹介、webの世界について、ITの基礎知識について学ぶ。 2. ゲームを作るって? ゲームを作るのに必要な知識を学ぶ。プログラミングの基本的な考え方を学ぶ。 3. ゲームを作ってみよう!/基礎編 簡単なゲームを作ってみる。 Javascript ライブラリのphina.js を使うことを考えています。 4. ゲームを作ってみよう!/応用編 基礎編よりも難しい内容のゲームを作ってみる。 5. ゲームを作ってみよう!/実践編 自分たちでゲームを考えてみて実際に作ってみる。
  5. 5. IT講座とはいうけど、 ITって何? そもそもの話・・・
  6. 6. ITとは Information Technology の略 情報を得て、保存し、伝えていく技術 という意味
  7. 7. 情報を処理するコンピューターと 情報の通信を行うインターネットを 使った技術のこと コンピューター インターネット
  8. 8. その技術を使った仕事を IT業界なんて言ったりします システムエンジニア WEBデザイナー
  9. 9. WEBとは インターネットなどを通じて、 誰もが情報を見ることができるように 公開する仕組み のこと
  10. 10. WEBの語源 HPアドレスなどの頭にある www(World Wide Web)を省略した言葉 https://www.yahoo.co.jp/ これです 世界中に広がる情報網が「クモの巣」のように見える という理由で、名付けられたと言われています。
  11. 11. じゃあ https://www.yahoo.co.jp/ みたいなのは一体なんなの?
  12. 12. WEBサイトが 見れるまでの道のり 遠いところの情報がどうして見れるんだろう・・・
  13. 13. Webサイト表示の仕組み インターネットに接続されているコンピュー ターには全て住所が与えられています。 (家と一緒) → IPアドレスといいます。 IPアドレスの例 192.168.0.1
  14. 14. Webサイト表示の仕組み WEBサイトを多くの人が見るためには、 IPアドレスだとわかりにくいので、 ドメインと呼ばれるものを使っています。 それが https://www.yahoo.co.jp/ これのこと
  15. 15. Webサイト表示の仕組み 住所→IPアドレス 192.168.0.1 お店名→ドメイン https://www.yahoo.co.jp/ 〒000-0000 東京都〇〇区〇〇町1-1-1
  16. 16. WEBページを遠くの人に 見てもらうには?
  17. 17. 家のパソコンでただWEBページを作っても 遠くの人に見てもらえません。 Webサイトを遠くの人が見るには
  18. 18. Webサイトを遠くの人が見るには サーバという自分の持っているデータや、情報を 提供する機能をもったコンピュータが必要になり ます。 こんな感じで、一つの場所に 複数置かれていたりする。 大量のデータを処理するため、 たくさんのコンピューターが必要。
  19. 19. サーバにアップするには レンタルサーバーとFTPソフトが必要 レンタルサーバー ・さくらインターネット ・ロリポップ! ・エックスサーバー FTPソフト ・FFFTP ・FileZilla ・Cyberduck
  20. 20. Webサイト表示の仕組み インターネットに繋げずに閲覧できる場所 をローカル環境と言ったりします。 自分の家のパソコンの中身も当てはまりま す。
  21. 21. ローカル環境とは 例えば・・・ WEBページ上の画像を保存したりすること はネットワーク上にある情報をローカル環 境にコピーしている作業と言えます。
  22. 22. ちなみに 今後の講座で使う XAMPP(ザンプ) というソフトは ネットワーク上でないと動かないプログラミング言語を ローカル環境でも使用できるようにするもの。 サーバーを用意せずに作ったものを確認できます!
  23. 23. WEBサイトは どうやってできている? いつも見ているWEBサイトの真相に迫る!
  24. 24. いつも、どんなサイトを 見ていますか?
  25. 25. Webデザインするときに役立つサイト いらすとや http://www.irasutoya.com/
  26. 26. Webデザインするときに役立つサイト ヒューマンピクトグラム2.0 http://pictogram2.com/
  27. 27. ちゃぶ台返し ルームランナー茶道 色々あります
  28. 28. Webデザインするときに役立つサイト ぱくたそ https://www.pakutaso.com/
  29. 29. いつも見ているサイトを デベロッパーツール で見てみよう
  30. 30. 実は・・・ WEBページって テキストで出来ている
  31. 31. HTMLとCSSというのがあるよ HTML HTML(HyperText Markup Language)は webページを構成する言語の一つ。 CSS CSSは(Cascading Style Sheet)は Webページのデザインやレイアウトを定義する言語の 一つ。
  32. 32. HTMLとCSSを使って WEBサイトを作ってみよう
  33. 33. 参考サイト ■ いらすとや http://www.irasutoya.com/ ■ ヒューマンピクトグラム2.0 http://pictogram2.com/ ■ ぱくたそ https://www.pakutaso.com/

×