あるくテック

「分かる」をつくりたい。

GoogleスープレッドシートでGoogle翻訳を使う

GoogleスープレッドシートでGoogle翻訳が使えることを今日知りました。

Googleスープレッドシードとは

Googleのサービスで、Webブラウザ上やアプリで使える表計算ツールです。Microsoftのエクセルを使っている方なら、すぐに使えると思います。Googleアカウントがあれば無料で使えますし、例えばWindowsのPCで作ったシートをiPadやAndroidのスマホから見ることができますので、いろいろな人とデータを共有するのに便利です。

複数人で同時に編集することもできます。

www.google.com

スープレッドシートの中で翻訳するには?

翻訳結果を表示させたいセルに、一行追記するだけです。

=GOOGLETRANSLATE(A2,"auto", "en")

 A2のセルに入力された文字列を、言語は自動判定(auto)して、英語(en)に翻訳をします。

B2以下に上記のような式を入力すると、次のようなスープレッドシートができました。

 

Googletranslate

Googletranslate

会社、サークル、保護者会などで、多言語の参加者がいるときの議事録をGoogle Spreadsheetで作るとこんな感じに。

今回はテストとしてA列(水色のセル)に日本語を入力すると、B列では日→英、C列では日→ポルトガルに翻訳するように設定しました。

欲を言えば双方向(日←→英/日←→ポルトガル)に翻訳できるシートにしたいところ。

 

f:id:takakosudou:20200126221022p:plain


翻訳に使える言語のコード一覧はこちらも参考になりそうです。

GoogleTranslateで使える国名コード一覧 | 生活情報 -こんなことあるね

プログラミングの授業例 Webゲームその3

Webゲーム制作の授業、今回はその3としてプログラミングの基礎「変数と条件分岐(if)」についてです。

ゲーム制作を通してプログラミングの基礎を学ぼう

授業ではenchant.jsというライブラリ(プログラムのパーツ)を使って、効率よくプログラミングを行うことで、体験重視の授業になるようにしていました。

変数と条件分岐

ゲーム制作に限らず、様々なデータを扱ったり(変数の利用)、「こんな時はどうする?」といった場合によって行う処理を変えたり(条件分岐)、プログラミングの基礎知識として分かっておきたいことがいろいろとあります。

ただ聞いても分からない

私が初めてプログラミングに触れたのは、大学の授業(19歳頃?)ででした。その時の言語はFORTRAN。条件分岐やループ処理をしたのはぼんやり覚えています。クラスメイトに手伝ってもらってなんとか課題を提出したものの、分かった実感は全くありませんでした。

その後、工学部のC言語の授業を履修して出てみたものの、講義で行われた詳細な「メモリ」の解説で心が折れました。当時理学部だった私にとって初めて知ることばかり。聞くこと全てが分かりませんでした(笑)。

とにかくトライ&エラー

そんな私でもその後プログラミングを仕事にできたのですから、興味のある方はぜひ心配しないで楽しんでやってみてほしいと思います。

プログラミングの学習は外国語を覚えるのにも似ています。単語と文法を習ってみただけではまだしゃべれるようにはならないですが、とにかく使ってみて経験を重ねることで使えるようになります。

ある程度のところまで行けたらあとは楽になるはずです。

コンピュータは怒らない

プログラムの入力を間違えて滝のようなエラーを吐きだそうと、コンピュータは怒りません。今はコンピュータが即壊れる心配をせずにプログラミングを学習してみることができますので、遠慮は無用です。

それなのに。吐き出されたエラーを見ながら「あ~ごめんごめん」「そうだよね~」などと呟くようになったら。あなたも立派なプログラマかも(笑)

授業のプリント

話が脱線しましたが、授業で配布したプリントは次のようなものです(無理矢理)。

 

変数とif文を使った描画制御
          
今日のMission
1.リソース(画像)をプロジェクトに追加し、Spriteクラスを使って適切に表示ができる。

2.flag_x === true(26行目) なぜ=(イコール)が3つなのか説明できる。

3.変数flag_xがどうして必要なのか説明できる。

 

<演習問題例>

 

