5
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

GitHubのContributionを、学習の軌跡として可視化するサービスを作り始めた

5
Posted at

ログイン画面の構築をしよう。

スクリーンショット 2026-05-19 11.55.10.png

Codex開発で収益化するまで #6。
前回から、少し期間が空いてしまいました。
一つだけ決定した事として、「Contribution Arc」というサービス名に決定しました。
方向性のおさらいとして、これは学習を継続させるためのサービスであるということ。
そして、独自性を取り入れるため、GitHubに重きを置くという2点を念頭に開発を進めていきます。

下記リンクからご利用いただけます。
開発段階につき、随時アップデートして参ります。
https://tatsuyaariyama.github.io/Contribution-Arc/

ロゴについて

今回はログイン画面の構築と、ロゴの作成を行いました。
開発者のみなさんであれば、想像付くかと思いますが、このロゴが表しているのはGitHubのcontributionです。それを上へ上へと綺麗な曲線を描くようにイメージをしました。
下に行くほど、暗く深緑になっていて、上に行くほど明るく黄緑色になっています。
日常的にGitHubを利用していく中で着想しました。


現在の構成

現状はまだベース段階ですが、
スクリーンショット 2026-05-19 13.37.05.png

  • GitHub Contributionを活用したユーザーへの体験
  • 学習記録、学習時間の可視化
  • プレイヤーのレベル / EXP
  • 離脱率を下げるために継続を促すUI

この辺りを少しずつ形にしています。

特に今回は、Contributionを単なる「草」として扱うのではなく、
“積み上げの軌跡”として見せたいという気持ちが強くありました。

GitHubを触っていると、
毎日のcommitや草の濃淡だけでも、
不思議と「今日は進められたな」と感じる瞬間があります。

Contribution Arcでは、
その感覚をもっと自然に、
もっと気持ち良く可視化できるようにしたいと思っています。

開発していて感じたこと

今回、ロゴやログイン画面を作成していて改めて感じたのは、

「学習サービス」ではなく、
「開発者の継続そのもの」を支えるサービスに近づいている、
ということでした。

資格勉強をした日。

設計だけ考えていた日。

コードは書いていないけど、
技術記事を読んでいた日。

そういった、
GitHubには直接出てこない積み上げも含めて、
Contribution Arcでは記録できるようにしたいと考えています。

Googleアカウント、GitHub、メール/パスワードで下記のリンクからログインできますので、この記事を読んで興味を持ってくださった方はご利用ください。
随時アップデートして参ります。
https://tatsuyaariyama.github.io/Contribution-Arc/

5
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
5
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?