Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
イベントで大活躍の電子ペーパー名札 〜M5PaperとUIFlow+α〜 / IoTLT vo...
Search
you(@youtoy)
PRO
June 18, 2023
Technology
0
1.5k
イベントで大活躍の電子ペーパー名札 〜M5PaperとUIFlow+α〜 / IoTLT vol.100
you(@youtoy)
PRO
June 18, 2023
Tweet
Share
More Decks by you(@youtoy)
See All by you(@youtoy)
総額200円の入力インターフェースで年齢問わず楽しめる体験型展示 / エンジニアの自由研究発表会vol.10
you
PRO
0
57
Node−RED で Ollama を使ったローカルLLM(node-red-contrib-ollamaを利用) / ビジュアルプログラミングIoTLT vol.20
you
PRO
0
170
AIエージェント開発や最新の生成AIのAPI利用などJavaScriptで色々やってみる / IoTLT vol.123
you
PRO
0
100
ChatGPT からモックサーバー宛(Beeceptor宛)の HTTPリクエストを試す / IoTLT 202504
you
PRO
0
97
デモをまじえつつの生成AIの話題 / 横須賀プログラミング“夢”アカデミー発表会(2025年3月)
you
PRO
0
49
もくはりでのモノ作りと自身のモノ作り活動 / もくはり文化祭2024 オープン記念イベント
you
PRO
0
54
"かわいい" がテーマのハッカソンでWebの技術を使って魔法の世界を作った話など / HTML5 10th Anniversary
you
PRO
0
110
ブラウザで AI・機械学習が扱える TensorFlow.js が使われているライブラリなどの話 / #さくらのAI Meetup vol.4「ブラウザ」
you
PRO
0
230
Blynk と Raspberry Pi Pico W で IoT 〜 MQTT・HTTPリクエストの組み合わせも 〜 / IoTLT vol.114
you
PRO
0
2.5k
Other Decks in Technology
See All in Technology
SFTPコンテナからファイルをダウンロードする
dip
0
420
AWS全冠したので振りかえってみる
tajimon
0
150
Tensix Core アーキテクチャ解説
tenstorrent_japan
0
360
Grafana MCP serverでなんかし隊 / Try Grafana MCP server
kohbis
0
370
Kotlinで学ぶ 代数的データ型
ysknsid25
5
1.1k
CI/CDとタスク共有で加速するVibe Coding
tnbe21
0
210
“プロダクトを好きになれるか“も QAエンジニア転職の大事な判断基準だと思ったの
tomodakengo
0
180
新規プロダクト開発、AIでどう変わった? #デザインエンジニアMeetup
bengo4com
0
480
AI技術トレンド勉強会 #1MCPの基礎と実務での応用
nisei_k
1
220
堅牢な認証基盤の実現 TypeScriptで代数的データ型を活用する
kakehashi
PRO
2
240
エンジニア採用から始まる技術広報と組織づくり/202506lt
nishiuma
8
1.7k
API の仕様から紐解く「MCP 入門」 ~MCP の「コンテキスト」って何だ?~
cdataj
0
170
Featured
See All Featured
Mobile First: as difficult as doing things right
swwweet
223
9.7k
Designing Experiences People Love
moore
142
24k
Building an army of robots
kneath
306
45k
How GitHub (no longer) Works
holman
314
140k
Raft: Consensus for Rubyists
vanstee
140
7k
Building Adaptive Systems
keathley
43
2.6k
Become a Pro
speakerdeck
PRO
28
5.4k
Making Projects Easy
brettharned
116
6.2k
Build your cross-platform service in a week with App Engine
jlugia
231
18k
How STYLIGHT went responsive
nonsquared
100
5.6k
A better future with KSS
kneath
239
17k
Automating Front-end Workflow
addyosmani
1370
200k
Transcript
2023年6月18日 (日) IoTLT vol.100 @#NT金沢 豊田陽介( ) @youtoy イベントで大活躍の電子ペーパー名札 〜M5PaperとUIFlow+α〜
自己紹介 豊田陽介( ) @youtoy ・IT系イベント主催、登壇や運営なども ・子ども向けの活動いろいろ ・ Microsoft MVP(2021/10 から)
プライベートでの活動 ・ガジェット大好き ・ビジュアルプログラミング/JavaScript とガジェットの組み合わせをよくやって いたりするかも 好きなこと、他
はじめに 祝100回 🎉
イベントに便利なアイテム を作った方法の紹介
各種イベントで大活躍してる 電子ペーパー名札!
作り方はいくつかあると思うけれど 自分は「M5Paper+UIFlow+α」で
詳細手順はQiitaの記事で公開済み! ※ このスライドも公開します
過去の実例(一部抜粋) ・昨年11月ごろから頻繁に利用 (それまで割と M5Paper を眠らせてた...) Scratch関連イベント バージョン MFKyoto2023 バージョン カンファレスの参加者・
スタッフバージョン 2種
表示を各イベント用に簡単に書きかえ可 & その後の表示には電力不要 便利ポイント!
自分の場合の作り方と その際のポイント
一番のポイントは画像の準備 準備に使ったのは ・PowerPoint ・プレビュー ※ MacBook Pro の上で作業
他アプリでも大丈夫 以下の処理ができれば OK ・PowerPoint代替: 画像や文字の配置 ・プレビュー代替: 解像度調整⇒ファイルサイズ調整
PowerPointを使った手順でのポイント ▪ 縦長の場合: 9:16 の縦横比の 矩形内に配置 画像書きだしでは 540x960 よりも 大きな解像度で
プレビューを使った手順でのポイント① 540x960 ぴったり の解像度に変更 ズレが出た場合は 縦横比の固定を 解除して微調整 ▪ 解像度の調整
プレビューを使った手順でのポイント② ▪ ファイルサイズの調整 JPEG の非可逆な圧縮 でサイズを削減 出力サイズを見つつ 45KB くらいに
あとの手順はシンプル
▪ 画像の配置+ファイルアップロード UIFlow上での作業①
▪ ブロックのプログラム(表示用の処理) UIFlow上での作業② ブロック 2個
あとは何もしなくても 表示が維持された状態に (電力不要)
名札ケースの話もあるけど 時間の都合で省略 (別途、LT・記事などで紹介できればと)
現物を見たい方は お声がけください!
終わり!