Notion Blogは銀の弾丸ではないがブログのBoilerplateとしては便利

My Notion Blog

屋号付きで個人事業主をやっているので、せっかくだしドヤ顔ポートフォリオサイトでも作りたい。まあドヤ顔は冗談にしても、デベロッパーたる者、ふらっと牛丼を食べるがごとく技術力のアピールは普段からやっていかなければならない。フラペチーノ屋さんでMacドヤをしても仕事は来ないが[要出典][独自研究?]、ポートフォリオはいつだって頼れるピッチ資料になる。

さりとてポートフォリオサイトというのはいつも、普段やらないWebフロントをやるには丁度いい題材でありつつ、あるはずだった「ポートフォリオの更新」がやってくることなくたいてい一日坊主になる。

開業よりも前に作った 3939.moe(ミクミク・ドット・モエ) は前述のような経緯でデプロイされ、やはり更新がされないまま。手塩にかけた愛ある手書きHTMLも、一度野に放ってしまうと感情が冷めてしまい、次のデプロイはなくなってしまう。

これを乗り越えるべく、新しいポートフォリオの構築は以下のような条件を掲げた。

  • 更新が楽
    • CMS-likeなレイヤーがどこかにいてほしい
  • サーバー管理が不要
  • ランニングコストがゼロ、あるいはごく少ない
  • Markdownよりはいろいろ表現できてほしい
  • でもしょっぱいWYSIWYGエディタはいらない
  • 要は静的サイトジェネレーターとリッチなエディタ両方の利点がほしい

黒船 My Notion Blog 襲来

1年ぐらい前に、どこからともなく「Notionってサービスがパないらしい」と伝わってきた。登録してすぐに「WYSIWYGでありながら神がかったUI/UX」に一瞬でやられてしまった。Evern○teやC○nfluenceといったしょっぱいWYSIWYGとは、一線どころか三線ぐらい画すエレガントさ。もしご存知なければぜひ触ってみてほしい。

www.notion.so

飛んで今年の1月、「Notionで書いたページをそのままブログとして静的コード生成し配信できるNext.jsのアプリ」と鮮烈に謳われた My Notion Blog がバズった。

この情報は92thunderパイセン経由でキャッチした。彼のブログもやはりMy Notion Blogをベースとしている。

blog.92thunder.dev

My Notion Blog は、先に挙げた条件をすべてクリアしている数少ない選択肢として浮上。そのまま採用することにした。

tl;dr

ポートフォリオサイトはひとまず完成した。

yotsuhack.dev

実際に使ってみた感想を短く言うならば、「ZEIT NowやNotionとの結合が済んでて便利なNext.jsのBoilerplateと思ったほうが良い」という感じ。

  • カスタマイズ必須
  • JSONにシリアライズされたNotionの記事データから自前でDOMを作っているので、Notionで書いたとおりには表示されない
  • 自前DOMを作る部分が結構複雑で読みにくい
  • 自前DOMなので結構基本的な部分でうまくいかないことが多い
    • 画像のアス比が歪む(!)
    • シャドウがずれる
    • プレビューに画像を入れるとページがロードできないレベルでぶっこわれる
    • カラム分割の対応が無(特に惜しい)
    • etc...
  • 最終的に自分で空気を読んで直すというのが数時間以上続いた
    • 逆に数時間程度頑張ればそれなりに仕上がるBoilerplateと思えば優秀
  • 画像などのアセットはS3から配信してるっぽくてどうも遅い

もちろん上記を差し引いても強力な利点は数多くある。

  • ZEIT NowとGitHubがポチポチで秒でつながり、すぐにカスタマイズに入れて、すぐにデプロイできる
  • フロントとNotionがポチポチで秒でつながり以下略
  • そもそも Now は Hobby use なら完全無料というのが寛大すぎる、ZEITすごい
  • Next.jsについて本気で調べなくても割と雰囲気でいじれた
  • Notion上では "Database" というカラムが決まった表で記事が管理され、これにカラムを足したりしてメタデータをカスタマイズできる

