モノクロタイム

I'm from the future!

第9回長崎デジタルコンテストでスプリンター賞を受賞しました

こんにちは、れいじです。

11/21-11/22に開催された長崎デジタルコンテストに参加してきました。

今回は学生限定かつ開発期間(約3ヶ月間)開発をしてくるのではなく、社会人も交えて約20時間の制限時間内でプロトタイプを作成・もしくは企画を発表するハッカソン形式のイベントとなっています。

digicon.me

今回参加したイベントは

の二本立てて、アイデアソンの内容を元にハッカソンで成果物を作っていくのですけれども、私自身会場でチームを組む、当日のアイデアソンを元にプロトタイプを組む、というのが初めてだったので不安も大きかったです。

常連的に参加しているHackDayでは

  • 既に決まったメンバーで

  • 自分たちの作りたいものを考えて

  • 事前に何が必要かを考えたり、どういった技術があるかを調査したりする

ので、『考える』というフェーズがハッカソン当日には無いんですね(チームによっては当日アイデア出しをするチームもあるみたいですが)。

なのでアイデアソンを含めた24時間でものを考えて作って発表するっていうのは初めての経験です。

作ったもの

「ココどがん?」というWebサービスを作りました(スマホで見ること前提に作っています)

kokodogan.herokuapp.com

アプローチについて

元々のテーマとして「長崎✕デジタル」というものがあり、人口減少や未だアナログで回る社会などなどの問題を解決するためにIT技術を活用して課題を解決するのが目的です。

自分たちのチームでは、

  1. ブレストで出た内容を社会の問題か、個人の問題であるかに分け

  2. 個人の問題に近いほど解決が容易であって、何通りものアプローチが考えやすい

と当たりを付けてアイデアを膨らませていきました。

f:id:yomoyamareiji:20201124232538j:plain

※もし同イベントの参加者が当ブログを見ていて、かつハッカソンの継続参加に意欲があるならば以下の書籍がおすすめです。

私がブレストをしたり、新しいアイデアを求められたりした時やプレゼン等で人の共感を得る話をする時に参考にしてきたものです。

ストーリーマッピングをはじめよう

ストーリーマッピングをはじめよう

ユーザーストーリーマッピング

ユーザーストーリーマッピング

  • 作者:Jeff Patton
  • 発売日: 2015/07/25
  • メディア: 単行本(ソフトカバー)

色々なアイデアが出た結果、

  • 地方の飲食店を始めとして、観光地の営業時間や料金情報が古かったためにガッカリした体験がある。

  • 長崎に到着したはいいけど、次の予定まで時間が空いている。この辺りのおすすめスポットが知りたい。

  • 話題のお店でも行き方がわからない。どのバスに乗れば良いのか、何処で降りれば近いのか?

上記3つを解決するために、地元住民に情報を提供してもらうことで情報の鮮度を保ちつつ、さらに信憑性が絶えず更新され続けるような新サービスとして当サービスを開発しました。

サービス概要

以下はスポット(観光地・飲食店・etc……)の情報詳細ページです。

f:id:yomoyamareiji:20201124235011p:plain

情報の鮮度を保証する

  • 地方の飲食店を始めとして、観光地の営業時間や料金情報が古かったためにガッカリした体験がある。

ページ下部にコメント欄があります。コメント欄では、県内在住者と県外在住者とのコミュニケーションが可能となっており、当該スポットについての質問を行うことができます。この機能によって、スポットそのものへの理解を深めたり、或いは地元住民しか知らない情報を聞くことが可能となっています。

f:id:yomoyamareiji:20201125000021p:plain

街の魅力を感じてもらうためのレコメンド機能

長崎に到着したはいいけど、次の予定まで時間が空いている。この辺りのおすすめスポットが知りたい。

上記の問題を解決するために、「ココどがん?」欄で、当該スポットから然程苦労せずに行けるスポットを提示しています。この情報は、当該スポットの次に何処に行ったかの情報を県内在住者に提供してもらうことでレコメンド指標の一つとしています。

将来的には閲覧者の好みやカテゴリー指定によってより目的に即したレコメンドが出来るようになればいいですね。

情報の信憑性を保証する

話題のお店でも行き方がわからない。どのバスに乗れば良いのか、何処で降りれば近いのか?

このページに提示されている内容は基本的にユーザーに投稿してもらうもので、システム側から何か良い感じのアルゴリズムを使って提示するということはありません。長崎県内に住む人の感じているリアルな現状や感情を乗せることで、情報の信憑性を保ちます。

