2019年10月12日（土曜）に PyCon mini Hiroshima 2019 を開催しました。
イベント自体については別の場で報告を書こうと思っていますが、チームから「ウェブサイト構築の話を共有してほしい」という意見があったので、忘れないうちに、まずここに書いておきます。
hiroshima.pycon.jp は2015から2016にかけては GitHub Pages で私が自分で作りました。
2018 からは参加費をいただくイベントとして開催することに決めて、専門家に制作をお願いして、WordPress で構築されました。
（現在は静的サイトに変換して残しています）
2019 では、もっと自分たちでコントロールしながら制作したいと考えて、Next.js を使いました。
さいわいチームにはコーディングもデザインもやっていただける Nyoho さんがおられて、私は作業をチェックして本番環境にデプロイする、という立場になりました。
今年の PyCon mini Hiroshima チームは GitHub のプライベートリポジトリを作りました。
ウェブサイトのソースコードを Git で管理し、ウェブサイト制作のタスクも、それ以外のタスクも、すべてこのリポジトリの issues として管理しました。
日程だけを告知する私の仮サイト（BootStrap Studioで作成）を、Next.js のサイトに置き換えていく作業は、6月ごろ始まりました。
リダイレクトに必要な nginx の設定をリポジトリに含める提案があり、それを私が pytest と requests でテスト駆動しながら導入する、というのを（すごい広島 with Python のネタにしながら）やったのが6月下旬。
7月上旬には、プルリクエストごとにプレビュー用の Web アプリのビルドが行われるようになり、本番環境を更新する前に、ブラウザでレビューが行える体制が整いました。
このころから、私自身は node.js で React のコードを触るのをやめて、逆に本番環境へのマージの権限は私だけが持つことにして、レビューアーに徹することにしました。
7月末に Nyoho さんが SVG アニメーションで動くヒーロー画像を制作したあたりから、私は、いろいろな環境に配慮したアクセシブルなサイトであることをレビューするようになりました。
残念ながら SVG アニメーションは最後まで IE11 や Microsoft Edge では動かせなかったのですが、かわりに動かないタイトル文字を出してもらうようにしました。
このやりとりの中で、Next.js を使いながらアクセシビリティを確保できそうだ、という見通しが得られました。
やがて、スクリーンリーダーの利用者が適切に操作・閲覧できることを、私自身が「NVDA でアクセシビリティの検証をするディレクター」の立場で行うようになりました。
ページが複数になったときには、タイトルをページごとに変えてもらうようにしました。
アニメーションの機種依存振り分けの議論の途中で、 CSS で display:none するとスクリーンリーダーから読み取れなくなることを紹介すると、そうだったのかと驚かれました。
「日時」や「会場」などの情報を h2 や h3 などの見出しレベルにどう割り当てたらよいのか、あるいは見出し要素に情報そのものを入れてしまっていいのか、といったことも議論しました。
例えば「日時」という見出しがあって、その真下に「10月12日」と書いてあるのと、見出しそのものが「10月12日」になっているのは、どちらがうれしいだろうか。
スクリーンリーダーの「見出しジャンプ」という機能を紹介すると、「じゃあ見出しに情報が入っていたほうが効率的だね」という議論になりました。
一方で「日時」というテキストをスクリーンリーダー利用者にだけ読めるように提示する、というテクニックはどうだろう。
いわゆる sr-only クラスのような実装はあるけれど、想定外の閲覧環境で（例えば -10000px の位置指定が）どうなるかわからないし、みんなが同じコンテンツを読むほうがよいのではないか、と私はアドバイスしました。
テキストの表記についても、「10:00～」はちょっと不安。「10:00開始」はよさそう。「10時00分開始」はさらに安全。
けれど、このあたりの読み上げはユーザーエージェントに依存しているし、読み手は 10:00 を時刻だと解釈できる可能性は高い、などなど。
一方で IE や Edge でレンダリングが崩れる、といった指摘、機種依存文字の指摘、などもありました。
プレビュー Web アプリのおかげで、効率的に検証することができました。
ですが、Nyoho さんもご多忙だったので、実際に解決したい課題がすべてクリアできたのは、イベントの前日の夕方でした。
この話には Python の要素がほとんどないのですが、今回の一連の作業を通じて、PyCon mini Hiroshima チームの中で「アクセシビリティ、こんな風にやっていくんだなあ」という感覚を共有できたこと、私自身も「アクセシビリティやっていき勢」としての活動ができたことを、ちょっぴりうれしく感じています。
今回のイベントにスクリーンリーダーユーザーが参加してくださったわけではなく、リアルなフィードバックをいただくのもまだこれからの課題です。
このチームの経験を、次回の PyCon mini Hiroshima で、かどうかはわかりませんが、どこかで活かしたいと思っています。
タグ: hiroshima
-
PyCon mini Hiroshima 2019 のサイト制作
-
PCNひろしま 第15回終了
5月26日にPCNひろしま第15回を開催しました。
申し込みされていた経験者枠・入門者枠の方がいずれもキャンセルされたのですが、集まったスタッフ枠と見学枠の大人だけで「教材研究」をしました。
私は IchigoJam BASIC でサーボモーター SG-90 を動かす実験をしていました。
（3月に福岡のこどもプログラミングコンテスト表彰式で見学して、やってみたかった）
サーボモーターは10個セットが2000円とか3000円とかで売られています。
検索すると HowToConnectServoToIchigoJam.pdf という資料が見つかるので、ありがたく使わせていただきました。
古いモデルの IchigoJam ではスムーズにモーターが動かなかったので、きっとマイコンのチップの違いなのでしょう。モーターが1個だったらなんとか電流が足りるようです。
PDM の値を書き込むだけでホーンが動くのは MicroPython と同じような感覚ですね。
ホーンにストローを差すのではなく、ホーンの穴に直接、鈴を括り付けました。
うまく動いたので、以前購入していた HiLetGo の音センサーモジュール（5個セットで700円足らず）を使って「話しかけると鈴を鳴らす」というデモを作りました。
音センサーを使うところは2月にNT広島でやった方法です。
IN(4) で音センサーの OUT の値を読み取ると 0 または 1 が返ってきますが、音声認識のようなものではないので、雑音に弱いです。
ここでは50回読み取って1が返ってきた回数が閾値を超えたら「声が聞こえた」としています。
この数字がいい感じになるように、動かしている環境に合わせて、音センサーのつまみを調整してやります。
次回はたぶん6月30日（日曜）開催です。
今後ともよろしくお願いします。プログラム。NT広島のときの方法を応用 pic.twitter.com/VxAvnjFFLg
— にしもつ (@24motz) May 26, 2019
-
技術書典6で売り子を手伝いました
東京で開催された「技術書典6」に参加してきました。
ただの来場者として雰囲気を知ってお目当てのサークルを見に行こうと思っていたのですが、当日の朝になって、「広島電子工作娯楽部」のブースを手伝って欲しいという話が来て、サークル通行証で設営から入場することになりました。
おかげで、単に来場者として会場にいるよりも、ずっと落ち着いてイベントを楽しむことができました。基板を作ってみよう
「広島電子工作娯楽部」では「基板を作ってみよう」という新刊を著者が売っているそばで、荷物を見張ったり在庫と売上金を数えたりしていました。
私も基板は作ってみたかったので「やらないといつまでたってもできないです」「たとえ失敗しても『失敗という名の成功』が得られます」「基板が作れると表面実装が怖くなくなります。部品の選択肢が増えると世界が変わります」などなど、著者のセールストークに私も心の中で頷きながら座っていました。
約140部が終了1時間前くらいには完売。来場者1万人という規模もすごかったですが、売り手の熱意と、本の内容のクオリティに支えられた成果だったと思います。
技術書典に広島から参加したサークルとしては初めての実績だったのではないでしょうか。アクセシビリティ
前回の技術書典5では「こんのいぬ」さんが「これからはじめるWebアクセシビリティ」を販売しておられて、私は後日それを知って電子版を購入しています。
アクセシビリティについての（それを読めないかも知れない人がいる前提の）紙の本を売るって、誰にどう伝わるんだろう、と懐疑的に思ったこともありました。
ですが、未知の世界との出会いを求めている、楽しんでいる、ということが分かってきました。
だったら関わる意義はあるのかな、と思い始めたのですが、今回、私自身のサークル申し込みは落選してしまいました。
お目当てのひとつは、スクリーンリーダー NVDA の同人誌でした。
無事に「ほしがたタイムカプセル」さんのブースで NVDA と DAISY の本を入手できました。
タイトルの「NVDAではじめるヘッドレス・デスクトップ」というのはすごいインパクトですね。
購入した本を帰りの新幹線の中で読みましたが、書き手にいまはまだ視力があること、いずれ視力を失われる見込みであること、そしてご自分がソフトウェア技術者であること、さらにご自分がスクリーンリーダーのユーザーになろうとしておられること、などなど、さまざまな立場の視点が絶妙にミックスされていて、またアニメの知識からスクリーンリーダーの機能をユニークに比喩されているなど、とても興味深く読むことができました。
ブースではヘッドフォンとゲームパッドで Windows を使ってみよう、という体験の環境を用意しておられました。こういう新しい切り口で、1万人の人に NVDA を紹介してくださってありがとうございました。買った本と全体的な振り返り
買った本の写真です。全部で1万円くらいでしょうか。。
さきほど書いた「Webアクセシビリティ」の本や、同じく前回の参加者さんが出された「ネコを支える技術」 など、あとで知って電子書籍で購入させていただいた本はあるのですが、あらためて、同人イベントに実際に足を運んで（主に）紙の本を買う、という経験を考え直す機会になりました。
NVDA （と技術書典の公式ガイドブック）以外の本は、買おうと思っていたわけではなく、たまたま目に入って、ちょっと読んでみようか、と気軽に購入したものばかりです。
「テーマが新しくなくても、視点が新しければ、ユニークなコンテンツは作れる」ということがわかります。
キーワードが分からなくて探せないもの、いつか情報収集しようと思いながら実行に移せてなかったもの、逆にキーワードから得られる情報が多すぎて何を読んでいいか分からないもの、古い情報が役立たなくなってしまうもの、などなど、イベントの場でこうして紙の本を見つけることには、まだまだいろんな意味があるようです。
そういえば私はふだんから「考え事をするために本屋に行って、背表紙を眺めながらあれこれ思いを巡らせて、本当に欲しい本はあとでネットで買う」みたいなこともよくやっています。
私は自分の仕事場のペーパーレスを目指していることもあり、紙の本をたくさん持ちたいわけでもないのですが、同人誌については「まあいいか」と感じています。
電子版で買い直せたら買い直すかも知れませんね。。
400以上の書き手が発信するコンテンツを1万人の参加者に6時間で伝える、と考えると、ポスターセッションよりももっと効率的なわけで、不思議でもあり、すごいなあと思った一日でした。
来場者も年齢・性別を問わず、いろんな人がいらっしゃいました。
ふつうの入場者としての参加だったら相当並んで会場に入ることになっていたと思うと、
「東京のすごいところは、とにかく人が多いこと」
「東京のつらいところは、とにかく人が多いこと」
ですね。。