1)準備
 code.9leap.netにログインする。
 http://code.9leap.net/codes/show/151788 からフォークする。
2)「Add Resource」ボタンからクマの画像を追加する。
3)15行目以降を記述し、クマを表示させる。変数名はbearとする。
4)フラグの利用
①~④の処理を書いてみましょう。1つ書いたらすぐに実行するとデバッグが楽です。

     // 方向フラグをtrueに
     var flag_x = true;
     // くまが表示されているとき、常に行う処理
    bear.addEventListener(Event.ENTER_FRAME,function()
     {
         if(flag_x === true)
        {
            if(bear.x < 300){
                 // ① クマを3ピクセル右へ動かす
             }
             else
             {
                 // ② 方向フラグをfalse(左)にする。
             }
          }
         if(flag_x === false)
         {
         if(bear.x > 0){
            // ③ クマを3ピクセル左に動かす
         }
         else
         {
            // ④ 方向フラグをtrue(右)にする
         }

授業のながれ

授業の冒頭10分程度で説明を行った後は、全員が達成できることを目指して、学生が自由に課題に取り組みます。教室内の立ち歩きも相談も自由です。学生が自主的に教室のホワイトボードを使って、ミニ授業をおこなっても構いません。
全員が達成するためには協働が求められます。様々なコミュニケーションスキルを学ぶ機会にもなります。

クラス全体としての達成度については授業の最後で確認をします。

プログラミングを楽しむ

作ったものが動きはじめるのは、誰にとっても驚きや楽しさがあることだと思います。

それを繰り返し体験しながら試行錯誤を重ねていけるのが、プログラミングの良いところです。

 

プログラミングの授業例 Webゲームその2

Webゲーム制作の授業、今回はその2として画像描画についてです。

Webゲームづくりに欠かせない画像表現

授業ではenchant.jsというライブラリ(プログラムのパーツ)を使って、効率よくプログラミングを行うことで、体験重視の授業になるよう工夫していました。

また、ゲームを作るときに画像の表現は欠かせないものですが、その点についてもライブラリを使うことで最低限のプログラムで好きな絵を表示させたりコントロールすることができました。


授業で配布したプリントは次のようなものです。

 

Spriteを使った画像の描画
          
今日のMission
1.enchant();を書く場所と、役割が説明できる。
2.画像を表示するためのプログラムの書き方が説明できる。
3.Spriteクラスのプロパティframeと、画像ファイルの関係を説明できる。

 

<演習問題例>

1)準備
①code.9leap.netにログインする。
http://code.9leap.net/codes/show/150992からフォークする。
③画面下の方にあるAssets Listを確認し、画像のファイル名をチェックする。

 

2)5行目に、enchant.jsライブラリを使うときに、必ず書く1行書いてください。

 

3)クマの表示
画面上にクマを表示するために、『適切な場所』に下記の記述をする。カッコの形に注意。
①game.preload('chara1.png');
② var bear = new Sprite(32,32);
bear.image = game.assets['chara1.png'];
bear.frame = 0;

 

4)クマを変える。
画面上に表示された茶クマを、白クマや女の子のクマに変える。

 

チャレンジ問題
1)クマのアニメーション
%演算子を使って、クマをアニメーションさせる。

2)game.fpsの値を変えて、アニメーションの速度がどうなるか確認してみましょう。

 

授業のながれ

授業の冒頭10分程度で説明を行った後は、全員が達成できることを目指して、学生が自由に課題に取り組みます。教室内の立ち歩きも相談も自由です。学生が自主的に教室のホワイトボードを使って、ミニ授業をおこなっても構いません。
全員が達成するためには協働が求められます。様々なコミュニケーションスキルを学ぶ機会にもなります。

またプリント中の演習問題例は、Missionを達成するための作業として私から例示していたもので、学生自身で例題を考えて授業に取り組んでも構いません。つまりMissionが達成できるのであれば、例題を解かないことを選べます。

クラス全体としての達成度については授業の最後で確認をします。

プログラミングを楽しむ

作ったものが動きはじめるのは、誰にとっても驚きや楽しさがあることだと思います。

それを繰り返し体験しながら試行錯誤を重ねていけるのが、プログラミングの良いところです。

 

