この記事を書いた人
machida

フィヨルドブログにも書いたし、昨日(4月1日)はそれのtweetばっかりしてたので、お前しつこ過ぎるぞ、と言われそうですが、KUROIGAMEN関連だし、これを読んで頂いてる皆さんへのお礼も言いたいので、ここでも報告。

技術からも評論からも縁遠い僕(machida)が、あの技術評論社様のサイト「gihyo.jp」に記事を書かせていただきました。gihyo.jpにエンジニアではないデザイナーである自分の書いた記事が載るなんて胸熱。これもKUROIGAMENを応援してくださってる皆さんのおかげです。ありがとうございます。

gihyo.jp

アイコンでガラリと変わるWebデザイン――gihyo.jpのアイコンもリニューアル?!

以前、「JPNewTech」というイベントでLTをやらせていただいたのですが、そのときに司会をされてたのがgihyoの中の人、さんでした。

それをきっかけにお知り合いになっていただいたのですが、馮さんから今回の依頼のお話をいただいたときは、全くgihyo.jpに記事を書く依頼をいただけるなんて想像もしてなかったのと、記事の公開日も次回の「JPNewTech」の開催予定日と同じ4月1日だったということと(「JPNewTech」は開催日が変わり、4月28日になりました)、さらに馮さんが「JPNewTech」のスタッフでもあるというのがあったので、うっかり「JPNewTech」でのLTの依頼かと勝手に勘違いをしたまま数日を過ごしてしまいました。途中で馮さんから「違いますよ、gihyo.jpですよ」と言われたときにびっくり。

エイプリルフールだから嘘もOK、デザインテロをテーマに3000文字程度ということで、本当にいろいろふざけさせていただきました。たくさんの方からリツイートや感想もいただき、やってよかったという気持ちでいっぱいです。特に、t-wadaさんの「いろいろとひどい(褒め言葉) 」というはてブのコメントは嬉しかったです。

さて、ちょっとあの記事に一点補足したいことがありまして、この場でちょっとそれを。

スト2

このバナーで使ってる画像、これストⅡの春麗のステージ(中国)の背景の人をトレースしてるんですよね。

20110402054518

ドット絵をトレースしてもあんまり意味はなかったのですが、これが一番大変だったので(このネタのためにiPhoneアプリをインストールしたし)、苦労したんだから元ネタに気づいて欲しいということで、この場を借りての補足でした。

そうそう、gihyo.jpって句読点の読点に「、」じゃなくて「,」を使ってるっていうトリビアを発見。

この記事を書いた人
machida

(タイトルはここをパクリました。terajimaさん、ご紹介ありがとうございます!)

ちょっとここのところ花粉にやられて不調な日々を過ごしてて、久しぶりの町田の投稿になってしまいました。

Lokkaに新テーマが追加!

Lokkaの最新バージョンに新テーマが追加されてます。その名も「curvy」。名の通りの曲線の多いデザインです。シンプルでオススメです。

20110402041007

GitHubにPull Requestを送ると…

GitHubにあるリポジトリをFolkして、それに手を加え、オリジナルの作者にPull Requestを送る、というのがデザインテロの手順ですが、実際GitHub上ではどの様に表示されるのかを紹介したいと思います。

Lokkaのコミット履歴をチラリと覗き見。

20110402041008

コミット履歴のページに行くと、そのプロジェクトの今までの積み重ねられたコミットの履歴の一覧を見ることができます。2011年3月20日のところ、ここにKohey Sudoさんからのデザインテロのcommitが表示されてます。

added new theme 'curvy' をクリックすると、そのcommitされたファイルの内容を見ることができます。

20110402041009

Showing 10 changed files with 642 additions and 0 deletions.と書いてあります。10個のファイルの642行が追加されて、0行の削除がありました、ってことですね。今回はLokkaのテーマを作っていただいたので、10個の新規ファイルが作成されて、そこに書かれたソースの合計が642行だった、ということです。新たに作ったファイルなので、削除は無しで0行。

このページを下へスクロールすると、今回のcommitのソースの内容を見ることができます。つまり、GitHubでデザインテロをしたら、そのソースはみんなが見れる状態になっちゃうんですよね。怖い?デザインテロにはソース公開上等、っていう勢いが必要です。みんなが見れるところに晒すっていう意識を持つだけで、細かいところにも気を使うようになる良い訓練になりますので、そういう意味でもGitHubを使うのはおすすめ。

こんな感じで一回Pull Requestをして、commitが受け入れられたら、そのプロジェクトにはログがずっと残り続けることになります。これはいい記念にもなりますね。

さらにこんな機能まで!

20110402041010

