はじめに
人気のIoTモジュールM5Stack Core2を「UIFlow」から使う方法を解説します。
公式サイトの解説にそって、ドライバのインストールからセットアップまで、公式でわかりづらい部分を補いながら、詳しく説明します。
初心者・入門者の方でもわかりやすいように、画像を使って細かく解説していますので、UIFlowを使う際に参考にしてみてください。
※ クリックすると各項目へジャンプできます
M5Stack Core2
M5Stackは、2017年に発売されたマイコン(IoT)モジュールです。5cm×5cmのケースの中に、マイコン・ディスプレイ・ボタン・スピーカー・バッテリー・センサなど、「これさえあれば大体OK」な機能をすべて搭載。Wifi・Bluetoothも使えます。
「UI Frow」というグラフィカルな開発環境も使えるので、今どきの電子工作やIoTにピッタリなデバイスです。
M5Stackのベーシックなモデルとして「M5 Stack Basic」が発売されていますが、現在ではタッチパネル搭載など、より洗練された「M5Stack Core2」が発売されています。本記事でも 「M5Stack Core2」についてを紹介します。
- 電子工作・IoT機器を作ってみたい・勉強したい
- プログラミングの勉強をしたい。
- 職場・学校で、プロトタイプを作りたい。
環境
この記事は以下の環境で作成しています。
環境 | バージョン |
モジュール | M5Stack Core2 |
開発用PCのOS | Windows10 |
UIFlow | Ver.1.9.0 |
【結論】セットアップ完了でプログラミング開始
後述する手順を行うと、UIFlowで「M5Stack Core2」をプログラミングできるようになります。
UIFlowは「MicroPython」「Blockly」の二つの言語に対応しているため、1度のセットアップで、2つの言語が使えるようになります。
M5Stack Core2のセットアップ手順
準備物
基本的に「パソコン」と「M5Stack Core2 」だけあればOKです。
WiFiの設定があるので、事前にSSIDとパスワードを確認しておくとスムーズです。
- パソコン(Windows10)
- M5Stack Core2
- 同梱のUSBケーブル ( Type-A — Type-C )
- 使用するWiFiのSSIDとパスワード
セットアップの流れ
以下の流れでセットアップを進めます。
- ドライバのインストール
- M5Burnerでのファームウェアの書き込み
- APIキーなどの設定(configuration)
- UI Flowの設定
① ドライバのインストール
メーカーサイトのページにアクセスして、以下で示した場所からWindows用のドライバをダウンロードします。
※PCに搭載されているUSBチップの種類によってドライバが分かれるようです。インストールやセットアップ中にエラーが発生する場合は、「CH9102_VCP_SER_Windows」のドライバもインストールしてみてください。(種類がわからない場合は、両方入れてしまってもOKです)
ダウンロードした圧縮ファイルを解凍すると、以下のファイルが表示されます。「CP210xVCPInstaller_x64_v6.7.0.0.exe」をダブルクリックします。
ドライバのインストール画面が表示されるので、「次へ」を押していきます。使用許諾が表示されるので(内容に問題がない場合は)「同意します」にチェックをいれて、次へをクリックします。
以下の画面が表示されれば、ドライバのインストールは完了です。「完了」を押してインストーラを終了します。
② M5Burnerでのファームウェアの書き込み
ドライバと同じページにアクセスして、以下の場所からファームウェアの書き込みツール『M5Burner』をダウンロードします。
ダウンロードした圧縮フォルダを解凍すると、以下のファイルが表示されます。「M5Burner.exe」をダブルクリックしてM5Burnerを起動します。
M5Burnerを起動時に以下の画面が表示された場合は「この機能をダウンロードしてインストールする」をクリックします。
インストール画面が消えたら完了です。(表示されない場合は次の手順へ進んでOKです)。
※ 上記画面が表示された場合は、インストールが完了してもM5Burnerが起動しないので、もう一度 「M5Burner.exe」をダブルクリックしてください。
M5Burnerが起動すると、以下の画面が表示されるので、「UIFLOW(CORE2)」の「Download」ボタンをクリックします。
ダウンロードが完了すると、「Burn」「Configuration」ボタンが表示されます。
M5Stack Core2をUSBケーブルでPCに接続してから「COM」を選択します。ドロップダウンリストに「COM3」などと表示されるので、表示されたCOMを選択します。
選択後「Burn」ボタンを押します。
「COMが複数表示されて、どれを使えばいいか分からない」という方は、M5Stack Core2以外のUSB機器(マウス・キーボードは除く)を、PCから抜いて、再度選択を試してみてください。
「Burn」ボタンを押すと、以下の画面が表示されます。使用するWiFiのSSIDと、パスワードを入力して「Start」ボタンを押します。
以下の画面が表示されてファームウェアの書き込みが始まります。
「Burn Successfully」が表示されたら、ファームウェアの書き込みは完了です。「Close」ボタンを押します。(100%が表示されてからSuccessfullyが表示されるまで少し時間がかかります)。
書き込みが完了すると、M5 Stack Core2が自動で再起動されて、以下の画面が表示されます。M5Stack Core2とPCがWiFi接続されているので、USBケーブルは外してOKです。
③ APIキーの設定(configuration)
以下の画面でファームウェアの設定をします。M5Burnerで「Configuration」ボタンを押します。
表示された設定画面で以下の設定をします。
- ApiKeyをコピーする。
- Start Modeを「Internet Mode」に設定する
- SSIDとパスワードを入力する
ApiKeyは後述するUIFlowの設定に必要になるので、メモ帳などに張り付けておいてください。
※ 保全し忘れた場合は、Configurationボタンか、M5Stack Coreの画面に表示されています。
「Save」ボタンを押して、以下の画面が表示されたらAPIキーの設定は完了です。
④UIFlowの設定
最後にUIFlowとM5Stack Core2を紐づけます。
UIFlowのサイトにアクセスして、表示された画面で以下の設定を行います。
- メモしたApi Keyを入力
- Languageを「日本語」に設定
- Deviceの選択( M5Stack Core2)を選択
- OKボタンを押す
OKボタンを押せば、すべてのセットアップは完了です。
UIFlowでのプログラミング
上記の手順が完了すると、UIFlow上で『MicroPython』『Blockly』によるプログラミングができるようになります。
プログラミングの方法については、以下の記事をご覧ください。Blocklyを使って「Hello M5」という文字表示するサンプルを解説しています。
まとめ
M5Stack Core2を、UIFlowから使う方法を解説しました。
公式サイトでは少し分かりづらいところがあったので、セットアップに苦戦している人や、これからM5Stack Core2・UIFlowを使う方の参考になればうれしいです。
M5Stack Core2 をはじめよう
M5Stack Core2は、USBケーブル(TypeA-TypeC)も付属なので、すぐに始めることができます。セットアップ方法については、こちらの記事をご覧ください。
こちらの記事で「おすすめ工具」も紹介しています。
「ユニット」でM5Stackを拡張しよう
M5Stackは「ユニット」で簡単に機能拡張ができます。
UIFlowにもユニット用の処理のブロックが用意されているので、好みのユニットを追加して、自分だけのM5Stackを作ってみてください。以下は、入門者でも使いやすいユニットです。
温湿度気圧センサユニット
I2Cで、温度・湿度・気圧の3つを測れるユニットです。温度/湿度系のセンサはプログラミングも簡単なので、初心者の方におすすめのユニットです。レゴ互換の穴も開いているので、センサの固定や配置にレゴが使えます。詳細な使い方はこちらの記事をご覧ください。
測距センサユニット
Time-of-Flight方式を使用して、最大2mまでの距離を計測できるユニットです。通信方式はI2Cです。こちらもレゴ互換の穴が開いています。
環境光センサユニット
周囲の明るさを細かい精度で計測できるユニットです。通信方式はI2Cです。こちらもレゴ互換の穴が開いています。
ユニットをつなぐ配線には、ポートA・B・Cの3種類があり、コネクタの色で判別できるようになっています。
Core2はデフォルトで「ポートA」のユニットをつなぐように設定されているため、初心者の方はポートA(赤色コネクタ、I2C通信)のユニットを使うと簡単です。
M5Stackを詳しく知るには
M5Stackをより詳しく知りたい方は、こちらの書籍がおおすすめです。書籍の中で使われているのは、M5Stack Basic + Arduino言語ですが、M5Stackの概要・構成などをより詳しく学べます。
質問・要望 大歓迎です
「こんな解説記事作って」「こんなことがしたいけど、〇〇で困ってる」など、コメント欄で教えてください。 質問・要望に、中の人ができる限り対応します。
使えたよ・設定できたよの一言コメントも大歓迎。気軽に足跡を残してみてください。記事を紹介したい方はブログ、SNSにバシバシ貼ってもらってOKです。