ハッカソンとは楽しんで、悔しがって、成長していくもの

ハッカソンが途中でつまらなくなってくることの大きな理由として、進捗が上がらないとか自分たちが作ってるものは本当にいいものなのかとか、そもそも完成するかどうかの焦りとか、時間に対する恐れが膨らんでくるからなんですよね。まあでも深夜に進捗バリバリ出るほうが普通はおかしいんですよ。特に初参加の場合って。

私の場合過去のデジコン歴代優勝者なんて書かれていますが(全然関係ないけどこれ入れたら三冠っすね!)、私がいわゆるこういう『ハッカソン』に参加したのは2011年か2012年辺りの頃で、その時マジでチームに何も貢献できなくて悔しくて悔しくてたまらなかった経験があります。

reiji1020.hatenablog.com

reiji1020.hatenablog.com

そういう経験があって、一度チームを組んで開発する前にまずは自分自身の技術力を磨き上げて、一人でどこまで出来るかを試した初めてのイベントが第二回長崎デジタルコンテストでした。その後第5回デジタルコンテストにも呼んでいただいて運良く同じように最優秀賞を頂きまして今回に至ります。正しくはその後に3回HackDayに出場し、次はチーム(タッグ……?)での勝利の方程式を編み出していくことになるのですが、これはまた別の話なので割愛します。詳しくは過去記事で。

reiji1020.hatenablog.com

reiji1020.hatenablog.com

私はバカなので朝6時くらいまで500のプレモルちびちびやりながら開発してましたけど、多分慣れてないと無理だと思います。慣れてるからできるし、見通しが立ってるから酒を入れてもなんとかなるし。ただ、ビールを飲まなくてもリフレッシュはできる訳です。深夜帯ってのめり込みたくなる気持ちはわかるんですが、意外とリフレッシュに時間を使ったほうが局面打開出来たりすることがあります。休憩大事。色々講釈垂れてるんですが、結局はハッカソンイベントたのしー!次も参加してー!と思えるような体験ができたかどうかに掛かっているのかな、と思っています。あとは一度決めたコンセプトをひっくり返して再び議論をすることは往々にしてナンセンスです。作ってしまったものがひっくり返る可能性すらある。

もう私も地元を流出した側の人間なので、どちらかというとガチガチのガチで開発するよりは場の盛り上げとかサポートに徹する方が良いのかと思いましたがついついアツくなってガッツリ開発やってました。なので皆さんに元気があればもっと情報交換とかしたかったですね。

技術について

「ココどがん?」は以下の技術・サービスを使って開発されています。

キニナッタヒトハシラベテミテネ

まとめ

今年、というよりは社会人になってからは開発関連で本気をだすというよりはナレッジを残していくのが使命なんじゃないかと少しだけ思っています。勿論無料でではないですけど……

もうここまできたら私もお助け屋さんポジションで会場ウロウロするだけの遊び人ポジションになってみたいとちょっとだけ思いました笑

とにかく来年のアニバーサリー・イヤーイベントが楽しみです!ありがとうございました!

ではでは。

Microsoft Azureを撤退してGitHub Pagesに色々移行した

こんにちは、れいじです。

有り難いことに主催の方からお声掛け頂き、第9回長崎デジタルコンテストに出場することになりました。

digicon.me

過去の軌跡はこんな感じです。

reiji1020.hatenablog.com

reiji1020.hatenablog.com

最後の出場回で作ったVJ-Cardboardですが、学生時代の無料アカウントを駆使しまくったMicrosoft Azureでホスティングしていました。

当時は金欠金欠アンド金欠でなんとか無料で使えるPaaSサービスを利用していましたが既に社会人となり、さらに社会は進化してgithubでもWebページが公開できる時代になっていました。

Azureは元々使うの辞めたいな~(だるだる)とずっと思って思っていたので、思い切ってGitHub Pagesに移行した次第です。

移したサイト

VJCardBoardのLPをGitHub Pagesに移しました。

reiji1020.github.io

雑な手順

  1. 元々コードをBitbucketで管理していた(当時はPrivateリポジトリが無限に作成できるサービスがこれくらいしかなかった)のと、もうPrivateにする必要もないのでGithubリポジトリを移行しました

https://github.com/new/import

全然関係ないけどsvnって聞かなくなったなあ。

  1. リポジトリ名にgithub.ioをつける

  2. 公開する

諸々の設定事項は以下を読み進めて実施しました。

docs.github.com