上のキャプチャは先程のcommitのソースが内容が見れるページを下にスクロールした、ところなんですが、そのソースの左にマウスを乗せると吹出しマークが出現!なんと、マウスを置いた部分の行に対してコメントが残せる機能があるんですね。「ここすごいね!」とか書くんでしょうか?プログラマーは実際どの様に使っているかの例を紹介してみたかったのですが、ちょっと見つかりませんでした。この機能、UIも含めて個人的にすごく好きです。

今回デザインテロをしてくれたSudoさん

先日、「webデザイナーが集まって新宿でお酒を飲む会」という飲み会を企画させていただいたのですが、そこに参加してくれたKohey Sudoさんが今回デザインテロをしてくれました。ありがとうございます!いやー、初めて自分意外のデザインのPull Requestを見ました。楽しかったです。本当、ありがたい。Sudoさんも僕もランディ・ローズが好きっていう意外な共通点もある、素敵な方です。

先日行った「webデザイナーが集まって新宿でお酒を飲む会」の報告を。

あまり人数が多いとゆっくり話せないので、定員は6名。ファミレスサイズの飲み会。あんまり告知もしなかったのですが、5人の素敵な方が来てくださいました(定員6人に届かなかったなんて町田のカリスマ性のなさ!)。

実は僕、Webデザイナーの知り合いが全然いなくって、たまにATND検索なんかを使ってWebデザイナーの知り合いが出来るようなイベントを探したりしてるんですが、なかなかちょうどよさげなのがなかったんですよね。で、今回自分で企画した、ということの次第です。

お越しいただいたのは(※お店に到着順で紹介)、

株式会社シロクロというデザイン会社をやってる伊藤さん。シロクロさんはR4というWebサービスレビューサイト、4dbという地域別ウェブギャラリーサイトを運営しています。どちらもデザイン会社だけあってオシャレ!

僕のやってるフィヨルドと同じ合同会社って業態で、なおかつRails + Gitを使って仕事をやってるってところまでフィヨルドとかぶってる、外国人三人のエンジニア集団合同会社モバリーンPaulさん。今回のイベントにはモバリーンが提供しているDoorkeeperというイベント運営支援ツールを使わせていただきました。

今回デザインテロをしてくれたSudoさん。Sudoさんは泣く子も黙るあのcookpadの中の人です。一緒にフィヨルドをやっているkomagataさんのブログを読んでいただいていたり、paulさんとの共通の知り合いもたくさんいたり、業界の狭さを感じました。

株式会社ダイバーシティというデザイン会社でデザイナーをやっている@na_taさん。nataさんはデジハリで賞を受賞していている若き実力派デザイナーです。VJもやっています。

…と、お世辞じゃなく素敵な方々にお越しいただいて恐縮やら感激やらの楽しい時間を過ごさせていただきました。ありがとうございました。今度は勉強会でも開催してまたお会いしましょう!あと、男率100%になってしまって申し訳なかったです。

この記事を書いた人
machida

先日、ヌーラボのhsmtさんとAbbyのyone098さんが主催されたイベント、「JPNewTech」に参加させていただきました。

yone098さんyone098さん

「人と人が集まると,カオス(混沌)とした状態が生まれます。そこから,たとえば会社だったりサービスだったり,ユーザやコミュニティ,ときには結婚や友達といったプライベートの関係まで,さまざまなつながりが生まれてきます。JPNewTechは,こうした人と人とのつながりから生み出される「何か」を創出し,発展させることを目的に企画しました」

…というイベントで、エンジニア、デザイナーが集まっていました(結構エンジニア多め)。色んな方と名刺交換が出来、前からお会いしたかった方とも会えたし、お酒も飲めたので楽しい時間を過ごすことができました。僕はデザイナーの知り合いが極端に少ないので今後もJPNewTechに参加させていただいて、デザイナーの知り合いを作りたいところです。

JPNewTechのサイトはこちら

LT「エンジニアとデザイナーのコラボレーションの新しいカタチ」

このKUROIGAMENの宣伝のLTを「JPNewTech」をやらせていただきました。すぐにLTが行えるようにイベントスタート前からMacセットアップをしておいて、いつでもMacを開けばすぐLTがスタート出来るって状態でMacを放置しておいたのですが、その間にMacが固まってしまって、本番keynoteが動かなくなって焦りました。Macを再起動して解決。持ち時間は5分、本番は4分半くらいに収まったと思います。

主催されたhsmtさん、yone098さん、LTの司会をやっていただいたgihyoのtomihisaさん、お会いした方々、ありがとうございました!

この記事を書いた人
machida

先日、まさにこのKUROIGMAMENでやっていこうと思っている、githubにデザインを入れたバージョンを作り、それをpull requestするという形式でデザインを募集しているコンテスト「rubycommitters.org design contest」を見つけたので、「デザイナーもforkしたり、pull requestを送ったり」なんてことを言ってるサイトをやっている以上、僕も参加せねば!と、意気揚々とデザインを送りつけたのですが…