備忘

以下、開発備忘録を書き残す。稚拙な変更も多々あって恥ずかしいけどGitHubの該当箇所へのリンクをバンバン張っていく。参考になれば嬉しい。

登録・デプロイ

いい感じにググってノリでやる。

勘違いにより、最初のとこでちょっとつまずいてしまったのでメモ。上記の記事では手で記事管理テーブルを作成しているが、これは必要なく、自動で生成してくれる。この自動生成は「デプロイされたサイトを開いてヘッダーの "Blog" を押した時」に初めて走るため注意。

Routerの改変

セットアップが終わって適当な記事が出せたところで、次にRouterを改変した。

Next.jsのRouterは、ファイルシステムのディレクトリ構造がそのまま反映される。つまり、 /index.html を開くと src/pages/index.tsx が描画され、 /blog を開くと src/pages/blog/index.tsx が描画される。

My Notion Blogの素の状態ではHomeとBlogは別の概念になっている。今回はサイトのindexに来た時点で記事一覧を出してほしかったので、ヘッダーの "Blog" を押した時に表示されるView src/pages/blog/index.tsx にある記事一覧コンポーネントの実装をそのままIndexのView src/pages/index.tsx に移植した。今思えばコンポーネントの実装をそのまま移植するのではなく、 src/components/articles.tsx とかに切り出してから import すればよかった。まあ動くのでヨシ!

結局Contactのコンポーネントもindexに持ってきて、Headerコンポーネントは <head> だけ残しViewらしいものは消してしまった

フォント

日本語フォントの指定が一切ないので src/styles/global.css に変数として --font-ja-gothic を指定した。サイトの英字グリフはJetBrains Monoで統一したかったので、 --font-mono の先頭に追記した。そういうわけで以下のような指定にした

 19   --font-mono: 'JetBrains Mono', Menlo, Monaco, Lucida Console, Liberation Mono,
 20     DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace;
 21   --font-ja-gothic: 'Hiragino Sans W3', 'Hiragino Kaku Gothic ProN',
 22     'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, 'MS Pゴシック', 'MS PGothic';

見た目の調整

割とマークアップは質素で、よくよく見ると微妙な点がたくさんある。そこらへんはよしなに調整していく。私のブログのコードを参考にしてもらってもいいけど、前述のコンポーネント雑移植のせいでマークアップのあるべき位置がちぐはぐになっているのはご容赦を。

ところで、 .hoge .fuga みたいにあるクラスの子孫要素のクラスを指定するセレクタが全然動かなくて最初詰まった。ReactもしくはNext.jsはそういう正解感なの?誰かTwitterでリプってほしい。

SVG系アセットの追加

Facebookや屋号であるYOTSUHACKのロゴがないので追加した。Facebookは公式からEPSが手に入る

既にあるSVGアセットはTSX化してあるので、それの構造をノリで真似たらOK。styleの指定のようにそのままコピペでは動かないものも数多くあるので、上記を参考にしてもらったり、PyCharmとかJetBrainsのIDEにチェックしてもらいつつ移植するのがおすすめ。

画像表示の修正

画像やembedなどはwrapperとなるdivを周りにつける実装なのだが、Notion上では全く同じように見える画像でも中身がちょっと違っていてwrapperがついたりつかなかったりする。しかもwrapperなしのimgはアスペクト比が狂って最悪になる。これはちょっとまずいので、アスペクト比がメタデータに含まれるアセットは強制的にWrapperを付けることで解決した。

落とし穴: プレビューに画像を入れると死ぬ

f:id:puhitaku:20200419223547p:plain

記事一覧には「プレビュー」という概念があり、Notionのページの最初の2パラグラフ + Dividerまでがプレビューとして表示される。るんるんでこのDividerの手前に画像を入れたらスクリプトが死んで表示できなくなるので注意。多分記事一覧コンポーネントのコードを修正すれば直せると思う。

