Works

インターン

XEBEC

(2022/1~now)

• 業務内容: XEBECというバリ取りブラシ世界シェアNo1の会社で、Webデザインも含むデザイン関連全般のインターンとして働いています。

GMOペパボ(実務インターン)

(2024/8)

• 業務内容: ECサイト構築サービス「カラーミーショップ」の開発に従事。「カラーミーショップ」のショップオーナーの管理画面におけるショップクーポンの検索機能の追加を担当。

DMM.com(実務インターン)

(2024/9/1~9/14)

• 業務内容: DMM GUILDに参加。3Dキャラクターとのバーチャルライブ配信webサービスの開発などに従事。

KADOKAWA(実務インターン)

(2024/9/15~9/30)

• 業務内容: 「おでかけ情報」＆「エンターテインメント」サイト「Walker+」の開発に従事。

展示会出展

小学生向け科学教室早稲田大学ユニラブ出展 (人間タワーバトル)

(2023/4-2024/7)

• レポジトリー: 人間タワーバトル
• 制作物: 動物タワーバトルを落ちてくる動物の代わりにカメラで撮った人が切り抜かれ落ちてくる科学教室の展示。
• 目的: 小中学生が科学、機械学習を身近に感じられる楽しいものであること教える。
• 課題: 小学生に向けての展示なので、簡単に誰でも分かるように理論を説明しないといけない。
• 解決策とプロセス: スライドを使った全体への講義なども行い、使われている技術も小学生にもわかりやすいような手法を選択。人の写っている画像とそれをマスクした画像を大量に集め、なおかつfew shot学習の手法を取り入れ反転させたり切り抜いたりして学習データを増やした。
• 結果: 参加していただいた小学生の事後アンケートの満足度90%以上となり、科学に興味持ってもらう機会を作ることができた。

展示会出展

理工展連絡会(早稲田理工の文化祭実行委員)のマスコットキャラクターVtuber「矢口つむぎ」の作成・運営

• 内容: 理工展には以前からマスコットキャラが存在していましたが、作成されたのが20年ほど前のものであり、使用することが難しい状況が多く存在していました。また、ニーズの変化が存在していることも考慮し、新たなマスコットキャラが必要と判断しました。そこでトレンドであるVtuberを作成するという考えに至りました。また、コロナ禍前の理工展は現地に根付き、近所の子供達やその親御さん、早稲田理工への志望者高校生などが主要な来場者でありました。そこで若者向けのVtuberで新たな顧客の集客を狙いました。
• 結果: 参加していただいた小学生の事後アンケートの満足度90%以上となり、科学に興味持ってもらう機会を作ることができた。　このプロジェクトから、他者との協力におけるビジョンの共有化が極めて重要であることを学びました。プロジェクトの最初から最後まで、メンバー全員が同じ目標を共有し、それに向かって一丸となって取り組みました。初めに運営委員全体にプロジェクトの計画とVtuberのデザインを共有し、名前の公募などを通じて広く認知を広めました。そして、必要なメンバー30人ほどを募集し、それぞれの役割を明確に始動しました。その後、実際の運営では、イベントの告知や配信、コラボレーションなど様々な活動を通じてVtuberをプロモーションしました。実際に、配信での視聴者数は200人を超えることに成功し、新聞に複数回取材をしていただいたり、グッズを企画制作販売したことによる大きな利益を生み出し、さらに地域の飲食店や他大学とのコラボを実現しました。結果、コロナ禍前以上の来場者数となり学園祭を成功に導くことができました。

Projects

Twitter Clone

(2024/1~2024/3)

• レポジトリー: Twitter-Clone
• デモサイト: デモサイトURL
• 目的: 学習目的で Twitter の主要機能を実装し、Next.js、NextAuth.js、Firebaseなどのテクノロジーを使用して、自身の技術スキルを向上させることを目指す。
• 課題: Twitterの主要機能を含むクローンを開発するために、ユーザー認証、投稿の作成と管理、コメントやいいねの機能など、複雑な機能を統合する必要性。
• 解決策とプロセス: NextAuth.jsを導入し、Firebaseを使用してGoogleアカウントでの認証を実装。Firebaseをデータベースとして使用し、投稿、コメント、およびいいねのデータを保存し、リアルタイムのデータ更新を可能に。Tailwind CSSを使用してレスポンシブなデザインを実装し、様々なデバイスや画面サイズに対応。
• 結果: Twitterの主要機能を含むクローンを成功裏に実装し、ユーザーは投稿の作成、削除、コメント、いいねなどのアクションを実行できるようになった。サインインページでは、Googleアカウントを使用して認証できるようになり、セキュリティと利便性が向上。

