いなにわうどん

うどんの話に見せかけて技術的な話をしたい(できない)

はてなインターン 2022 に参加しました

 気が付けば夏も終わっちゃいましたね。さて今年の夏休みですが、去る 8/22−9/9 までの 3 週間に亘って、はてなリモートインターンシップ2022 に参加してきました。

応募と面接

 うごメモはてな*1はてなブログの前身であるはてダ等のサービスが存在していた時代から、10 年来のはてな民だったこともあり、今夏は馴染みの深いはてなインターンシップに申し込むことにしました。選考に関しては Web から応募*2 → 書類審査 → 面接(オンライン)という流れで行われます。エントリーフォームを送って数日経つと、書類通過の旨を記したメールが届いていたため早速面接に。

 面接ではエントリーシートGitHub に記載した内容を基に、組版やフォントの話、業務委託として現在働いている話、フロントエンド関連等の話題に関して一時間ほど話しました。「Next.js いいよね〜」とか fonttools に関する豆知識、「吉田を支える技術」みたいな内容で盛り上がった覚えがあります。

はてなTシャツをGET

インターン第一週:講義パート

 インターンは平日 3 週間に掛けて行われました。第 1 週は講義パートにあたります。特に最初の 3 日間に関しては Docker, k8s, DB, マイクロサービス等々の広範な技術スタックに関して講義がぎっちり詰め込まれていました*3。大学の講義等と比べてもかなり早いペースで進行したため、メモを取るだけでも正直必死でしたが、大変勉強になりました。

おもしろ講義ピックアップ

 最終日に行われたデザインの講義が非常に興味深かったです。講義中では UX の 5 段階モデルを用いて、はてなブックマークや Mackerel の機能追加・改善を行う例が紹介されていました。デザインの作業は表層のテクニックに留まらず、ユーザーの行動や用途に関して仮説検証を繰り返しながら、デザイナー・エンジニア・プランナー等の様々な人々が連携しあって作業を行う必要がある、といった理解を得ることが出来ました。

はてなの文化

 オンラインでの開催ということもあり、コミュニケーションが希薄になりがちな側面は否めませんでしたが、期間中は懇親会も4回ほど開かれ、nonpi foodbox のご飯 *4 を頂きながら meet や Slack、Scrapbox 等を通じて終始 :waiwai: と賑やかな雰囲気で進んでいきました。また、金曜日にはほたて*5と呼ばれる会があり、技術関連の取り組みが紹介されていて大変面白かったです*6

 余談ですが、はてなでは人々を ID で呼び合う文化があり、私のはてな ID は souda_kyoto_ikou という読み上げを全く想定しない命名*7だったのですが、長かったのかいつの間にか「いなにわさん」になりました。

実習

Go か TypeScript を用いてブログをマイクロサービスで実装する、といった実習課題が課せられました。私はフロントエンド大好き人間なので意気揚々と TypeScript を選択したのですが、あろうことか unified のインストールで詰まってしまい*8、同期がさかさかとコードを書いていく中で大幅な遅れを取る羽目に…… 最終的になんとか課題は終わらせることが出来ました。

インターン第2−3週: 開発パート

 実践パートです。コミック DAYS という講談社のマンガアプリ*9の開発をはてなが担当しており、こちらの機能改善に取り組みました。はてなインターンコードを書いて実際にリリースするまでを目標として掲げており、私達のチームでも機能を一つ開発してリリースまで持っていくことを目指しました。

 具体的には、以下の課題を解決する機能の開発に取り組みました。

  1. スマートフォンは画面が小さいため、漫画の余白部分を邪魔に感じる例がある
  2. ページの余白を画像処理で判定し、余白の分だけ自動で拡大して表示すれば良いのではないか
  3. ユーザーが逐次ページを拡大するのは面倒なので、ページを送っても連続して拡大されるように実装したい
  4. ただ、ページを遷移するごとに漫画の台詞やコマのサイズが変動すると作者の表現の意図を損なう可能性がある。あくまでも作者さんの表現を尊重するような機能にしたい

特に 4. の部分はかなり配慮が必要な箇所で、技術面も然ることながらその他の UI 等に関しても議論を重ねていく必要がありました。

 画像処理の部分に関してはチームのペアで競プロに強い hotmanww さんに行っていただき、私は UI の実装を中心に担当しました。アプリケーションは Swift + UIKit で実装されているのですが、開発を始めてみると、ページの View が入れ子になってイベントが伝播しなかったり、既知のバグを発見して、ズームとスワイプを同時に作動させる必要に駆られたり……と困難な課題に苛まれました。

 状態遷移の管理等も大変で、例えばどのクラスやプロトコルに責務を持たせたらいいか、といった設計の部分をメンターの gurrium さんに相談に乗って頂く機会が度々ありました。この辺りは個人開発だと意識することが少ない上、取り敢えず動けばオッケー的なノリで進めてしまうことも多いため、フィードバックを頂けるのは大変有り難かったです。

結 果 発 表

 残念ながら期日までに満足のいく品質までクオリティを引き上げるには至らず*10インターン期間中に機能をリリースすることは出来ませんでした。ただ、フィードバックを基に機能を改善していったことや、最後まで粘り強く実装を進めた姿勢も評価され、最終発表の場で優勝を頂くことが出来ました*11。折角実装した機能ですので、ぜひ公開されれば良いな……!と願っています。

むすびにかえて

 この体験記もはてなブログに書いているわけで、冒頭に記述した通りはてなのサービスは色々と使用してきたので、今回のインターンを介してコードや企業文化の一端に触れることができ、とても楽しい三週間になりました*12。また、先述のアプリは数十万〜数百万人のユーザーの方々に利用されているため、微力ながらそうした大規模なアプリに、自分の書いたコードが載ることに対するワクワク感もやはりあります。

 加えて、一人で黙々とコードを書いているとどうしても視野が狭まってしまうため、インターンに参加したり、業務委託として働いてみたり、開発中のソフトウェアをいろいろな人に見てもらう、といった行動を通じて人々と触れ合う度に、毎回少しずつ世界が広がったような感覚を憶えます*13

 最後になりましたが、開発を支えていただいたメンターさんやインターン運営の方々、マンガアプリ開発チームの皆様に感謝申し上げます。

*1:余談ですが昨夏にフリップノートマリオといううごメモに投稿されていた往年のマリオ二次創作を某動画共有サイトで発見してめっちゃ盛り上がった

*2:GraphQL を叩くと応募フォームが出現する

*3:乗っけから HTTP/3 と gRPC の濃い話が飛び出して目茶苦茶驚いた

*4:ギリギリ 19 歳だったためソフトドリンクを飲んでいました

*5:Hot なタスクを称える の略

*6:例の「HTTPS化でポート番号が 5 倍に!」のグラフが出てきていた

*7:高校時代の Twitter アカウントが由来

*8:unified には ESM (ES Module) が採用されており、環境によっては node 上で動かすのはかなり大変な模様。メンターさんが解決に向けて色々と調査をしてくれていたのですが、結局バージョンを落とすほかに解決策がないという結論に至りました

*9:昨年から業務委託で働いている企業もマンガ関連の会社だったので奇遇……

*10:App Store での審査の都合上、ある程度余裕を持って機能を完成させる必要がありました

*11:お給料とは別に副賞でサプライズ的に Amazon ギフトカードを頂きました〜! 折角なので技術関連で何か有用なものを購入したいと思います

*12:同期のみなさんは大変つよつよな人々が集っていて刺激になりました。

*13:別のチームの成果発表のスライドで「デザインは背骨」という金言が飛び出しており、な、なるほど……という気持ちになりました。デザインは背骨!!