このエントリーをはてなブックマークに追加

Memo

配色パターン作成サイト「カラログ」をリリースしました

2013/10/28
Memo

cololog

タイトルの通り、新しいwebサービスというか、webツール?的なものを公開しました。
サイトの配色パターンをブラウザ上で作れるサイト「カラログ」です。
キャプチャ等まじえながら、かんたんにご紹介したいと思います。

どんなことができる?

cololog_1

webサイトの配色を考えるとき、レイアウトは決まっているけど、配色がイマイチきまらない…。
このレイアウトだと、どんな配色にしたらいいのかな…。

そういう、PhotoshopやFireworks立ち上げるのちょっと面倒だけど、ぐるぐる考えたい、という時のお手伝いをするツールです。

使い方

使い方はとてもシンプルです。

cololog_2

セレクトボックスからレイアウトを選び、上下にあるパレットの入力フォームにカラーコードをいれるだけ。
入力フォームにフォーカスを当てると、カラーピッカーが表示されるので、カラーコードが分からなくても色を選ぶことができます。
真ん中のデモ部分が、入力フォームの場所に応じて色が変わるようになっています。
色を変えてからレイアウトを変更してももちろん大丈夫。

cololog_3

サイト上で色を考えるだけ、でもいいですが、カラーリングに名前をつけて、ギャラリー登録もぜひおねがいします!
登録すると、Galleryページに追加されるので、後からコードをチェックすることが出来ます。

レイアウトは現在5つ。順次追加していく予定です。
スマホサイトのレイアウトとかも追加したいなーと思ってます。

制作のきっかけ

仕事で大量にデザインをする時期が実は定期的にありまして。
制約が多い割に、1つのレイアウトにつきカラバリを常に2〜3個考えなきゃいけないんです。
ですが、私、色選びがどうも時間かかるんですよね。
サイトのレイアウトってだいたい定番化するし、サイトカラーリングのアイディアをストックしておけるものがあったら便利かも…!という思いつきから作りました。

公開したのは、金曜の夜中だったんですが「便利そう!」と感想をいただけていて、とても嬉しいです(*´ω`*)
Ps立ち上げなくてもブラウザ上で配色考えられるので、自分もがんがん使っていく予定です。

名前のはなし

「カラログ」という名前、「カラー(color)」+「ログ(log)」という意味合いで付けてます。
本当はこのサービス考えてた当初は「Colog」という名前になる予定でしたが、ぐぐってみたら、パスワード制の育児ブログサービス「ころぐ(http://colog.jp/)」というのがすでにありまして、とりやめました。

いや、この話とくにしなくてもいいんですが、この「ころぐ」が子ども育ててる身としては面白そうだったので、紹介したくてw

なにはともあれ、できました

かなり思いつきで作り始めましたが、なかなか楽しいものができたんじゃないかな、と個人的に思ってます。
ギャラリー登録すると出来上がるカラーチップ部分は、PHP+iMagickで作ってます。
今までPerlでしかimage::magick使えなかったんですが、PHPでも使う方法を覚えられたので、勉強にもなりました。
ちょっとこの辺りはまた記事にでもしようかなーと思います。

あなたの色選びが、すこしラクになりますように。

配色パターン作成サイト:カラログ
http://color.ark-under.net

よろしくおねがいします!@・ェ・@

Category : MemoTags : , ,

関連記事

コメントを残す




About

中の人:Mei Koutsuki (@mei331)
神奈川でweb作ったり、お洋服つくったりしてる黒いひつじさん。ロリィタ系webクリエイター。12年9月に一児の母となり、自宅で子育てしながらお仕事してます。
>> もっと詳しく