まとめ

Web素人の自分でも割とノリで行けたし、Boilerplate生成〜デプロイまでの流れと、記事執筆〜反映が超シームレスにつながっているのが何よりよかった。自作ブログや、ポートフォリオのような程よくCMS的なのが居てほしい用途には結構向いてると思う。というわけで興味があればぜひ。

リモートワークと生活環境と雑感とノウハウ少々

masawadaさんの記事に触発されたうなすけの記事に触発された記事です。

ちょうど昨日が勤めてた会社の最終日・リモートワーク生活開始後約2週というタイミングなので、近況を雑に書き出そうかと。

某ウイルスで緊急事態宣言が出たのは4/7、私がリモート生活に入ったのはそこからさらに1週間ほど前の4/1でした。自分がリモート中心になるというタイミングで、奇しくも日本全体がリモートを強いられることになるとは。ちょっと予想してませんでした。ちなみに私のメンタルの状況はいたって快調、平常運転です。家で悠々自適に暮らしています。

「リモートワーク力」

うなすけの記事にあるような「リモートワーク力」という尺度はやっぱりある気がしてます。それでいうとうちの家はもともとハードのハックとか趣味の開発を前からやってたんで設備は整ってます。この構成も降って湧いたようなものではなく、2年間あれこれやってきて今年の頭ぐらいにようやく「体にフィットしてる」と実感できるようになってきました。

f:id:puhitaku:20200413225350j:plain

仕事でPCを使う≒数時間以上PCと向き合うにあたっては、結構なレベルで環境の整備が必要です。これが職場なら自然といい感じに最適化されていきますが、家は必ずしもそうでないですよね。これが今いろんな人が直面している問題の本質ではないかと思います。私は職場と家どちらでもPCを長時間使う人間なので、幸いにも最適化が両方で進んでいました。

2年前に今の家に引っ越してきた時、勢いで Herman Miller Aeron Chair(いわゆるアーロンチェア)を買いました。そこから今まで「キーボードに手を乗っけたときの腕の高さはこれぐらいであってほしい」を中心に

  • 机に対する座面の高さ
  • アームレストの高さ
  • パームレストの位置
  • Macを冷却するファンと底面を持ち上げる高さ
  • 液晶の高さ

などなどの試行錯誤をしばらく繰り返し、今はめっちゃ体にフィットする構成にたどり着きました。時には完璧な寸法の足置きが欲しくて木工で自作したりもしました。

Aeron Chairはどちらかというと「半ば強制的に良い姿勢をとらせるタイプの椅子」だなと感じています。「ちゃんと座った姿勢」以外だとめっちゃ違和感が出ます。例えば座面の周囲は硬いプラスチックのフレームがあり、片足を上げたりあぐらっぽい姿勢になるのはほぼ無理です*1。さらに座面のメッシュが絶妙な摩擦係数で、革や普通の布より滑らないけどゴムほどじゃない、みたいなちょうどいい感じなんです。私は生まれつきお尻が前にずり出てしまうタイプで、前々職のフラーでは座面に滑り止めを敷きお尻が前に出るのを阻止していました。こんなことをせずとも、常にいい感じの姿勢を保つことができます。このパツパツかつ滑らない座面はももの側面にもフィットするカーブなので、最初はももが微妙に痛くなることもありました。

結局Aeronのセッティングを探って体が慣れるまでは数ヶ月かかりましたが、慣れるとめちゃくちゃ快適です。値段も保証期間も桁違いの製品なだけあり、それだけ長いスパンで使う椅子なんだなと今実感してます。

あと1つだけ作業環境に残ってる課題は、「4Kの外部モニタがIntelの内蔵GPUには重すぎる」という問題です。これは次のMacBook Proに期待しようかと思っています。

Off-topic: Herman Millerの椅子

Herman Millerの椅子はAeron Chairばかり有名ですが、もうちょっと安いSayl ChairやEmbody Chairもオススメです。