Reactを使用したGraphQLを使用した歌詞アプリ

(2023/12~2024/1)

• レポジトリー: Lyrics-app-with-GraphQL-and-React
• 目的: GraphQLというクエリ言語およびAPIのためのランタイム環境について学ぶ。RESTとの違いを理解し、柔軟で効率的なクエリ言語の利用を目指す。
• 課題: RESTful APIはエンドポイントごとにデータを提供するため、使用しない過剰なデータも取得することで過剰な通信が発生。GraphQLを使用するのが初めてであった。
• 解決策とプロセス: GraphQLの基本的な使用方法を学ぶため、最初にGraphiQLで実際にjson-serverでqueryとmutationを実行しながら、データがやり取りされる仕組みを確認。
• 結果: GraphQLを実際に使用し、スキーマが中心的な役割を果たし、データの型や関連性を適切に設計。余分なデータの取得を避け、リソースの無駄をなくすことができることを確認。

マイクロサービスを採用したTicketing Service Webアプリ

(2023/10~2023/12)

• レポジトリー: Ticketing-Service-Microservices-with-Node-JS-and-React Public
• 目的: 大規模サービスを安定して提供する上で欠かせないマイクロサービスの概念を学び、非同期通信やサービスのカプセル化を体験することが目的。
• 課題: マイクロサービスに特有の課題である、サービスの分割方法やサービス間の通信手法などに取り組んでいます。
• 解決策とプロセス: AWS や GCP などの公式ドキュメントを参考にし、マイクロサービスの概念や設計方法を学習しました。これらのサービスで実際に使用されているサービス間通信の手法も参考にしました。
• 結果: マイクロサービスを実際に構築し、故意に一部のサービスを停止させても他のサービスが正常に動作することを確認。データの整合性を確保しつつ、サービス間で通信するための基本的な手法や考え方を習得しました。

Webサーバーフレームワークの構築

(2023/8~2023/9)

• レポジトリー: GCDWebServer-Swift
• 目的: Webサーバーが実際にどのように動いているか理解し、軽量なGCDWebServerを構築して動作するかを確認。
• 課題: 実際に実装していく上でSwiftを使用することが初めてであった。
• 解決策とプロセス: Swiftの公式サイトのチュートリアルを読みながら学習。
• 結果: GCDWebServerが正常に起動し、指定したポートでリクエストを待機していることを確認。ルーティングの動作と応答の確認。

Reactの構築

(2023/5~2023/8)

• レポジトリー: mini-react
• 目的: Reactがどのように動いているか理解し、実際にReactを構築して動作するかを確認。Jestを使用したテストの方法も学習。
• 課題: Jestを使用したテストが不慣れであり、JavaScriptの知識不足があった。
• 解決策とプロセス: JSの専門書「You Don’t Know JS」を読み知識不足を解消。Jestは公式サイトのチュートリアルを読みながら学習。
• 結果: useStateやレンダリングの仕組みについて理解し、実際に実装。Jestを使用したテストの書き方についても学習。

ハッカソン

TaskHub

(2024/3/15-2024/3/24)

• レポジトリー: TaskHub
• 目的: ハッカソンに参加し、新しい技術に触りたいと思いreact-nativeでiosアプリを開発。
• 課題: expo-goでの開発環境構築が初めてであり、環境構築が課題であった。classNameなどのCSSセレクターの使用不可。異なる解像度でのレイアウトへの適応。
• 解決策とプロセス: expo-goの公式ドキュメントを参考に環境構築を行なった。CSSセレクターの代わりにStyleSheet Componentでのスタイリングを行なった。pxではなくdp、dip、ptを使用し異なる解像度でのレイアウトへの適応した。
• 結果: ハッカソンで開発したiosアプリを公開できた。また、react-nativeの使い方を学んだ。