SmartHR オープンソース kirico のロゴの作り方

こんにちは！　デザイナーの渡邉です。

先日公開した SmartHR 発のオープンソースの gem 「kirico」のロゴの作り方をご紹介します！ロゴ製作をされる方のご参考の一つになれば幸いです。 ※kirico についてのブログはこちら

なぜ kirico （切子）?

SmartHR のライブラリ・社内ツールの名称は「日本の伝統工芸品」から名付けるルールがあります。第 1 弾オープンソースの kiji が、

行政手続きの電子化 ⇒ 国に関係深いもの ⇒ 日本の国鳥「キジ」

という連想から派生して、創業メンバー宮田・内藤の両名にゆかりの深い熊本県人吉地方の伝統工芸品「キジ馬（雉子車）」から名付けられました。その後も自然とそれに習って伝統工芸品の名前が付けられるようになりました。今回の切子は、数ある伝統工芸品の中から、語感とビジュアルの良さから選出されました。（SmartHR には遊び心に溢れているエンジニアメンバーが多数在籍しており、私はこれもまた魅力と感じています。）そのような背景から、これまでの gem のシリーズの一つとしてモチーフは「切子」で作成することになりました。

切子の調査

まずはモチーフとなる「切子」とは何か、を調べるところから始めました。そのモチーフの背景を知ることで、形・色味などの作成に必要な要素を知ることはもちろんですが、作成中に「どの要素を残し、削ぎ落とせる部分はどこか」などの判断の拠り所となる情報のため調査はとても大切な作業だと考えています。

調査内容

「切子」とは ?

「切子」はカットグラスの和名です。色付きでも透明なガラスでも切子であり、さらに言えば、輸入品でもマシンによってカットされたものも広く「切子」といえるようです。同じ表面彫刻でも、カットではなくサンドブラスト加工（表面に砂などの研磨材を吹き付ける加工法）などは切子には含まれないようです。

以上のことから「カット」されていることが切子の特長となることがわかりました。

<参考>伝統工芸江戸切子（江戸切り子）とは

江戸切子と薩摩切子

切子は「江戸切子」と「薩摩切子」の2 種類に分けられるようです。

江戸切子

庶民の手によってつくられたものが始まりとされる工芸品
透明なガラスの物や色被せガラスを薄く被せたものがある

薩摩切子

薩摩藩の事業として作られたもので、薩摩藩の衰退とともに歴史は途切れる
色被せガラスを厚く被せているのが特長

<参考>江戸切子と薩摩切子の違いは何？

表現方針を決定

今回のロゴ作成のポイントは大きく以下の 2 点です。

1.切子らしさ

切子の特長である「カット面」で表現

2.他の gem ロゴとのシリーズ感

カラー 共通色の赤をベースに
装飾
他のロゴと同様のシンプルな表現に落とし込むために、中でもシンプルな形状の文様「矢来切子文様」を選択
形状日本の伝統工芸感が損なわれないよう、いわゆるカットグラスであるソリッドなウイスキーグラスなどとは対照的な、湯飲みのような「丸み」と「厚み」のある形状が多く見られる薩摩切子を参考に

製作

ロゴタイプの作成

これまでのロゴから共通のアルファベット「k, i」を利用、「r, c, o」は Futura Condenced Extra Bold ベースフォントに新規に作成しました。

ロゴマークの製作手順

1.ラフ作成（フォルム検討） 今回の製作ではパターンはさほど作らずに済みました。シリーズロゴであることで表現方法が限られてくることもありますが、事前にメンバーと顔を合わせながら方向性の議論・認識合わせを行っていたことでビジュアルの方向性が定まり、時間削減に繋がりました。そのため、どのような構造にすべきかラフスケッチでのフォルムの検討から進めました。形の起こし方が見えてきた段階で Illustrator でパスに起こします。色を気にせずフォルム検討にフォーカスするために、初めは目的の赤とは異なるカラーで検討しました。

このタイミングでメンバーにイラストを共有したところ、「傘立てみたいだね」というご意見をいただいたため、どこが傘立てなのか検証してみました。

めっちゃ傘立てでした。

2.カラーを含めた検討 カラーの検討を始めた時点で、想像していた以上にグラスの透明感が出ていないことに気づきハマってしまいました。。。エンジニアや PM にも意見を求め、もっとグラスの透明感を出す方向でブラッシュアップを進めました。

3.要素をそぎ落としシンプルに 透明感を作れたところで、他ロゴとのバランスを見ながら要素をそぎ落としてシンプルにしていきます。最終的に表面の紋様の陰影部分をカットすることでちょうど良い着地点を見つけられました。

4.パスを整えて仕上げ 形が出来上がったところで、グリッドを元にパス位置の細かいズレや形を整え最終調整をしていきます。「神は細部に宿る」、ドイツの建築家ミース・ファンデル・ローエ氏が好んで使っていた言葉が心に刺さるとても地味で細かな作業です。実際に整えた後の引き締まった印象が整形前後で全く異なって見えるため、この作業が個人的には好きだったりします。