Saylは座面がスポンジになっていて万人がすぐ座れる感じの易しめの椅子です。前職ではずっとSaylでした。背面の意匠は随分違いますがAeronと方向性が近いです。どっしりと重みがあって使い勝手のよい良い椅子でした。

EmbodyはAeronとは違う方向性で背中をサポートする椅子で、形状がくびれているため腕の動かせる範囲が広いのが特徴です。Aeronはそもそも前傾寄り(事務作業など)を狙った椅子で、Embodyは後傾寄りの人やPCワーカーの人を狙った製品になります。私も買う時にAeronとEmbodyで悩みましたが、最高級かつフル装備のワークチェアというのを知っておきたくてAeronを選びました。

製品による用途の違いは、銀座の大塚家具やショールームのアンバサダーが教えてくれるので、店舗で聞いてみることをおすすめします。(状況がアレなんで行きにくいと思いますけども)

ビデオ通話

前から薄々気付いてましたが、ZoomやHangoutsを使うとCPUがアッチッチになってダメになることが判明しました。外部からファンで冷やしても、です。そこで、眠っていたPixel 3にZoomなどをインストールし、PCのリソース消費ゼロでビデオ通話ができるようにしたところめっちゃいい感じになりました。これ超おすすめです。

音にこだわる人たちはマイクやオーディオIF等いろいろやってるみたいです。良いマイクの音が良いことは私も承知してます。が、それは素材が良いという話で、いい感じのゲイン・いい感じのコンプ・いい感じのetc.で調理してあげなければいけません。そこらへんが超面倒なのも目に見えているので、残念ながら食指が動きませんでした。

スマホのノイズキャンセル・エコーキャンセル・オートゲインは一般にあまり知られてませんがとても高品質です。よほどスピーカーを大音量にして音を歪ませでもしなければ、スマホの音がエコーバックされることもありません。というわけで、あえてスマホ単品ですべてを完結させています。スマホに全部オフロード、オススメです。

辛い人とそうじゃない人

ネットを見ているとリモートを苦痛に感じている人とそうでない人がいるようです。冒頭の二人の記事とか昨今のTwitterから見えてきた、個人差が大きいポイントがいくつかあります。

  • 自宅の設備がリモートに向いている/いない
  • 人とのコミュニケーションをSlack等とハイブリッドにするのに成功している/していない
    • リアルなコミュニケーションを文字に持っていく上で社員間の空気感のすり合わせができている/いない
  • 「したかった外出ができなくなった」というダメージを受け流せている/いない
  • 屋内でストレス発散できる手段がある/ない

※単に違いを挙げただけで、他社のやり方・人のストレス耐性・生活習慣その他についてあれこれ言いたいわけではないです。

ちなみにTwitterで雑アンケしてみたら、意外にも「全く苦痛ではない」という人が過半数でした。辛い人とそうじゃない人でもっと票が割れると思ってました。

自分はここらへんまったく辛さを感じてないです。元々リモート生活に入る予定だったのも作用してるんだろうと思います。もちろん悲しいことはいくつもありました。登壇予定のイベントが延期になり、元々予定してた友達とのキャンプが吹き飛び…。しかしながら、その当事者(イベンターや友達)と感情を分かち合いつつ、空いてしまった時間に別なやりたかったことを入れるというのを繰り返したところ、うまいこと軽減できた気がします。

ところでストレスの軽減でいうと、どうぶつの森はきっといろんな人に効くと思います。私もたぬきちをはじめ村人たちに癒やされまくってます。おすすめ。

インターネット

自分の感情でどうにもならないのがインターネットですね。いやはや、皆さんめっちゃ怒ってます。物申してます。こういう時に自分も物申したり皮肉を言ったりすると、インターネットの濁流の一部になってしまいます。昔から「インターネットやめたい」と事あるごとに言ってますが、今回も例にもれずインターネットやめたくなってます。

