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
ウェブ地図サイト「れきちず」について
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Hajime Kato
September 04, 2023
Design
1.7k
0
Share
ウェブ地図サイト「れきちず」について
第5回 「地理空間と言語処理」勉強会の発表資料です。
https://connpass.com/event/291648/
Hajime Kato
September 04, 2023
More Decks by Hajime Kato
See All by Hajime Kato
情報を翻訳する-伝わる可視化3原則とオープンデータ活用-
hjmkth
1
190
「れきちず」のこれまでとこれから - 誰にでもわかりやすい歴史地図を目指して / FOSS4G 2025 Japan
hjmkth
1
2.4k
地理院地図をもっと楽しく!れきちず新機能のご紹介
hjmkth
1
590
オリジナルのデザイン地図を作ってみた!〜OpenMapTilesとMaputnikを活用した地図スタイル〜
hjmkth
1
1.1k
オープンデータを利用して色々なものを作った話
hjmkth
1
240
日本最大級!地図・技術界隈の文化祭「FOSS4G 2024 Japan」に参加した話
hjmkth
1
130
地図・デザイン・可視化 −情報をわかりやすく伝えるために−
hjmkth
2
840
現代風歴史マップ「れきちず」フロントエンドのウラとオモテ|フロントエンドカンファレンス北海道2024 / frontend of Rekichizu
hjmkth
0
620
デザイナーがオープンな〇〇に出会ったことで人生が変わった話
hjmkth
2
440
Other Decks in Design
See All in Design
次世代のクリエイティブ体験!Photoshopの最新機能で新しい未来を切り開こう
connecre
0
130
チームをデザイン対象にする / Design for your team
kaminashi
1
1k
2026年、デザイナーはなにに賭ける?
0b1tk
0
520
富山デザイン勉強会_デザイントレンド2026.pdf
keita_yoshikawa
3
160
絵や写真から学ぶ、要素がもたらす副作用
kspace
0
240
root COMPANY DECK / We are hiring!
root_recruit
2
27k
2026年の勢い / Momentum for 2026
bebe
0
410
AIネイティブスタートアップにおけるプロダクト開発の新常識 / Product Development Tips in AI-Native Startups
saka2jp
2
1.1k
「自分の仕事はどこまで?」と問い続けたら。デザイナーの「視座」を考える
mukai_takeru
0
330
研修担当者が一番伸びた 熊本市役所✕AI『泥臭いAI研修』のワークショップ設計について
garyuten
2
340
Spacemarket Brand Guide
spacemarket
2
380
Figma MCPを活用するためのデザインハンドブック
vivion
7
15k
Featured
See All Featured
Believing is Seeing
oripsolob
1
100
Designing for Timeless Needs
cassininazir
0
180
Evolving SEO for Evolving Search Engines
ryanjones
0
170
A Soul's Torment
seathinner
5
2.6k
How to Talk to Developers About Accessibility
jct
2
170
Why Our Code Smells
bkeepers
PRO
340
58k
Conquering PDFs: document understanding beyond plain text
inesmontani
PRO
4
2.6k
BBQ
matthewcrist
89
10k
Site-Speed That Sticks
csswizardry
13
1.1k
Git: the NoSQL Database
bkeepers
PRO
432
67k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
128
55k
Digital Projects Gone Horribly Wrong (And the UX Pros Who Still Save the Day) - Dean Schuster
uxyall
0
950
Transcript
地図とかデザインとか (加藤 創) ウェブ地図サイト 「れきちず」について
01 02 03 04 CONTENTS 自己紹介 背景(きっかけ) 既往事例 目的 05
06 07 方法 結果 今後の展望
01 自己紹介
デザイナー 加藤 創 Hajime Kato
お仕事 ━ • 会社のプロモーションツール、ノベルティ等の デザインを担当
None
趣味 ━ • 地図や路線図が好きで、 Twitterにデザインと絡めた作品を投稿
None
02 背景(きっかけ)
きっかけ(社会) ━ • 昨今、街歩き・街道歩きがブームとなっている • 関連した書籍や地図など様々なサービスがある
• 自分は昔から地図が好きで、 古地図・絵図などにも興味があった しかし… きっかけ(個人) ━
天保国絵図「武蔵国」国立公文書館デジタルアーカイブ
None
天保国絵図「安房国」国立公文書館デジタルアーカイブ 小…? 朝…? …? 村😵
• 「小」だと思っていたら 実は「北」だった! 「北」(U+5317) 日本古典籍くずし字データセットより http://codh.rois.ac.jp/char-shape/unicode/U+5317/ = 北 北 朝
夷 村 😃 き た あ さ い
• 地図・歴史好きの人は見るのが楽しいが、 そうでない人にはややハードルが高い 古地図・絵図の課題 ━
03 既往事例
• 江戸の古地図『江戸切絵図』を復刻したものが いくつか存在した(制作当時) ◦ gooマップ古地図(人文社)※2023年9月27日サービス終了 ◦ 大江戸今昔めぐり(大江戸今昔めぐり製作委員会) など 既往事例 ━
• デザインは当時の絵図を踏襲 「築地八町堀日本橋南絵図」 国立国会図書館デジタルコレクション 筆者の再現イメージ
「築地八町堀日本橋南絵図」国立国会図書館デジタルコレクション 文字の向きが バラバラ…😢
「築地八町堀日本橋南絵図」国立国会図書館デジタルコレクション 文字の向きは、 建物の表門の 位置を表して いた!😲 NHK 美の壺 「File105 江戸の古地図」 https://www.nhk.or.jp/tsubo/ arc-20081010.html 表門
表門
• デザインは当時の絵図を踏襲している • 当時の絵図は文字の向きがバラバラ • 地図や歴史にそこまで興味のない人にとっては 視認性・可読性に少々難のある可能性がある • 地図領域が江戸とその周辺にほぼ限定されている 既往事例の課題
━
04 目的
天保国絵図「武蔵国」国立公文書館デジタルアーカイブ 「築地八町堀日本橋南絵図」国立国会図書館デジタルコレクション 文字の可読性に やや難がある 文字の向きが バラバラ
• 歴史・地理にそこまで詳しくない・興味がない人に とってもわかりやすい地図を作る • 江戸を含む、より広い領域の地図とする 目的 ━ 現代の地図デザインで制作する
05 方法
• 2019年、Googleマップ風の地図として制作して公開 した • 著作権の問題、1枚画像であることもありウェブサ イトしての公開には問題があった 当初 ━
None
• 当時の江戸時代の絵図を見てみると… 制作方法の検討 ━
天保国絵図「武蔵国」国立公文書館デジタルアーカイブ
「安政改正御江戸大絵図」国立国会図書館デジタルコレクション
• とても素敵なのですが、現代の地図と重ねて 描き起こせるほどの精度は残念ながら無い • ではどうするか? 当時の絵図の精度 ━
• 明治初期(1880年代)の地図(迅速測図)を 農研機構の「歴史的農業環境閲覧システム」が公開 • 明治〜平成にかけての旧版地図を故 谷謙二先生の 「今昔マップ」が公開 明治初期の地図を使用 ━
「2万分の1迅速測図」農研機構 歴史的農業環境閲覧システムより
• 位置データの閲覧・ 編集ができるオープン ソースのGISソフト • 世界的に広く使用 https://qgis.org/ 地図の土台づくり ━
• 江戸時代の絵図、明治初期の地図と さらに誤差を補正するために 国土地理院の「地理院タイル」を用いて 海岸線・街道・国境・航路などをQGIS上で描画する 地図の土台づくり ━
国立公文書館デジタルアーカイブ 農研機構 歴史的農業環境閲覧システム 江戸時代の絵図 明治初期の地図 国土地理院 地理院タイル 道筋・海岸線等を 判断・抽出 道筋・海岸線等を
描画 誤差を補正
背景画像は国土地理院「地理院タイル」
• 江戸時代の絵図、『江戸名所図会』などの当時の文献 をもとにPOI(ポイント情報)をプロット • 村・宿場町の位置は明治の地図および 「角川日本地名大事典」より推定 地図情報をつくる ━
「江戸名所図会 7巻 [1] 第1-3冊: 巻1」 国立国会図書館デジタルコレクション https://dl.ndl.go.jp/pid/2559040/1/37 なるほど、 わからん🤯
「江戸名所図会 巻1 (日本図会全集)」 国立国会図書館デジタルコレクション https://dl.ndl.go.jp/pid/1176676/1/32 読める… 読めるぞ!
• 地図のデザインやアイコンも オリジナルで作成! 地図デザイン・アイコン ━
峠 渡/湊 寺 劇場 関所 門 茶屋 山 宿場 神社
史跡 橋 城 市/店
None
• 参考にした文献等は国・行政機関・地方自治体や 博物館などの信頼性の高い出典元を極力使用した • Googleマップ等、商業地図の情報は使わない 情報をつくる上で留意した点 ━
• QGISの「タイル作成機能」を使用しウェブ上で 閲覧できる形に書き出した上、MapLibreという オープンソースの地図ライブラリに読み込み サーバ上にアップロードを行った ウェブ地図化する ━
ウェブ地図化する ━ https://qgis.org/ https://maplibre.org
None
06 結果
https://rekichizu.jp/map/ れきちず 検索
07 今後の展望
• POI(ポイント情報)などが少ない、バラツキがある • ある程度までしかズームできない • POIの表示の挙動もあまりよくない (重要度を高くしている地点が途中で消えたりする) 現状の課題 ━
None
• 現在の地図と2画面で比較・重ね合わせる • 地点を押すと情報表示できる • 多言語表示やふりがなを表示できる • 経路検索機能(できれば) 今後機能を強化したい点 ━
2画面表示 ━
情報表示 ━ 「名所江戸百景 五百羅漢さゞゐ堂」 国立国会図書館デジタルコレクション
多言語表示 ━ 「名所江戸百景 五百羅漢さゞゐ堂」 国立国会図書館デジタルコレクション
経路検索 ━
None
• 国立情報研などが運営する「ROIS-DS人文学オープン データ共同利用センター」の江戸の地名等のデータ セットを今後活用し地図を強化していきたい オープンデータの活用 ━
• ここまで反響を頂けるとは思っておらず、感謝です • 資料がデジタル化されていることのありがたさ! • 土地の歴史調べ・街道巡り等に活用いただければ • 自分は素人なので、「ここは違うよ!」 「こうした方がいいよ!」等の情報を募集中です 公開した感想
━
ありがとうございました!