これすごく便利だしこれアカウントごとに1つとか制限ないらしいです。 儲かってるのか不思議。サンキューGitHub

ではでは。

わかばちゃんと学ぶ Git使い方入門

わかばちゃんと学ぶ Git使い方入門

【Netlify+ReactApp】create-react-appで作ったWebアプリでNetlifyのForm機能を使う

こんにちは、れいじです。

NetlifyというHerokuみたいなPaaSサービスがあるのですけれども、これが中々よろしいサービスでして最近色々と弄ってみてます。

www.netlify.com

無料枠でも

  • 月300デプロイまで可能
  • カスタムドメイン設定可能
  • 簡易CI/CD

などなど。アクセス数に関しても(大バズする程でなければ)全然大丈夫。確か12万アクセスまで大丈夫だった気がする

その中でも目立つのがFormという機能でして、例えばショップページを運営している場合だとお問い合わせフォームや商品に関する感想を受け付けるフォームが簡単に実装できます。

qiita.com

私はWebページを作る時は専らReactなりVueなりを使っているので、今回作ろうとしたページもReactで作るつもりでした。皆おなじみcreate-react-appです。

…………Form動かねえ~~~~~~~~!!!

滅茶苦茶悩んでなんとか実装出来たのでサンプルコードと共に置いておきます。

利用技術+αは

  • React(create-react-app)
  • Material-UI

です。

第1の躓き:補助用formタグはpublic/index.htmlに書く

も~~~~~これですこいつが全ての元凶。いや私の頭が悪いだけかもしれん

そもそもNetlifyのForm機能を使うためにライブラリを導入しなければならないとかそういうのは一切なく、form要素にnetlify属性を付与してやればNetlifyのBotがその値を読み取ってFormと連携してくれるよっていうのが強力なポイントなのですけれども、JSXを使っている場合だと上手く動かないらしいです。(Botが検出できるのはHTML要素だけであって、JSによって生成されたHTML要素はクロールできない)

この問題を解決するために以下の公式のドキュメントには、任意のhtmlファイルにnetlify属性を付与したformタグを書いておく必要があるらしいです。

www.netlify.com

上で述べたように、JSで生成されるHTML要素(コンポーネント)はbotがクロールできないので、こいつをReact,Component内だったりfunction Componentの中に書いても動作しないんですよね。

で、create-react-appコマンドで作ったWebアプリでこいつが書けそうなhtmlファイルはindex.htmlしかありません

つまりこんなかんじ

これでNeilifyのBotが「オッこのページにはNetlifyのFormと連携する要素があるっぽいぞ!」と把握することができます

第2の躓き:補助用formタグの中で仕える要素はinputかtextarea

Material-UIとかいい感じのコンポーネントライブラリを使っていると色々と忘れがちだと思うんですけど、コンポーネント側でどんなFormやInputを使っていようと、index.htmlに追記する補助タグの中身はinputタグかtextareaタグじゃないと動作しないようです。

例えば連携するフォームが以下のようなものでも、index.html側に書くものは基本的なフォーム系タグで構成されていなければNetlify側で掴む事ができません。いや当然といえば当然なんですが本当HTML5のタグ忘れるよ……Reactとか使ってるとさ……

gist.github.com

第3の躓き:inputタグを忘れない

<input type="hidden" name="form-name" value="message" />

これ!!これね!!

index.htmlを読み込んだ時に見つけたフォームと紐付けるための大事なやつだから忘れちゃだめなやつです!公式フォーラムで「Form動かねえ~」って質問してる人のうち9割くらいがこのinputタグ書いてないとかそんな感じだったと思います

Netlify form not submitting, or showing page not found error - Support - Netlify Community

[Support Guide] Form problems, form debugging, 404 when submitting - Support Guides - Netlify Community

これを書かないとそもそもNetlifyのForm機能に値が送信されないので気を付けてください。

まとめ

というわけでなんとか実装できました

f:id:yomoyamareiji:20200823120603p:plain

Formikとか使ってたらもっとややこしそう(こなみかん)

github.com

全然関係ないけどNetlifyのフォーラムには運営側の人が結構常駐していて、こういうTipsの共有をかなり嬉しがるっぽいです。英訳してフォーラムに投稿しちゃおうかな~(英語力皆無)

ではでは!!

診断から半年経って漸くADHDを受け入れられるようになった話

こんにちは、れいじです。

多分会社の人も見ているだろうしブログにするのはいかがなものかというところはあるんですが、知ってる人は知ってればいいし知らない人は知らないでいいんじゃないかなあということで書くことにしました。一文が長え!