結果は不採用、自分でもどん引きするぐらい全然ダメでした。トホホ…。

こんな感じこんな感じ

せっかく応援してくださった方もいらしたのに申し訳ないです。終わってしまったコンテストですが、一応どんなものだったかをここで紹介しておきたいと思います。

rubycommitters.org design contest!

募集はrubyのコミッターでもあって、Nokogiriという有名なrubyのGem(rubyで何かを作るときに使うプラグイン)の作者でもあるtenderloveさんのブログで行われました。

20110124113708
rubycommitters.org design contest!

デザインを入れるサイトはこれ、

rubycommitters.org

Homebrew導入の記事や「Lokka」のときに登場しました「Ruby」というプログラム言語のコミッター(開発者)の紹介サイト、紹介サイトというより名簿ですね。それにしても、今までRubyにそういったものが無かったなんて、あれだけイベントは頑張ってるのに、誰もその必要性を感じ無かったのか?…なんて、ちょっと思ってしまいました。

募集要項はこんな感じでした。

参考方法は?

githubのrubycommitters.orgをforkして、サイトの見た目を良くする。完成したらpull requestを送る。

いくつ応募できる?

いくつでも。ただし、採用されるのは一つだけ(今回、First PlaceとSecond Placeの二つのデザインを募集している)。

締切りは?