プログラミングの授業例 Webゲームその1

Webゲーム制作の授業、今回はその1初回授業についてです。

科目概要

Webページを見るためのブラウザ(Google Chrome、Safari、Edge、Internet Explorerなど)があれば遊べるゲームのことを、Webゲームまたはブラウザゲームと呼びます。このWebゲームの制作を学ぶ科目です。

arukutech.hatenablog.com

はじめてのWebゲームづくり

授業ではenchant.jsというライブラリ(プログラムのパーツ)を使って、効率よくプログラミングを行うことで、体験重視の授業になるよう工夫していました。


初回授業で配布したプリントは次のようなものです。

 

enchant.jsでのクラスのコーディング、時間制御を体験する

Mission

0.code.9leap.netのユーザー登録を各自で行う。


1.文字を表示するために、「使用するクラスの名前」と「プログラムの書きかた」が説明できる。

 

<<演習問題例>>

1)準備
code.9leap.netのログインする。(Chrome推奨)

2)http://code.9leap.net/codes/show/203 にアクセス

3)画面左上「Fork」ボタンからプログラムのコピーを作る

4)画面右上「Run」ボタンでプログラムを実行すると、画面左下に課題が表示される

 

課題1
hello.xを10以外に変化させてみよう!
hello.x=50;
書き換えたら「Run」を押そう!

 

5)課題3までやってみる。

 

授業の冒頭10分程度で説明を行った後は、全員が達成できることを目指して、学生が自由に課題に取り組みます。教室内の立ち歩きも相談も自由です。学生が自主的に教室のホワイトボードを使って、ミニ授業をおこなっても構いません。
全員が達成するためには協働が求められます。様々なコミュニケーションスキルを学ぶ機会にもなります。

またプリント中の演習問題例は、Missionを達成するための作業として私から例示していたもので、学生自身で例題を考えて授業に取り組んでも構いません。つまりMissionが達成できるのであれば、例題を解かないことを選べます。

クラス全体としての達成度については授業の最後で確認をします。

プログラミングと協働学習

どんなことでもある程度の基礎知識がないと活動ができません。そのためプログラミングを学ぶときには、新しい考え方や用語がたくさん登場するため困惑する学生も少なくありませんでした。

とはいえ、一斉授業だけを行っていきながらクラス全員の基礎知識のレベルが上がるのを待つことは時間がもったいないと考えています。新しい知識は一度聞いただけでは分かったような気分になっただけで、使える知識まで理解できてないことがほとんどですので、結局授業が終わっても「とりあえずやってみた」だけに留まってしまいます。

プログラミングの授業では、Slackなどのツールも生かして、意見やデータのやりとりが極力スムーズに行えるようにしていました。

授業の中で学生同士で話ができる時間をできるかぎりつくることで、分からないことがすぐ誰かに聞くことができる(先生に聞くタイミングを待たなくてよい)、誰かに教えることでより理解が深まる、といったメリットを学生自身が実感していたようでした。

通信制大学で学ぶ Tips-7 科目終了試験対策2.0

再び、2018年9月に再び通信制大学の学生になっていました。毎月のレポート提出と科目終了試験が再開、そしてようやく、、、終えました。

科目終了試験対策がバージョン2.0になりました。

前回在学時の様子として、去年に科目終了試験対策の記事を2つ書きました。

マインドマップを本格導入

2018年の夏にマインドマップのアドバンストプラクティショナー資格を取りました。この資格はマインドマップの考案者であるトニー・ブザン公認の資格で、私が所属する組織内で「マインドマップ 入門講座」を正式に教えることができます。

例えば、勤め先でマインドマップの研修をする、学校の先生が生徒に正式なマインドマップを教えるといった場合です。

www.mindmap-school.jp

授業、試験勉強、レポート作成に大活躍

どんな場面でもマインドマップは重宝しました。特に試験勉強とレポート作成への効果は大きかったです。大学でもマインドマップが推奨されていました。

科目終了試験では、ポイントをマインドマップにまとめておいて、こまめに見返すようにします。マインドマップにしておくと短時間で振り返ることができるのが便利です。