昨年の初め頃より人生生きづらいなあ~みたいな状況が続いていまして、すったもんだしながら昨年10月にメンタルクリニック行ったら見事ADHD(注意欠陥・多動性障害)という結果が出ました。ついでに双極性障害のオマケも付いてきました。ハッピーセットかよ。

reiji1020.hatenablog.com

直近だと大学院でも生きづらそうなこと書いてました。生きづらさの周期がオリンピックか?

カウンセラーにも「20数年間お辛かったですね…」(鼻スンスン…)みたいな事言われたので多分同じ診断をされた人は基本生きづらいんだと思います。

ただ私の場合は通年生きづらいというよりは直近だけが生きづらかったので「はぁ、そうなんすか、」っていう感想でした。

自分より大変そうな人、例えば大学を留年してしまったり、仕事をするのが困難だったりする人はたくさんいると思っていたからです。自分の場合はそこまででもなかったんですね。

授業中に寝ることは大学院を出るまで一切ないし、忘れ物も遅刻も人並みで、勉強も人並みにできました。授業中に立つとかお喋りが止まらないということもなく。

なので脳波検査(光トポグラフィー検査)を実施したところ、「あー見事双極性障害の脳波に一致してるね、脳波の揺らぎもある(神経可塑性に異常が見られる)からADHDだねー」と言われてマジか…と落ち込みました。

そういうのもあって中々ADHDを受け入れられずにいたんですが、ちゃんと向き合う時間をとることで何とか立ち直れそうなところまできました。ある意味節目なんで、ちゃんと残しておこうと思います。

まぁでも思い返せばそれっぽいムーブしてたね

確かにできないことやわからない(理解できない)ことは人生においてたくさんあったのですが、出来なければ困ることは両親にできるようになるまで徹底的に叩きこまれましたし、他の子と同じようになるまで努力もしました。でも人と話が合わなかったり言ってる意味が瞬時に推測できないことはあります。咄嗟の文章構築も苦手です。

例えば、幼少期の私は絵本と同じくらい家電の説明書を読み、NHKの教育番組よりもニュース番組やトークショーなどの大人同士が喋っているテレビ番組が好きだったのですが、いろんな文字や単語を認識して大人に説明することができる一方で、同じ年の子どもが話す言葉がよくわからなくて、受け答えが出来ないことがありました。そんなもんだから当然友達は少ないし、追い打ちをかけるように我が家にWindows98がやってきたのでさらに孤独ライフをエンジョイすることになります。

一方、絵を描けば一時期町中を走る乗り物のラッピングに採用され、ソフトウェア・書道作品・工作品を出せば賞を獲り、授業の一環で論評を書けば新聞に載り、とにかく創作をすればした分だけ相応の評価が貰えました。これは成人した今でも続いています。こと創作に関しては生まれてからずっとスーパースター状態だったわけですね。

スーパースター状態の終わり

そんなわけで場に応じた努力とセンスだけで20数年間なんとか生きてきたんですが、今年の3月で限界が来ました。

自分が培ってきたスキルがどんどん他人の評価にも関わるようになってきて、非常にしんどくなってきました。「れいじさんなら余裕でしょ」「今回もついていくぜ!」と言われる度に重荷に感じるようになりました。同時にハッカソンイベントや対外的な活動では相当目立つのに業務で中々自分の思うような結果が出せないことも非常に重荷に感じるようになりました(上長はその辺全然気にしてないし十分やってくれていると言ってくれましたが、自分が納得できませんでした)。

「自分がどうにかしなければ自分だけでなく組織の評価も巻き添えになるんだ」とも思うようになりました。それからはもうボロボロとミスをするようになって、さらに自己嫌悪が捗るようになりました。そういう時に限って「まだ仕事終わってないの?」「いつ終わるの?」と毎時間急かされたりするんですよね~~~しんどいね。

さらに「なんであんなやつがいい給料貰ってるんだ」「へらへらふらふらしているくせに」といった、妬み嫉みの言葉でさえ適当に流すことができなくなり、遂に夜も眠れなくなり、食欲も安定しなくなりました。

元々が低血圧体質なのですが、ちょうど飲み始めた薬の副作用でさらに血圧が下がって会社のお手洗いの個室で失神直前までいくこともありました。この時は何で頭を正常にする薬で頭バグってんだってヘラヘラしてました……この時期は本当に色んな人に迷惑をかけました。