1月19日23:59:59 PST(太平洋標準時

受賞者の発表は?

1月21日23:59:59 PST発表予定。メールで受賞者のPaypal情報を聞いてお金を送ります。

賞品は?

現金(USドル)
First Place…200ドル
Second Place…100ドル。

審査は誰が行う?

私(Aaron Patterson)。誰かの意見を聞くと思うけど最終的な決定権は私が持っている。

なんで賞金が安いの?

自腹を切っているんだから仕方ないだろ。勘弁してくれ。

引用元:Tender Lovemaking
(注意:上記に間違えがあるかもしれないので詳しくはこちらを見てください。)

githubに上がってるリポジトリのREADMEを見て、後は勝手にやってpull requestを送ってくれ、って方法は新しいですよね。デザイナーには参加するのに敷居の高い方法ですが、計23エントリーありました(まぁ、中には何にもやってないじゃん、っていうのも混ざってますが)。参加した記念にここに画像を貼っておきます。結果はスクロールした後に書きますので、どれが優勝したかを予想しながら見ると楽しいかもです。

エントリーされたデザイン

20110123175902

20110123175903

20110123175904

20110123175905

20110123175906

20110123175907

20110123175908

20110123175909

20110123175910

20110123175911

20110123175912

20110123175913

20110123175914

20110123175915

20110123175916

20110123175917

20110123175918

20110123175919

20110123175920

20110123175921

20110123181410

20110123181411

20110123181412

結果

結局、募集要項では、First Place…200ドル、Second Place…100ドルと書いてあったのですが、受賞者も賞金も増えてました。

First place … 500ドル

20110123175914

Second place … 400ドル

20110123175908

Third place … 300ドル

20110123175920

Tied for third place … 300ドル

20110123175905

結果発表もtenderloveさんのブログで行われました。

RubyCommitters.org winners

ちなみに、僕が作ったやつ

20110123175912

一応、僕が作ったやつはhttp://rc-machida.heroku.com/で見れます。

うーん、2人から4人に受賞枠が広がったのに、受賞できなかったなんて、この残念な結果に自分でもびっくりしてしまいました。デザインコンテストって難しい。

受賞者の皆様おめでとうございます。あと、tenderloveさん、楽しい機会をありがとうございました。

この記事を書いた人
machida

どうでもいいちょっとしたお知らせ。

SeeTheStatsSeeTheStats

SeeTheStatsという、Google Analyticsの結果を公開するサービスを使って、KUROIGAMENのアクセス解析を公開しました。

KUROIGAMENのアクセス解析結果

順調にクセス数が減ってますが、まだまだKUROIGAMENは続きます。今のところ、エンジニアと一緒に仕事をする上でこういう記事が読めたら助かったのにと、ちょっと前の自分が思うようなことを書いていってますが、「黒い画面は怖くないよ」、ってこのサイトで言っていきたかったのに、なんだかgitのコマンドが出てきた辺りからこのサイト自体が怖くなってきたような感も…(ちょっと前の自分がKUROIGAMENを見たら怖がったかもなぁ)。

ちょうど前回でgithubにリポジトリを作るところまで行きましたが、実際、デザイナーがgithubにリポジトリを作らせるなんて発想自体、デザイナーの周りのエンジニアにはなかったことかもしれません(それをやらせてしまうのがkomagataさんのすごいところ、だってそれを出来るようにしたらそのあとは一気に効率上がりますから)。でも、結局のところ黒い画面って文字打つだけから、結構出来ちゃうんですよね。

func09さんのブログに、「Webサービスのルイーダ酒場を作りたい」というエントリーがありました。

以前から考えていたことなんですが、デザイナーとエンジニアが個人レベルでWebサービスを作るためのチームを組むための場所が作りたい。

僕もこういうのがあったらいいなと思います。せっかく作る部分担当のエンジニアとデザイナーが出会うのだから、開発に関する環境構築だとか情報共有だとかの基本的なことには時間を取らず、「cacooにモックを作ったので共有しておきました」とか、「ここにリポジトリがあるからデザイン入れてコミットしておいてください」とか、「ローカルでの立ち上げ方はREADMEに書いてあります」とか、「ちょっと変更したい部分をgithubのissueに書いておきました」…って感じで話が通じるようになって、作ることに直結した作業に専念出来るようになるってことが、デザイナーがエンジニアと個人レベルでサービスを作るためのチームを組むことにとって、大きなポイントになるのでは、と思います。そういう点から見て、デザイナーがgithubを使えるようになるってことのメリットは相当大きいはず。

エンジニアの方は「これはちょっとデザイナーには敷居が高いなぁ」と諦めたりせず、デザイナーの方は「こんなのデザイナーにはわからないよ」と怯えたりせず、もう少しだけお互いに歩み寄って情報共有をするようになったら面白くなるのではないか、と思います。ってことも考えながら、まだまだKUROIGAMENは続きますよ。

terakumaさんがwindowsでKUROIGAMEN(黒い画面)を使いこなす Part.01という記事を書いてくれました。ありがとうございます。MacにVirtualBoxでwindowsを入れたので、近いうちにwindowsで黒い画面に挑戦します。windowsでgitとrubyが使えるところまで記事を連載してくれると嬉しいなぁ ボソッ。

この記事を書いた人
machida

皆さん、はじめまして。それと、明けましておめでとうございます。webデザイナーの町田(@machida)と申します。

突然ですが、KUROIGAMENという活動を始めることにしました。その活動の一つとしてこの「KUROIGAMEN(黒い画面)」というサイトをオープンしました。

さてさて、まずはKUROIGAMENの目的を。

オープンソースのアプリにデザイナーがデザインを入れる。

です。

と、一言で言ってみましたが、それをする為には、

  • 自分のローカルでそのアプリを動かす環境を作る
  • そのアプリの構造を知ってどこをどういじればデザインを変えられるのかを知る
  • デザインを入れたバージョンを手元で作ってそれを作者にcommitする
  • 自分自身のものとしてそれを公開する場合には、サーバにそのアプリが動く環境を作り、そこにデプロイする

…などの方法を知らなきゃならないんですよね。まずは何から手を付けていいかもわからないってデザイナーがほとんどだと思います。はい、僕もそうです。

で、上記の諸々をするのに例のアレ※1、そう「黒い画面」が必要なんです。黒い画面って間違ったらサーバや自分のコンピューターを壊してしまいそうで怖いし、英語ばっかりで面倒そう。そんなものに立ち向かわなくちゃならないなんて、腰は重くなっていく一方だと思います。黒い画面ってデザイナーにとってはまさに鬼門。

例のアレ※1例のアレ

黒い画面を避けてきたデザイナー達がたくさんいると思いますが、そんなデザイナーの為の黒い画面の解説の記事をプログラマーに書いていただいたり(現在、プログラマーさんのメンバーはkomagataさんだけなのでkomagataさん、よろしくお願いします!)、実際にデザイナーが黒い画面を使ってオープンソースにデザインを入れたときのレポートを載せたりなどして、このサイトがデザイナーが黒い画面に立ち向かう第一歩の手助けになったら面白いのではないか、とか思ってます。

いつかは、「ある日突然自分のオープンソースにデザインが降ってきた!」みたいな、デザイナーもオープンソースの世界にデザインで参戦することが頻繁に起こったらなぁ、とか思ってます。「またKUROIGAMENの仕業か…」みたいになったら面白いなぁ、とか。「KUROIGAMENに対抗した新たな勢力登場!?」とか。そのイメージをビジュアルにするとこんな感じ※2

こんなイメージで※220101231201545

ではでは、今後ともひとつKUROIGAMENをよろしくお願いします。

最新の実績

  • Remember The Wordpress
  • happy1000days
  • happy1000days
  • happy1000days

こちらも合わせてどうぞ

  • webデザイナーの為の「本当は怖くない」“黒い画面”入門

アフィリエイト