Advertisement
メイキング・オブ・ザ・さっぽろ保育園マップ
Jul. 7, 2015•0 likes•1,834 views
4 likes
Be the first to like this
Show More
views
Total views
0
On Slideshare
0
From embeds
0
Number of embeds
0
Download to read offline
Report
Software
FOSS4G Hokkaido 2015発表資料。 2014年にCode for Sapporo で開発した「さっぽろ保育園マップ」の反響と制作についてまとめました。
Yusuke SuzukiFollow
Programmer at フリーランスAdvertisement
メイキング・オブ・ザ・さっぽろ保育園マップ
- メイキング・オブ・ザ さっぽろ保育園マップ 2015/07/03(/(FOSS4G(Hokkaido Code(for(Sapporo 共同代表(:(すずきゆうすけ( (@yuskesuzki)
- 提供
- 自己紹介
- すずきゆうすけ • 長野県出身。北海道在住15年目 • 江別市在住 • 職業：フリーランスプログラマー
- 江別市とは？
- 平地とレンガと豪雪が有名な 札幌のベットタウン
- 趣味
- 以上、閑話休題終わり
- Code%for%Sapporo
- Code%for%Sapporo%とは • h#p:www.codeforsapporo.org • 共同代表 • すずきゆうすけ • Fix4My4Street4Japan4開発者4:4川人さん • メンバー410人ほどで活動
- 活動
- 活動 • Code&for&Japanブリゲード団体 • 札幌近郊でシビックテックをやってる団体 • ハッカソン・アイディアソン • マッピングパーティ • 作成したアプリケーションのメンテナンス
- さっぽろ保育園マップ
- h"p:// papamama.codeforsapporo.o rg
- さっぽろ保育園マップ!:!特徴
- その１：地図である
- • 札幌市内に点在する保育園(認可、認可外)、幼稚園 を掲載
- その２：保育施設の詳細情 報
- その３：施設クリックでポップアッ プ • 住所 • 施設のホームページ • 預けられる時間 • 保育の内容 • 空き有り":"札幌市のホームページに移動
- その４：小中学区表示
- その５：絞込検索
- 施設属性を条件絞り混み検 索
- さっぽろ保育園マップの反 響
- わりとあった
- びっくり
- 新聞、雑誌、ネットで紹介 • 朝日新聞 • 北海道新聞 • So$ware)Design)vol.20 • WIRED)vol16 • SAPPORO)SMILE)h@p://www.sapporosmile.com/ projects/codeIforIsapporo/
- 受賞
- アーバンデータチャレンジ 2014金賞
- 他地域に展開された
- 他地域に展開 • つくば市 • 横浜市金沢区 • 沖縄県浦添市 • 奈良県生駒市 • 徳島県版 • 千葉県流山市版
- さまざまな反響に びっくり
- 本題
- メイキング・オブ・ザ さっぽろ保育園マップ
- 開発のきっかけ
- この人
- 開発前夜 • 久保さんとの遭遇 • FOSS4G'2014で初めてお会いする • すずき':'CfS発のアプリを作りたい • 久保':'保育園を簡単に調べる手段が欲しい
- Win$Win • 2014年9月末に開発開始
- 開発環境
- • HTML • CSS • JavaScript • jQuery52 • jQuery5mobile • OpenLayers3 • GeoJSON
- わりと普通のWeb開発
- しかし、地理位置情報の知識はゼロ • 作りながら学んだ • しかしまだまだ知識が怪しい… • EPSG:3857,って何？とかすぐに答えられない...
- 開発の手順 • プロジェクトのディレクトリ移動 • Web%サーバ起動 • python%,m%SimpleHTTPServer%8000%→%h9p:// localhost:8000%でページ表示 • Web%サーバ経由で確認しないと%Ajax%処理が動 かない • テキストエディタでソースコード編集
- 地図ライブラリ!:!OpenLayers3 • 地図タイルの表示 • マーカーの配置・表示 • GeoJsonデータ取り扱い • 駅、ランドマーク地点、現在地移動 • 円描画などなど...
- チーム構成 • CfSパパママチーム%:%5人 • プログラマー%:%2人% • デザイン・データ作成:3人
- 開発期間 • 合計"約1ヶ月半 • 随時アップデート • フルタイムで仕事した後、ほぼ毎日1∼3時間の作 業
- ソース管理
- ソース管理 GitHub
- ソース管理 • h#ps://github.com/codeforsapporo/papamama • 無料 • ソースコードは常に公開されてる（版） • 分散バージョン管理ツール6git
- 運用
- GitHub'Pages
- • Github(Pages • "gh/pages"(ブランチを作成 • ドメインとCNAME(ファイルを用意 • →GithubをWebサーバとして全世界に情報発信 • 無料で使える
- ちなみに
- GeoJsonデータを Githubで管理すると 勝手に地図ができます
- 打ち合わせ
- 打ち合わせ • FaceBookグループのチャット • 開発中、直接会って打ち合わせる事はほぼなかっ た
- 保育施設データの入手
- 保育施設データの入手 • 札幌市HPに掲載 • ただしオープンデータではない • ここからゴニョゴニョとデータを拝借 • CCついてるだけでも違うんだけどな…
- 保育施設データの入手先 • 保育園の名称住所しか掲載されてない • ジオコーディングで座標を取得 • おそらくQGISを使ってGeoJsonデータ生成
- 保育施設データの入手先 • 保育施設のホームページ情報の取得 • 検索エンジンの結果からスクレイピング？ • GeoJsonデータの(property(にURLを保存
- 開発で苦労した点
- デザインに明確な仕様がない • 意見もらって、作って、意見もらって、修正...# • 作ったけどなくした機能もある • 区の移動機能 • こども園の表示 • 動きの微調整 • この辺りにわりと時間を使ってた
- OpenLayers*3 • 日本語の情報が少ない • OpenLayers2とは異なる • 多機能。だが重厚 • ライブラリーが提供する機能以外の独自の機能拡 張が作りづらい • モバイルフレンドリーではない • 動かないスマホ環境がある
- なので
- 現在、さっぽろ保育園マップ!ver!2! を開発中 • Leaflet.js*ベース • 絶賛開発中 • データは*ver*1*をそのまま使える予定
- マップを作った結果、個人の仕事に も影響 • 保育園マップの応用システム • OpenLayers2,で某港湾管理システムの地図画面 • 某SFAのデータを「いつもNAVI,API」で地図連携 • 某SFAのデータを「Google,Map,API,V3」で以下略 • 仕事の幅が広がった
- めでたし!めでたし
- Code%for%Sapporo お知らせ
- メンバー募集
- • イベント参加 • プログラミング • デザイン • ホームページの記事更新 • イベント運営スタッフ • など
- イベント：シビックハックナ イト(仮)
- シビックハックナイト(仮) • h#p://www.codeforsapporo.org/hacknight1/ • 日時：2015年7月21日;19:00=20:30 • 場所：Sapporo;Cafe;2F;(札幌市北区北8条西5丁目 2=3;札幌公務員受験学院ビル1F･2F)
- 餃子クックソン(仮) • 調理できる場所を借りる • 集まる • みんなで餃子を包んで、焼いて、食べて、飲む • 寝る"シビックテックについて語る • 企画中 • 決まったらホームページでお知らせ"
- 以上 powerd'by' 'Deckset
Advertisement