見るだけ辛いしマイナスですから、私はめちゃくちゃ対策してます。Twitterならキーワードミュート・アカウントミュート・アンフォロー、Facebookなら友達登録はそのままでアンフォロー。精神的安寧を第一に保っていきましょう。

末田はどんなときでも安定のパソコンオタクです。今後ともどうぞよろしくお願いいたします。

料理・食

そもそもリモート中心になるということで自宅の調理環境は結構追加整備しました。

もともと「自ら炊くと書いて自炊、つまり米を炊いた時点で自炊!」を持論にするほど自炊は嫌いです。牛丼チェーン大好き。まあとはいえ半分フリーランスになりますし、金銭については軌道に乗るまで切り詰めておいて損はないということで、極度に手を抜いた自炊をやることにしました。

こういう時に時短レシピ的なのをクックパッドを見ていると「簡単!○○で作る□□!」みたいなのを見かけるんですが、もう鍋とフライパンを使わせてる時点でそっ閉じですよね。確かに「簡単」ではあるかもしれない。けど「シンプル」ではないよねと。

自炊の最大の障壁、それは洗い物です。そこにさらに、調理に費やす時間や野菜のカットといった難点が続きます。それらが極度に減らなければ、自炊なんてやる気にならないのです。最近はホットクックが流行りだしいいなーと指をくわえて見てたある日、気付いちゃいました。

そして続けて、神のような道具を見つけました。

これらを合わせて、今は炊飯器ミートソースを2日に1回錬成しています。炊飯器が勝手に煮てくれますから、調理に拘束される時間は実に10分ちょっとです。

cookpad.com

このレシピだと後半で鍋に移して煮込むステップがあるのですがそこはもちろん改変。元々入れる水の量を少なめにすれば鍋など必要ありません。死ぬほど簡単かつシンプルなこのレシピ、保温されているのでレンチンの煩わしさがない上に、丸2日経っても普通に食べられるので超効率いいです。こういう美味くて簡単でシンプルで都合のいいレシピがもっと他にないかリサーチするのが今後の課題です。

食材の調達については、仕方なく朝のランニングのコースに肉のハナマサを入れることで時間を節約してます。すごく面倒だしウイルスのリスクもあるので、Amazon Freshで解決したいところ。最低購入金額さえクリアできれば…。

自炊について長々書きましたが、ミートソースはあくまでおかずに過ぎません。では主食はというと、最近はBASE FOODとオートミールを食べています。BASE FOODは普通の食材みたいな食感で栄養を網羅できるので最高です。COMP・Huel・BASE FOODといった完全食系は全部試してきた中で、やはり「既存の主食と同じ形・食感をしている」というのは一般的な食事との親和性が高くて強いと感じます。

この前BASE BREAD(パン)がリニューアルするということで試供品を食べたところ、輪をかけて普通のパンになっててびっくりしました。まだ食べたことがない皆さんには是非試していただきたいです。完全食界隈はお試しセットが超安いという共通点があるので、ぜひ買ってみてください。

オートミールについては、ネットでやたら不味いって言われているので意を決して食べましたが全然余裕でした。むしろお粥にせずに食べたら香ばしくて美味しいなーぐらい。普段は、オートミール50gにお湯200cc弱とカレールウ1/2かけら(田の字に割ったルウを更にもう半分にする)を入れてレンチンし、カレー味のお粥状態になったところにミートソースを入れて食べてます。めっちゃうまいです。

集中を再現する

リモートワークでやはり問題になるのは「集中」です。もともと「やるべきこと」に集中するのが絶望的に苦手なのでこれの解決は急務でした。

結論から言うと、「部屋を真っ暗にしてインテンシティの低い音楽を低音量で流す」が今のところ再現率が高いことがわかりました。視野に入るものがPCのモニタだけになること、加えて思考を促すわずかな音楽要素があること、が効いているのではないかと思っています。

せっかくなので、今育てているSpotifyのプレイリストを上げておきます。

open.spotify.com

