❤️

ZennのアイコンをSimple Iconsに登録して、OSSってやっぱり良いなと思った話

2020/12/17に公開
2

皆さん、Simple Icons 使っていますか?
多くのアイコンと対応するカラーコードが利用出来るサービスで、Font Awesomeにはないアイコンが存在していたり、shields.io で使えたりなど、非常に便利。

今回は、アイコン (ロゴ) データの使用許可やリクエストの送信、実際にPull Requestを送ってマージされるまでに得た知見や改めてOSSってやっぱり良いなと思ったことを書いていく。

shields.io でZennのアイコンが使いたい

最近、shields.io でバッジを作成して統一感ある形で並べられるのが良いなと思い、お気に入りのサービスの一つである Zenn のアイコンを使おうと思ったら存在しないことが判明した。 shields.io では、Simple Icons のアイコンを使うことが出来るので Simple Icons に Zenn の アイコンをリクエストしてみる (後に作成・Pull Requestすることになった)

Simple Iconsのリポジトリ にIssueを立てる

Simple Icons へのアイコン追加リクエストはIssueで受け付けている模様。
早速テンプレートに従ってIssueを立ててみる。

気を付ける点として、Alexaランク が判断の基準になるので一緒に確認する。

立てたIssueは以下。
https://github.com/simple-icons/simple-icons/issues/4369

すると返信で、

必要な情報は全て コントリビューションガイドライン に書かれているので、Pull Requestしてみませんか?

(意訳) と言われた。せっかくの機会なのでやってみることにする。

Pull Requestのための準備

アイコン (ロゴ) データの使用許可を得る

Zenn では、扱いやすい メディアキット が公開されていて、とてもありがたい。
念のため、Zenn の開発者である catnose さんに使用許可をいただいた。

(catnose さん、ありがとうございます!)

GitHub上でForkして、git clone する

このあたりは、ほかのOSSプロジェクトでも同じだと思われる。
あと、ブランチも切る。

アイコンの追加または更新ガイドライン に従ってアイコンデータを作成する

Zenn では、AI形式でアイコン (ロゴ) データが提供されていて非常に作りやすかった。

気を付ける点として、SVGOでSVGデータを最適化する時に推奨されている精度 3 ではCIが通らない事があるので、値を大きくすると良い (縦または横が 24px である必要があるのだが、Zenn のアイコンで精度 3 にすると、横が 23.988px のような限りなく 24px に近い数字になりCIが通らないため、しばらく頭を抱えていた)

SVGに指定の注釈をつけたり、アイコンのメタデータを追加する

ガイドラインが親切なおかげか、特に困ったことはなかった。
分からなければ、このあたり を見ると良いかも。

Pull Requestを作成する

ありがたいことに、テンプレートが充実しているので迷うことはなかった。
プレビューの画像は ここ で作成可能。

作成したPull Requestは以下。
https://github.com/simple-icons/simple-icons/pull/4372

Pushすると自動でCIが走るので便利。なにげに初CIだったりする (めっちゃ感動した)

要件を満たすとマージされた。

めっちゃ褒められた

正直今まで、OSSに貢献したいけど、少し怖いな…という見えない壁が今まであった。
しかし、ここまでフレンドリーに「挑戦してみない? (失敗してもいいよ)」「パーフェクト、ありがとう!」「良い働きだね!」と言われると、とても嬉しいし今後も貢献したいと思えるようになった。

充実したガイドラインやテンプレート、ツール、プロジェクトのメンバーからのフレンドリーな反応などにより、幅広いユーザから貢献してもらえるのだと実感した。

あとがき


アイコンのプレビュー

今回OSSの貢献で体験した経験は最高に良かったし、言語の壁を越えてとても嬉しい幸せな気持ちになった。

今後も積極的に貢献していこうと思う💪

Discussion

montqnqmontqnq

学生の間にOSSに貢献していてとても凄いです!
(モチベーションに繋がります!)