Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
IoT実践! 行先予定表を電子ペーパーで作る
Search
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
Ryosuke Uchiyama
December 11, 2022
Technology
54
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
IoT実践! 行先予定表を電子ペーパーで作る
Ryosuke Uchiyama
December 11, 2022
More Decks by Ryosuke Uchiyama
See All by Ryosuke Uchiyama
AWSでサーバレスな書籍管理アプリを作る
step63r
0
75
PythonでSlack通知botを作る
step63r
0
24
ChatGPT実践
step63r
1
410
React x Socket.ioで人狼サーバを作る 第一章 フロントエンド実装
step63r
0
36
深層強化学習で東方AI 第一章 DQNの基本
step63r
0
430
Build 2021 プレイバック
step63r
0
45
WPFで実践アプリ開発! 第四章 機能の実装 Part 2
step63r
0
63
WPFで実践アプリ開発! 第三章 機能の実装 Part 1
step63r
0
140
WPFで実践アプリ開発! 第二章 UI
step63r
0
190
Other Decks in Technology
See All in Technology
AWSセキュリティで活用するAI機能
cmusudakeisuke
1
230
JAWSUG TOHOKU 青森支部 「LoGoチャット」のAWS移行で 乗り越えたこと
taketakekaho
0
380
dbt Semantic Layerで進めるenechainのデータ民主化
akizhou
1
230
Rustuna: Rustによる高速なOptuna実装
pfn
PRO
0
220
AWSDirectConnectの構築の進め方を整理してみた
masa_my
1
150
Optunaの最新リリースv5.0について
pfn
PRO
0
140
アカウント統制の健康診断
kenichinakamura
1
140
ウォンテッドリーの最近のプロダクトと技術の紹介
stomk
0
340
QAエンジニアがSoutherを使ってみたの〜10分でわかるSouther〜
mhlyc
0
110
価値について
gree_tech
PRO
0
150
コンテナ運用におけるネットワーク・コンテナコストの削減方法/How to Reduce Network and Container Costs in Container Operations
masakiokuda
2
390
「エーアイ」をバズワードにしないために RPA 導入経験と Kiro 上での Claude モデル利用経験から
kazzpapa3
0
120
Featured
See All Featured
Money Talks: Using Revenue to Get Sh*t Done
nikkihalliwell
0
530
Introduction to Domain-Driven Design and Collaborative software design
baasie
1
1k
Context Engineering - Making Every Token Count
addyosmani
9
1.2k
Designing for Timeless Needs
cassininazir
1
530
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
18k
Site-Speed That Sticks
csswizardry
13
1.6k
BBQ
matthewcrist
90
10k
The Straight Up "How To Draw Better" Workshop
denniskardys
239
140k
職位にかかわらず全員がリーダーシップを発揮するチーム作り / Building a team where everyone can demonstrate leadership regardless of position
madoxten
69
67k
RailsConf 2023
tenderlove
30
1.6k
Navigating the moral maze — ethical principles for Al-driven product design
skipperchong
2
640
Mobile First: as difficult as doing things right
swwweet
225
10k
Transcript
IoT実践! 行先予定表を電子ペーパーで作る Ryosuke Uchiyama step63r
概要 • 行先予定表を電子化したい • 在席状況を自席から更新・確認できる • 在宅、出張先でも更新・確認できる
要件定義 Ph.1 • 行先表示端末 • Webアプリのダッシュボード Ph.2 • ダッシュボードから行先表示板を確認 •
ユーザー管理 Ph.3 • マルチデバイス対応(各島に1端末) • ログ強化など
行先表示端末 名前 行先 帰社 高海 桜内 テレワーク 黒澤 渡辺 4/7~9
東京 4/10 津島 国木田 テレワーク 小原 • こんな感じで表示制御できるやつ • 名前、行先、帰社、出勤有無を変更可能 • 出勤有無は反転色などで表現 • RasPi+モノクロ液晶or電子ペーパー • データはRasPi上にて永続化 • ダッシュボードから更新、参照するため、 WebAPIを用意して待ち受ける
ダッシュボード • 行先表示端末を変更するWebアプリ • それぞれ任意の文字列を入力可能 • 出勤有無はトグル的なUIで変更 • 更新されたら端末に即時反映 •
Ph.1ではとりあえず誰が誰の情報を書き換えてもよいことにする • Ph.2でユーザー管理:権限持ったユーザー?だけが他人の行先表示板を変更可能 • Ph.3でマルチデバイス対応:複数の島の端末を1つのダッシュボードで閲覧、変更可能
たてつけ 予定表の更新 予定表の閲覧
使ったもの Raspberry Pi 4 Model B ARMプロセッサを搭載したシングルボードコンピュータ。 購入価格:7,700円 7.5inch E-Ink
display HAT for Raspberry Pi SPIインターフェイスでRasPiと接続できる電子ペーパーディスプレイ。 購入価格:9,197円
IoT側の実装
プロパティ設計 - テーブル 高坂 高海 絢瀬 桜内 南 松浦 園田
黒澤(ダ) 星空 渡辺 西木野 津島 東條 国木田 小泉 小原 矢澤 黒澤(ル) 幅マージン 高さマージン フォント、サイズ 行数 列数(この場合は2) e-Paperの高さ e-Paperの幅
プロパティ設計 - セル 高坂 高海 1列に占める名前の幅の比率 セルと文字のパディング テーブルでそのセルが属する X, Y
位置
インターフェイス設計 名前 説明 引数 戻り値 get_all() テーブル情報を全て取得 なし テーブル: List[List[Dict[str,
Any]]] set_name() 指定セルの名前を設定 X位置: int, Y位置: int, 設定文字列: str なし set_status() 指定セルの行先を設定 X位置: int, Y位置: int, 設定文字列: str なし set_present() 指定セルの在席状態を設定 X位置: int, Y位置: int, 設定状態: bool なし get_name() 指定セルの名前を取得 X位置: int, Y位置: int 名前: str get_status() 指定セルの行先を取得 X位置: int, Y位置: int 行先: str get_present() 指定セルの在席状態を取得 X位置: int, Y位置: int 在席状態: bool
Web API設計 パス メソッド リクエストパラメータ レスポンス / GET なし テーブル:
List[List[Dict[str, Any]]] /{row}/{column} GET なし セルの情報: Dict[str, Any] /{row}/{rolumn} POST { "name": Union[str, None], "status": Union[str, None], "present": Union[bool, None] } { "status": "update success." }
ソースコード step63r/destboard https://github.com/step63r/destboard
ダッシュボード側の実装
画面設計 名前、行先、在席状態を表示する 行先を変更する トグルで在席状態をスイッチする
画面設計 名前、行先、在席状態を表示する 変更をe-Paperにも反映する
ソースコード step63r/destboard-client https://github.com/step63r/destboard-client
Demo
今後の課題など • とりあえず Issues に起票した機能追加、不具合改修 • 帰社時刻を入力する欄を忘れてた • ダッシュボードをもうちょっとリッチに •
複数デバイス対応とかデプロイ先真面目に考えるとか • 筐体が欲しい • 数十分放置で画面が少しずつ薄くなっていく希ガス(リフレッシュ入れたら改善するのか) • ぶっちゃけ実用に足るかどうかは分からない • 実用するなら数十センチ四方の電子ペーパーが必要。存在するのか。コスパ悪そう