まとめ

リモートが辛くない件については、生存バイアスや転職といったコンテキストは否定できないにしても、

  • ベースラインのストレスの対処だけきちんとやっておく
  • 自分がなぜストレスを感じているか、客観的に考える
  • 不快なもの(ネットの情報や面倒な調理)を徹底してシャットアウト・軽減する
  • 自分の好きな事柄についてこだわったり思索を深めたり手を動かしたりする

これらで全然やって行けているというのが感想です。

ストレスを過度に深めてしまう行為として「反すう」(過去の過ちやトラウマを繰り返し考えてしまい、どんどん落ち込んでいく現象)があります。私もよくやってしまいますが、客観的に自分を見ることで今までなんとかしてきました。

リモートが辛い人全員が反すうをやっているわけではないとは思いつつも、風景の変わらない家の中では思考の流れを変えるのが難しいという人も多いはずです。各々が抱える辛さを客観的に認識し、それとは別な流れを作ることで、楽しく過ごす道筋が見いだせるようになればいいなと思います。

*1:無理にやると足がずっと圧迫されて痛くなる

退職しました

f:id:puhitaku:20200331185235p:plain

2年と2ヶ月勤めたGROOVE X株式会社を退職しました(正確には4月13日まで社員で、4月1日からは有給消化)。

理由

会社の業務とは別にやりたいことが次第に大きくなってきて、それが現在の会社の方向性とは違ってきたというのが理由です。もちろん社内での会話とか考察をしばらくやって、数ヶ月考えた上で決断しました。

やりたいことというのはやはり低レイヤーです。入社するときに思っていた「消費者に直接届くハードを作りたい」は目的ではなく手段というのを自覚し、前職のときから好きだった低レイヤーを改めて目的として捉えなおしたというか、そんな感じです。

LOVOTも2018年に比べればありえないくらい安定してますし、そもそもローンチしたし、ということで「後ろ髪を引かれつつ」とかはなく次のステップに突き進めそうな感じです。おおむね前職を出た時と同じような前向きな気持ちで出ていくのでまあ良いんじゃないでしょうか。ここらへんはでなり id:denari01 の金言「逃げで転職をするな」が今回も活きてます。おかげでしっかり考察できました。

やったこと

入る前から宣言していた「低レイヤーをやりたい」をおおむね突き通せました。2018年に入社して最初のタスクだった

  • Xilinx UltraScale+ ZynqMPの評価基板でLinuxをブートさせる(Yoctoをビルドするだけに見えるがロジック合成も入れると意外と大変)

にはじまり、

  • 評価基板に載るOSを自力でDebianに載せ替える
  • チームでDebianを育てて必要なdaemonやらを載せる
  • カーネルを改造する・新しくドライバを書く
  • FPGAで物理層を生やしてはオシロとにらめっこ

をひたすら繰り返してました。

2018年の夏にZynqMPの載ったカスタムボード(LOVOTの頭の中に入ってるやつの初期版)が上がってきて、生産にGOをかけるため大急ぎで土日でロジックを合成しLinuxをポーティング、ブートしたシリアルを拝めた時の高揚感は忘れられないですね。

そこから2019年の夏ぐらいまではひたすらアナログとデジタルを行き来したり低レイヤーのバグ潰し係として動きつつ、やはりチームで必要な実装をやっていきました。

2019年の夏から冬までは周辺機器のLinuxポーティングとdaemon書きをひたすらやり、2019年末から現在まではもっぱら細かいバグ修正、問題切り分け、ドキュメント書き、引き継ぎをずっとやってました。

低レイヤー以外で特筆すべきは、C拡張を含むPython 2→3移行の話(2018)や、APTとの共存に特化したvenvラッパーを書いた話(2019)のように、Pythonについても随時知見を蓄積し外部発表できたのが良かったです。社長含め全社的に外部発表に寛容なのが助かりました。先日の日経RoboticsのGROOVE X特集にも名を連ね、しかもvenvラッパーの gxenv の名前も載ったのは超嬉しかったです。もともと厳格にクローズドな環境で開発してたプロダクトなんで、ここまでポートフォリオ的なものが築けるとは思ってなかったのでほんとよかったです。

