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.3k
イベントで大活躍の電子ペーパー名札 〜M5PaperとUIFlow+α〜 / IoTLT vol.100
you(@youtoy)
PRO
June 18, 2023
Tweet
Share
More Decks by you(@youtoy)
See All by you(@youtoy)
もくはりでのモノ作りと自身のモノ作り活動 / もくはり文化祭2024 オープン記念イベント
you
PRO
0
34
"かわいい" がテーマのハッカソンでWebの技術を使って魔法の世界を作った話など / HTML5 10th Anniversary
you
PRO
0
84
ブラウザで AI・機械学習が扱える TensorFlow.js が使われているライブラリなどの話 / #さくらのAI Meetup vol.4「ブラウザ」
you
PRO
0
180
Blynk と Raspberry Pi Pico W で IoT 〜 MQTT・HTTPリクエストの組み合わせも 〜 / IoTLT vol.114
you
PRO
0
2.5k
AIを活用したWebアプリのプロトタイプを作ってコンテストや展示に出してみた話 / 大阪工業大学 ネットワークデザイン学科 LT大会 2024v2
you
PRO
0
95
Babylon.jsと色々なものを組み合わせる:ブラウザのAPIやガジェットや2D描画ライブラリなど / Babylon.js 勉強会 vol.3
you
PRO
0
610
WebHID API で Joy-Con・DUALSHOCK 4 のセンサーをブラウザから利用する / IoTLT vol.109
you
PRO
0
2.4k
UIFlow 2.0 で MQTT をやってみた! / IoTLT vol.108
you
PRO
0
5k
UIFlow 2.0 と ATOMS3 の組み合わせで LINE通知を試す / ビジュアルプログラミングIoTLT vol.16
you
PRO
1
2.6k
Other Decks in Technology
See All in Technology
Two Blades, One Journey: Engineering While Managing
ohbarye
3
720
OpenID Connect for Identity Assurance の概要と翻訳版のご紹介 / 20250219-BizDay17-OIDC4IDA-Intro
oidfj
0
460
Pwned Labsのすゝめ
ken5scal
0
180
ESXi で仮想化した ARM 環境で LLM を動作させてみるぞ
unnowataru
0
150
ビジネスモデリング道場 目的と背景
masuda220
PRO
9
690
あれは良かった、あれは苦労したB2B2C型SaaSの新規開発におけるCloud Spanner
hirohito1108
2
870
OPENLOGI Company Profile
hr01
0
60k
ディスプレイ広告(Yahoo!広告・LINE広告)におけるバックエンド開発
lycorptech_jp
PRO
0
200
AIエージェント元年
shukob
0
140
生成 AI プロダクトを育てる技術 〜データ品質向上による継続的な価値創出の実践〜
icoxfog417
PRO
5
1.9k
1行のコードから社会課題の解決へ: EMの探究、事業・技術・組織を紡ぐ実践知 / EM Conf 2025
9ma3r
6
1.9k
AI Agent時代なのでAWSのLLMs.txtが欲しい!
watany
2
160
Featured
See All Featured
Dealing with People You Can't Stand - Big Design 2015
cassininazir
366
25k
Building Adaptive Systems
keathley
40
2.4k
Statistics for Hackers
jakevdp
797
220k
Raft: Consensus for Rubyists
vanstee
137
6.8k
It's Worth the Effort
3n
184
28k
Site-Speed That Sticks
csswizardry
4
400
For a Future-Friendly Web
brad_frost
176
9.6k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
40
2k
The MySQL Ecosystem @ GitHub 2015
samlambert
250
12k
Code Reviewing Like a Champion
maltzj
521
39k
How to train your dragon (web standard)
notwaldorf
91
5.9k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
59k
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・記事などで紹介できればと)
現物を見たい方は お声がけください!
終わり!