結果な~~~~~~~~~んも手に着かないし創作意欲も沸かなくなりました!!!!!!!!!!スーパースター状態終わり!!!!!!!!!!!!!人生イヤイヤ期!!!!!!!!!!!!!!!!!!

それからどしたの

それから2ヵ月半休職をして、最近やっと職場復帰への目途がついたところです。

そんなわけで色々考える時間がとれた訳なんですが、結局全部自分の調子が悪かった時期に重なって起きた出来事な上に、それこそ神経可塑性による過剰思考のせいでしかないんですね。

しんどい場所から一旦離れて、夜も昼も好きなだけ寝て薬に体を慣らすことでかなり回復しました。ADHD双極性障害も服薬治療で概ね改善しましたし、日常生活でのストレス管理周りは認知行動療法で(もともとの考え方の癖も含めて)改善しました。

他人の評価に自信のセンスや努力が起因して重荷になるのだって、しんどい期は「人のスキルにフリーライドしてラクしてんじゃねえよ」ってガルガルやってましたが今はそう思わないし。つか思ってるほど人の評価背負ってないし。

この状況どう乗り切る問題だって別に自分が全部やらなきゃいけないことでもないし、そもそも自分一人の仕事で揺らぐような組織でもないし。

ヘラヘラふらふらしてたら良い給料貰っちゃいかんのか?嫉妬民うるせ~~~絶対このスタイル崩さないからな~~~

あ、でも副作用に関してはもう慣れるしかなかったです(流石に失神はしなくなった)。投薬開始して3ヵ月経ってやっと口渇感と眠気に慣れました。

ADHDの治療について

私が人生イヤイヤ期になってしまった全ての原因は神経可塑性なんですが、これを治療していくには大まかに投薬治療とTMS治療(磁気刺激治療)があって、私は前者を選択しました。プラスで認知行動療法を実施していますが、これは言葉で説明できる気がしないので割愛します。調べて…

投薬治療の場合はストラテラコンサータ・インチュニブの中から飲む薬を選べます(コンサータは出せない医院もあるらしい)。

私は最初ストラテラを飲んでいたのですが量が増える事に激しい頭痛に悩まされたためインチュニブに変更しました。こちらは眠気と血圧の急降下が怖い(特に食後低血圧とコンボ技がキマったときがヤバい)ですが、今は割と安定しています。慣れたともいう。

プラス仕事をしていた時は焦燥感と苛々が収まらなかったのでバルプロ酸も飲んでます。これはてんかん治療に使われる薬で、双極性障害による気分の上がり下がりの幅を抑える為に処方されています。

あ、なんか人格が変わるとかそういうのも言われていますが、確かにインチュニブを飲み始めた時にすごくイライラしたり、現実がクソ過ぎて死んでやろうと思ったことが一度だけあります。お手洗いで失神しだした時がそうですね。人間とは器用なもので、それだけ頭がバグってても素知らぬ顔で執務室に戻ってメンバーと話せるし、仕事にも取り組めるんですよ。やっぱり今年1月~3月頭は頭がおかしかった。

TMS治療は半永久的に効果のある自費治療の一種で分割で30回程度の施術が必要かつ50万円程度の費用がかかります。冷静に50万あったら普通に海外旅行してリフレッシュしたいのでやめました。あとこれで本当に治るのかが全く確証持てない。

私の通っている病院ではこのTMS治療を受けるために通院している人が多いのですが、カウンターで途中解約している人を何人も見ました。解約する理由もお金が払えないからではなくて、施術後に気分が悪くなったり効果が感じられないといった内容なのがちょっと…うん。

これから何か変わるのか

プライベートにおいてはこういう障害があるから何か配慮してほしいみたいなことは自分からは言いたくないなと思ってます。

「この人にはこういう接し方をしちゃいけないんだ」とか「放っておいた方がいい」とか善意で配慮されることもあったんですが、いろんな人から「この人は発達障害がある」と配慮をされること自体がもう負担でしかなかったです。

記事冒頭で説明した通り、別に薬を飲まなくても20数年間人生進められてたし。逆に今更態度変えられても自分が困るので普通に接してくれよな~!!頼むぜ!!

今はもう仕事に戻る決心もついていて(もう4月時点で休職生活も飽きが来ていた)、創作意欲も戻ってきました。今年はハッカソンあるのかな~~~スーパースター状態に戻りたいよ。

周辺の人たちにはご迷惑おかけしました。コロナ収束したらご飯でも行きましょう。

ではでは!!!