nishimotzの日記

投稿者: nishimotz

  • PyCon mini Hiroshima 2019 のサイト制作

    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 で、かどうかはわかりませんが、どこかで活かしたいと思っています。

  • リスボン: Vocalizer for NVDA のふるさと

    shuaruta blog でも書いていますがヘルシンキとリスボンに行きました。
    ペット事業の調査もしたのですが、ポルトガルに行くなら Rui Fontes さんに会ってみたいと思い、連絡を取って、時間を作っていただきました。
    スクリーンリーダー NVDA のコミュニティで 2013 年ごろに発売された Vocalizer for NVDA という有償の音声合成エンジンがあるのですが、この製品の発売元 Tiflotecnia 社の代表が Rui Fontes さんです。
    日本からも購入してユーザーになっている人もいらっしゃいます。
    私も発売当時に製品やウェブサイトの翻訳を手伝ったのですが、メールでのやりとりしかしたことがありませんでした。
    お会いしたのは6月21日の午後、観光客でにぎわうベレンという町のカフェでした。盲導犬のドゥピィくんを連れて Rui さんはいらっしゃいました。
    写真 西本と Rui Fontes さんのツーショット
    服装は水色のポロシャツとジーパン、シルバーの髪、たっぷりと髭を蓄えた芸術家のような顔立ち。
    グラスをクルクル回しながら、穏やかにお話をしていただきました。
    失明される前は会社員、コンピューターも使ったことがあった、失明して退職して起業。ずっと夫婦2人で会社をやっている。
    もうひとりの Rui こと、ポルトガル在住のエンジニア Rui Batista さんが NVDA 事業のパートナー。
    スクリーンリーダーが登場したころはポルトガル語のよい音声エンジンがなくて苦労した。Dorphin とか ZoomText とか WindowsEyes とかスクリーンリーダーはいろいろ使った。
    現在は視覚障害者が使うスクリーンリーダーとしては NVDA がいちばん普及している。メーリングリストなどで教えあうことが多い。障害者協会のICT普及活動は少ない。支援機器の展示会はポルトという町で行われているけど、出展料が高いから出さない。
    人口1000万人のポルトガルで、NVDAユーザーが400人くらいだ。（日本は人口がその10倍で、NVDAユーザーは1.5倍ですね。。）
    NVDA は無料なのだからと言われて、サポートにお金を払ってくれる人は少ない。
    視覚障害者の職業で多いのはテレフォンオペレーターだ。マッサージをする人は昔はいたが、今はいなくなった。
    Microsoft Office は使われている。Excel でみんなが高度なことをしてるわけではないので、JAWS が必要な人は少ない。NVDA の機能で十分だ。ナレーターはまだ Office を使うには足りないだろう。
    パソコンが普及したかわりに DAISY など録音図書が普及していない。
    スマートフォンは Apple が普及しているが自分は Android にこだわっている。Samsung と Huawei が多いが、後者は貿易摩擦の影響が懸念される。
    ポルトガルは障害者差別禁止法制の整備は早かった。法律はよいのだが、あまりちゃんと機能していない。クレームをつけない、受け身の当事者が多いのは、国民性かも知れない。。
    移民が増えて、民族や文化は多様化している。ポルトガル語を喋る国はアフリカにも南米にもあるから。。
    （市内のラクガキがひどいのもその影響？）そうかもしれないね。。
    リスボンからちょっと離れた場所が自宅兼会社だが、ここは住みやすいよ。
    そんな会話が、カフェの閉店時間まで、まったりと続いた午後でした。ドゥピィくんは2時間半の会話の間、ご主人の横でじっと座って待っていました。
    カフェを出ると目の前はジェロニモス修道院と真っ青な空。

    写真 ジェロニモス修道院

    Tiflotecnia の人とご挨拶ができたので、これからは Vocalizer for NVDA を日本で使っておられる人、購入を検討されている人にも、なにかお役に立てることがあると思います。
    NVDA の Python 3 移行に対応する予定もちゃんとあるそうなので、ご安心ください。
     
    追記（2019年7月8日） NVDA 日本語チームの GitHub Wiki 「NVDA用音声エンジンの紹介」で Vocalizer for NVDA の購入方法を解説しています。

  • PCNひろしま 第15回終了

    写真 IchigoSoda + 音センサー + サーボモーターの配線
    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日（日曜）開催です。
    今後ともよろしくお願いします。