サンタクロースを支えるIT技術 @M_Ishikawa #yapcasia
•
7 likes•21,494 views
YAPC::Asia 2015 トークセッション 石川将行 https://about.me/M_Ishikawa チャリティーサンタ http://www.charity-santa.com/
Recommended
More Related Content
What's hot
What's hot (20)
Viewers also liked
Viewers also liked (20)
Similar to サンタクロースを支えるIT技術 @M_Ishikawa #yapcasia
Similar to サンタクロースを支えるIT技術 @M_Ishikawa #yapcasia (20)
Recently uploaded
Recently uploaded (9)
サンタクロースを支えるIT技術 @M_Ishikawa #yapcasia
- 2. メリークリスマス！
- 3. ⾃自⼰己紹介 • ⽯石川将⾏行行（@M_̲Ishikawa id:ishikawam） • グリーでエンジニアやってます • YAPCでのトークは2年年ぶり • これまでやってきたボランティア活動 • 地球温暖化防⽌止の啓発、障がい者福祉、等のボランティア • YAPCのボラスタッフも3回⽬目 (phpcon, html5j等も) • チャリティーサンタでITボランティア
- 5. 今⽇日のおはなし • チャリティーサンタとは • ITチームについて • プロボノ • ITチームの活動 • NPOとIT • Web以外の事例例
- 6. チャリティーサンタとは • チャリティーサンタとは • IT • プロボノ • IT • NPO • Web
- 7. チャリティーサンタとは • 全国でボランティアで集まったサンタク ロースたちが⼦子どもらにプレゼントを届け に⾏行行くNPO活動 1,775⼈人 4,434⼈人 ※2014年度実績 • 家庭から集まったお⾦金金 で海外や国内の⼦子ども たちへの⽀支援活動をし ています
- 11. 「サンタのような ⼤大⼈人を増やす」 「あなたも誰かの サンタクロース」
- 12. ITチームについて • チャリティーサンタとは • IT • プロボノ • IT • NPO • Web
- 13. ITチーム
- 15. ITチームのいろんな⼈人たち • 渋⾕谷のベンチャー企業のWebエンジニア • 中国で暮らしているWebデザイナー • 岡⼭山にいるSIerエンジニア • ベトナム出張のオフショアマネージャー • ソーシャルゲームのプログラマ • グッドデザイン受賞経験あるディレクター • 事務機器メーカーのエンジニア • 企業研修向けのIT講師 Webベンチャー企業や⼤大⼿手メーカーなど職種も様々
- 16. チャリティーサンタのITの歴史 • 代表ががんばってホームページ作る • Webデザイナーがメンバーに現れ始める • エンジニアがメンバーに現れ始める • 任意団体からNPO法⼈人へ • 複数名で作業できるようになる
- 17. • 代表ががんばってホームページ作る • Webデザイナーがメンバーに現れ始める • エンジニアがメンバーに現れ始める • 任意団体からNPO法⼈人へ • 複数名で作業できるようになる チャリティーサンタのITの歴史 • 代表ががんばってホームページ作る • Webデザイナーがメンバーに現れ始める • エンジニアがメンバーに現れ始める • 任意団体からNPO法⼈人へ • 複数名で作業できるようになる 「どうやってだよ！」 をこれから説明します。
- 19. レンタルサーバと仲良良くなる • 共⽤用レンタルサーバは基本的に • SSHが使えずFTPでファイル転送 • DocumentRootが固定 • rootにもなれず⾃自由に設定ファイルをいじれない sudo権限がないどころではない 厳しい制約
- 20. レンタルサーバと仲良良くなる • これまで：FTPでファイルを転送 • レンタルサーバはこれ=デプロイ • このデプロイは各⾃自のローカルから直接できて しまう • バージョン管理理はしていない or ⼈人⼒力力バージョ ン管理理 ！危険な状態！
- 21. レンタルサーバに git導⼊入で全部解決！ • これから：Git＆FTP • 本番に .git 置いて、git pull • FTPで転送されても git diff で変更更内容確認でき て、add&commitできる • 事故があっても戻したり、すぐ復復旧ができる • (あたりまえだけど)バージョン管理理！ すごくいい感じになりそう♪ だけど...
- 22. Git & Github導⼊入の壁 • Git&Githubを使ったことないメンバーもいる • terminal(=Linuxコマンド)を使わないメン バーもいる • sshできずftpでのみアクセスするメンバーも いる Git & Github、SSHを使わなくても⼤大丈夫な状態にする
- 23. レンタルサーバに git導⼊入でやっぱり解決！ • non-‐‑‒SSHerに対する配慮 • 「いままでどおりFTP使ってもいいんだよ」 • 「でもできたらgit、Github使うと便便利利だし楽しいよ」 • デプロイを本番での git pull とすることで、担当者がFTPとかCMSによ る変更更に気づくことができる。 • FTPで転送されても git diff で変更更内容確認できて、add&commitできる • ⼊入れているWordpressとかフレームワークで構築されたものとか も .gitignore しないで更更新されたらaddすることでバックアップになる。 • コミット汚れが気になるならそこを git submodule で管理理すればOK すごくいい感じに♪
- 25. Gitリポジトリ運⽤用 • ブランチ • 本番サーバがmaster, ステージングがdevelop, に固定しておく • Pull Requestベースだが、⾯面倒なら直commit OKの運⽤用 • リリース⼿手順 • この運⽤用ではmasterもdevelopもcommitが進む可能性があるので • master-‐‑‒>developマージしてステージングでdevelopをpull、確認。 • Githubでdevelop-‐‑‒>masterの差分確認。ここでもPRする。浮いてる commitは担当者にSlackで聞いて確認。 • OKならdevelop-‐‑‒>masterマージして本番でmasterをpull。
- 26. • Q: レンタルサーバにどうやってgitコマン ドを？ • A: 意外と⼊入れられる(XSERVER調べ)
- 27. レンタルサーバに git導⼊入でまるっと解決！ # まずgettext cd ~/tmp wget http://ftp.gnu.org/pub/gnu/gettext/gettext-0.19.1.tar.gz tar gettext-0.19.1.tar.gz cd gettext-0.19.1 ./configure —prefix=$HOME/opt make make install export PATH=~/opt/bin:$PATH # .bashrcにも入れる # そしてgit cd ~/tmp wget https://github.com/git/git/archive/master.zip unzip master cd git-master make configure ./configure --prefix=$HOME/opt make all make install
- 28. レンタルサーバに emacs導⼊入で気分も爽快！ # ncursesが必要 cd ~/tmp wget http://ftp.gnu.org/pub/gnu/ncurses/ncurses-6.0.tar.gz tar zxvf ncurses-6.0.tar.gz cd ncurses-6.0 ./configure --prefix=$HOME/opt make make install # そしてemacs cd ~/tmp wget http://ftp.gnu.org/pub/gnu/emacs/emacs-24.5.tar.gz tar zxvf emacs-24.5.tar.gz cd emacs-24.5 LDFLAGS="-L$HOME/opt/lib" ./configure --prefix=$HOME/opt --without-x make make install
- 29. レンタルサーバのちょっと変わった仕様も エンジニアリングでカバーする • DocumentRootの階層問題 • hoge.com, www.hoge.com • ~∼/hoge.com/public_̲html/ • test.hoge.com • ~∼/test.hoge.com/public_̲html/ ではなく • ~∼/hoge.com/public_̲html/test/ ！！ • これだと • hoge.com/test/ で test.hoge.com にアクセスされてしまう • サイトルート相対パスだと崩れる ln -‐‑‒s ~∼/hoge.com/public_̲html/test ~∼/test.hoge.com で解決。 .gitignore に/test/を。/test/に .git を設置。 あとは.htaccess でなんとかする
- 30. レンタルサーバで諦めたこと • zsh • まあいらないか • redis, memcached • ポート使えそうだったけど、マナーとしてやめておい た。ファイルキャッシュで。 • ユーザーアカウントは1つのみ • これも本番サーバと思えば諦められる
- 32. ボランティアでエンジニアリングする モチベーション • 好きなツール、好きな技術を好きに使わせ てもらうこと。 • やりきった後のビール • ⼦子どもたちの笑顔（ ＾ω＾） • 好きなツール、好きな技術を好きに使わせ てもらうこと。
- 33. 担当別なので結構好き勝⼿手(許容) $ ls public_html ... Supporter_Claus callback cbbs index.html letter m sandbox secure staff test WPにCompass/Sass使うね 開発⽤用 BootswatchとVanilla PHPで 決済のcallback⽤用 KENTの墓場... レンサバのSSLディレクトリ リニューアルサイト！ Laravel5, Gulp WP使うー ステージング。サブドメ。 申し込みフォームは herokuで動かすね ⻑⾧長く運⽤用してるDWサイト
- 34. 使っているツール • Github • Private Repositoryは個⼈人が1つ提供 • Facebook • Slack • Trello • Prott • Vagrant • Heroku • ツールじゃないけど • Confluence • 有料料だけどどうしても使いたくて⽯石川が提供 基本的にコスト0
- 35. ジャンルを越えて 技術に触れられる • まるでOSSコミュニティ＋多技術 • まるでハッカソン＋1⽇日じゃなく1年年〜～ 1年年続くハッカソンを想像してみてください！
- 36. プロボノ • チャリティーサンタとは • IT • プロボノ • IT • NPO • Web
- 37. –wikipediaより プロボノ（Pro bono）は、各分野の専門家が、 職業上持っている知識・スキルや経験を活かし て社会貢献するボランティア活動全般。 また、それに参加する専門家自身。
- 38. プロボノ • 専⾨門職である私たちが、技術をもってボラ ンティア活動すれば、それはプロボノ。 • アメリカやイギリスではメジャー。⽇日本は ぼちぼち。 • NPOはえてしてIT⾳音痴。技術職のプロボノ が求められている
- 39. ⽇日本の主なプロボノ仲介サービス • サービスグラント • プロボネット • ⼆二枚⽬目の名刺刺 • a-‐‑‒con • Social Marketing Japan • ⽇日本でも少しずつ増えてきています
- 40. 関わり⽅方 (例例:チャリティーサンタ) • 作業は普段は週に2時間くらい • ⽉月に2回のもくもく会 • 忙しい時期になるともっと。 • でも、だれがどれくらい関わるかは任せら れる • まるでOSSコミュニティ！
- 41. プロボノ＝OSS＋リアル
- 43. ITチームの活動 • チャリティーサンタとは • IT • プロボノ • IT • NPO • Web
- 44. ITチームの活動 • 作業は普段は週に2時間くらい • ⽉月に2回のもくもく会 • 忙しい時期になるともっと。 • でも、だれがどれくらい関わるかは任せら れる
- 45. もくもく会 • ⽉月に2回、打ち合わせでもなく、ミーティングでも なく、ただモクモクと作業をするのに同じ場所に集 うだけ。 • 結局はちょっと議題がでてきたり、進捗が確認でき たり、相談ができたり、元気かどうか確かめられた り。 • つまり職場で仕事してるのとかに近い環境
- 46. ITチームが去年年やったこと • ITチーム発⾜足！ • 新サービス(サンタクロースからの⼿手紙)リ リース • サポタクロースLPのリリース • Web決済の⾒見見直し、整理理 • サンタ申し込みフォームの改善
- 47. 新サービス開発 サンタクロースからの⼿手紙 ITチーム ⼿手紙制作会社 本部 Web開発 商品開発 リアルの⼿手紙がどんなものかを ユーザーにサイトで伝える 全国の家庭 サイト注⽂文 ⼿手紙の配送
- 49. 申し込みフォームの改善 ITチーム 全国のサンタ 22⽀支部 フォーム設計、開発 「サンタ申込みフォーム」はこの活動のキモ！ コンバージョンやKPIを設定して企画し開発 エンジニアの領領域を越えてサービスに参加できる 全国の家庭 申し込み ボラ応募 各⽀支部の個別の要望に応える 以前はフォームズで申し込み メールをExcelへコピペ
- 50. ITチームが今年年やること • スタッフ⽤用サイトのリリース • サイトリニューアル • レスポンシブとかコーポレートサイトとか • サンタ申し込みフォームの強化 • 当⽇日の訪問先地図のシステムリリース • 個⼈人情報の取り扱い強化
- 55. ※⽀支部の活動とは • サンタ集め • 訪問先の家庭集め • 交流流イベント • ボランティア管理理 • 訪問先管理理 • 講習会実施 • 活動報告会 • ⾐衣装、プレゼント制作
- 56. 地図(GoogleMaps)の活⽤用 • いままで • 申し込みフォームから届いた メールに書いてある個⼈人情報 をエクセルにコピペしていた • これから • GoogleMaps APIを利利⽤用しマ クロ等アプリケーション開発し て業務を楽に＆安全に ITチーム ⽀支部 地図を担当 現場で開発
- 57. ITチームが来年年やりたいこと • 個⼈人情報の取り扱い強化 • メンバー増強 • あとは… • あなたが考えたステキなアイデア♡
- 58. 現状の課題 リテラシーやセキュリティ • いろんな⼈人が活動に参加している • ITを使った途端なかなか⾔言葉葉が通じない⼈人も • ⼦子どもの個⼈人情報の取り扱い⽅方 • SNSの危険性、ITリテラシー • 急に⾳音信不不通 • クラウド上の共有データの紛失、破損
- 59. 現状の課題 ITサンタを増やす • 5⼈人いても週で2時間なら労働で換算すると0.25⼈人 • 職業やプライベートの状況によって作業できたりで きなかったりで変動するので不不安定 • プロボノ組織なので多様なスキルや経験が増えたほ うが可能性が広がる • このあたりを⼈人数でカバーしたい
- 60. NPOとIT • チャリティーサンタとは • IT • プロボノ • IT • NPO • Web
- 62. ⽀支援例例 • Microsoftのクラウドサービス 「Office365」を無償提供 • Google AppsやAdを無償提供 • SmartNewsは10のNPO団体に半年年間 100万円分の広告枠を提供 • Salesforce 年年々⽀支援内容は 変化したりする
- 63. その他のNPOの助成 • 企業からのNPO⽀支援プログラムを受けられる（要審査） • 継続的にやっているもの、期間限定で枠を設けてやって いるもの、などなど • 企業の多くは年年度度毎に⽀支援団体数や⽀支援⾦金金額の予算を組 んで⽀支援団体を募集し決定する。 • ⽀支援をやる年年、やらない年年、があったりする。
- 64. • 他にも、⼈人材⽀支援や低価格プログラム等、 思いつくほとんどのことがNPOだと優遇さ れる！ • ※ただし、審査あり • 実績とか、信頼の調査 • どこを⽀支援するか、ということは、その企業の CSRレポートやIR等につながるので重要。
- 65. Web以外のIT事例例 • チャリティーサンタとは • IT • プロボノ • IT • NPO • Web
- 66. Webじゃない例例 • 同時字幕通訳要約筆記 • なにそれおいしいの？
- 67. パソコン要約筆記（同時字幕通訳）
- 69. IP talk • パソコン要約筆記⽤用のソフト • 投影⽤用、筆記者⽤用全てに⼊入れておく • 無料料で配布されています。 • 複数⼈人（最⼤大8⼈人）で筆記が可能 • Windows専⽤用 • だれでも無料料でダウンロードでき、即利利⽤用可能 • 同じネットワーク（LAN）でつながっている必要があります • 筆記者⽤用、投影⽤用ともに同じソフトで設定を変えます
- 70. IP talkの課題 • 筆記ボランティアの⼈人材不不⾜足 • 要約筆記サークルは限られた地域にしかない • 簡単なのでできれば知り合いでやりたい • システムの⽼老老朽化 • Macでできない • 進化していない • アイフォン、スマートフォンに投影したい
- 71. ゆえに
- 72. 新しく作れば あなたもヒーロー！ エンジニアが活躍できる場所は NPOにあった！
- 74. gulp-‐‑‒xmas
- 75. gulp-‐‑‒xmas • grunt-‐‑‒xmas • gulp-‐‑‒xmas (NEW!)
- 78. さいごに
- 79. • Q: どうしてお⾦金金にならないのにそんなこと やってるの？ • A: みなさんお⾦金金にならないのにコード書い たりしてますよね（ ＾ω＾）
- 81. ご清聴ありがとうございました • ぜひ繋がって下さい！ • @M_̲Ishikawa • id:ishikawam • 資料料公開してます • みなさまの貴重なお時間頂き ありがとうございましたm(_̲ _̲)m