あと関係ないけど社内バリスタ(笑)を2年間ずっとやってて、ここ1年は特に師の存在もありだいぶペーパードリップの腕も上がりました。

これからやること

これからは、平日の3〜4日程度働き、残りは低レイヤーの興味のあるトピックをちゃんと掘ってちゃんと成果として出す日々になります。

元々は、自分の時間を確保したいという動機から完全フリーになるつもりでした。ところが以前より手伝っていたヘマタイト株式会社でこの話をしていたら、うみさま id:umisama がご厚意で声をかけてくれて、幸いにも時短社員かつリードエンジニアとして雇ってもらえることになりました。やはり正規雇用というのはありがたいもので、国保とか入らなくて済むのが超ありがたいです。

低レイヤー方向のアウトプットとしては、既に電子辞書のSharp Brainのハックが形になりつつあります。これからBrainを通常利用可能なLinux UMPCとして仕上げていこうと思ってるので、他のトピックとともにご期待ください。

心に残ったバグ、心に残った開発

ここからはオマケです。とあるエスパー級のエンジニアが語っていた「心に残ったバグ」というのが面白かったので、自分も真似して挙げておきます。情報量が多いので、詳細を知りたい方は直接聞いてくださいw

バグ: 5分〜1時間の幅でランダムにKernel Panicする

対応: SPIの物理層のバッファが小さすぎて異常な頻度の割り込みが起きてたのが問題→バッファを増やして解決

SoC周囲のマイコンと超高速な通信をしているが故の不具合でした。ちなみにXilinx社も未知の問題だったらしく、Forumで報告したら中の人に感謝されました。公式Q&AであるAnswer Recordに登録するとかなんとか。

バグ: USBメモリの読み書きは正常だがマイクやUSB DACをつなぐと音がぶっこわれる

対応: ZynqMPのXHCIホストコントローラをUSB 2.0のみの動作にした時、USB 3.0専用の高速PHYに入れるクロックが生きているとアイソクロナス転送のポーリングレートが正しく生成できなくなるのが問題だった→Device Tree から該当のクロックを消して解決

「えっどういうこと?」と言われそうなわけわからんバグでした。USBメモリのようなバルク転送は通信のペース作りとかないので普通に行けちゃうのですが、音声系デバイスのようなアイソクロナス転送だと厳格なインターバルでポーリングしています。その差が表出していた形になります。

開発: 目のLCDに流す絵をFPGAで力技で生成しGPUの絵と切替えるロジックを組んだ

この実装により、電源投入から目のLCDの描画開始まで10秒〜20秒ほどかかっていたのを、0.5秒ほどに短縮することに成功しました。以下で説明するように、紛れもなく「FPGAでしかできないこと」としてやりがいのある開発でした。

入社した時はまだブートシークエンスへの配慮がまったくなく、電源ボタンを押して十数秒待つと突然目が表示される状態でした。目が真っ暗な状態を0.1秒でも短くするために、FPGAのロジックが読み込まれた瞬間からLCDにLOVOTのロゴを出し、準備が整ったらGPUの絵に切り替える実装をしました。映像信号生成というFPGAの定番ネタに加え、垂直同期に連動したステートマシン付きマルチプレクサを組むという結構な重さ。最終的にLinuxへの結合もできましたし、めちゃくちゃ学びになったと思います。

もちろんロゴ画像を無圧縮でロジックに入れるとデカすぎて入りません。減色して8色3bitのパレットカラーかつRLE圧縮したものをロジックに入れ、描画時にリアルタイムで展開するロジックを書き解決しました。画像のパレットカラー化・圧縮・Verilogコード生成はPythonで全部書きました。

他にも色々ありますが、終わらないのでここまでw