JACO-BASS » Blog

ひとに寄り添うデザインの追求

ロゴを作る上で大事にしてること

どーもご無沙汰してます、中村です。さて早速ですが…最近立て続けにロゴをデザインすることになったのですが、ロゴって他のツールとは少し違いますね。何と言いますか、リニューアルでもない限り新しく始まるサービスや企業のツールであり、経営者含め、社員の方や開発者の方にとって、それは始めて出会う自分たちのためのデザインなわけです。何でもそうだと思うのですが、初めてのものというのは、印象に残りやすく、思い入れも深くなりがちです。

作るのはデザイナーですが、サービスや製品を展開していく仮定で、どう使うか、どのように成長させていくかはクライアント次第です。作ったら終わり、ではなくきちんと育てていって欲しいと思っています。ブランディングなんて言葉がありますが、目に見える物を作っただけで、価値や概念まで固定化できるわけではありません。

だからこそデザインする時には、それを使ってユーザーにどうアプローチしていくのか、というようなことよりもまずは、クライアントが「もっと使いたい」「色々な人に見せたい」と思えるようなデザインになるよう心がけています。というかまずはそこをクリアしないと話にならないのです。

勿論これは、パンフレットにしろwebサイトにしろ、ロゴに限った話ではないのですが、ロゴはそういう側面がより強いツールだなと感じます。冒頭で書いたように、最初のツールだけに、経営者や開発者の想いが投影される度合いも大きくなるからでしょう。自分たちがやろうとしていることや、創ったものに対しての誇りや想いや自信、それが形になったものがロゴなのだと思います。

そうして、見る度に経営者が初心を思い出したり、社員が奮起するような、クライアントを奮起させるようなロゴは優れたロゴだと思います。って見る度にというのは少し大袈裟な話ですね。でもクライアントにとって愛情を注げるくらいには大事な存在になって、その存在がクライアントと共に長く生きていけるよう祈りを込めながらデザインしています。

だからこんな形で喜びの声を聞くと凄く嬉しいです。(勿論直接お礼も言われましたけど)

天才とバカとの間 [起業]ロゴができた

大事に育ててあげてね。

この記事のタグ

関連記事

Emacs でつくる JavaScript と ActionScript の環境

第7回のウェブテコで発表したネタです。スライドを用意しなかったので、今回はブログの記事として書きます。

Emacs の JavaScript のメジャーモード。

emacs-js2-mode

Emacs では、特定のファイルを編集する場合、それに特化したメジャーモードを使うことで、編集をより便利に行なうことができます。
JavaScript を編集するためのメジャーモードは、以下のものが代表的です。

最近、人気なのは js2-mode の方で、こちらは Java で書かれた JavaScript パーサのRhinoが移植されており、リアルタイムの構文チェックが行なわれるところが他のモードとの大きな違いです。

ただし、非力なマシンであれば、動作が重いかもしれないので、そう感じる人は、javascript-mode を利用しているようです。

js2-mode のインストール

Emacs に Elisp をインストールするための基本的な設定などは、Emacs ビギナーに贈る、これからバリバリ使い隊!!人のための設定講座 その1。を参考にして下さい。

まず、Google Code の js2-mode のサイトからjs2-20080616a.elをダウンロードして、js2.el とリネームしてあなたの Emacs のロードパスであるフォルダに置きます。

続いて、Emacs を起動して、js2.el をバイトコンパイルします。js2-mode はバイトコンパイルしないと動作しないので、この作業は必須となります。

M-x byte-compile-file というコマンドを実行します。M-x というのは、Meta キーを押しながら x のことですが、通常メタキーは Alt になっていますので、Alt + x を押します。すると、Emacs 下部のミニバッファーでコマンドをタイプできますので、byte-compile-file とタイプしてエンターを押して下さい。

ファイルを尋ねられますので、js2.el を指定してエンタを押しましょう。ちなみに、ミニバッファー上では、TAB キーで補完が可能ですので、全てを直にタイプする必要はありません。

バイトコンパイルが実行されると、様々なファイルが生成されますので、終了するまで待ちます。

終了して入力が可能になれば、M-x js2-mode というコマンドを実行すると、js2-mode が起動しますが、いちいちコマンドを実行するのは面倒なので、あなたの Emacs の設定ファイル (おそらく .emacs でしょう)を開き、以下の設定を追加して下さい。

LISP:
  1. ;; js2-mode
  2. (autoload 'js2-mode "js2" nil t)
  3. (add-to-list 'auto-mode-alist '("\.js$" . js2-mode))

これを行末で C-x C-e で評価するか、もしくは Emacs を再起動すると .js の拡張子のファイルを開いたとき、自動的に js2-mode で編集できるようになります。

JavaScript Lint を利用して構文チェックをより厳しくする

flymake-mode を利用したときのスクリーンショット

Rhino による構文チェックも便利ですが、より厳しくチェックしたい人は、JavaScript Lint を導入しましょう。

JavaScript Lint - あどけない話に詳しい使い方がまとめられているので、js2-mode を使う場合の設定だけ書いておきます。

LISP:
  1. (when (and (require 'flymake nil t))
  2.   (setq flymake-jsl-mode-map 'js2-mode-map)
  3.   (add-hook 'js2-mode-hook
  4.             (lambda ()
  5.               (require 'flymake-jsl)
  6.               (setq flymake-check-was-interrupted t)
  7.               ;; (flymake-mode t) ; 起動時に flymake-mode をオンにしたい場合はコメントアウトする
  8.               )))

上記の記事の flymake-jsl.el を利用していますので、必ずロードパスにインストールしておきましょう。

js2-mode の時と同様に、再起動した後、JavaScript ファイルを開いて、M-x flymake-mode するとシンタックスチェックがかかります。

LISP:
  1. (when (and (require 'flymake nil t))
  2.   (set-face-background 'flymake-errline "orange red")
  3.   (set-face-foreground 'flymake-errline "black")
  4.   (set-face-background 'flymake-warnline "yellow")
  5.   (set-face-foreground 'flymake-warnline "black"))

色が見にくい場合は、僕の設定を利用するか、参考にして変更して下さい。

Emacs の ActionScript のメジャーモード

as3-mode の表示

続いて、ActionScript のモードですが、主なものに以下の2つがあります。

導入のしやすさは、actionscript-mode の方が簡単で、Elisp をロードパスに配置して読み込むだけで利用できます。

as3-mode は、flyparse-mode を利用したパーサーを使用する仕組みとなっており、構文チェックが可能な分、actionscript-mode よりも高性能なのですが、導入がすこし面倒です。

actionscript-mode はactionscript-mode.elをダウンロードして、ロードパスに置いて、

LISP:
  1. (when (require 'actionscript-mode nil t)
  2.   (setq auto-mode-alist
  3.         (cons '("\.as\'" . actionscript-mode) auto-mode-alist))

とすれば良いでしょう。

as3-mode のインストール

as3-mode のインストールについては調べてみたところ、日本語の記事がなかったので、しっかりと紹介しておきます。

まず、flyparse-modeをダウンロードします。

flyparse-mode は、Java で書かれたパーサを利用して、ActionScript と JavaScript と CSS をパースすることができます。ただし、利用するためには lib フォルダにある flyparse-parsers.jar と antlr-runtime-3.1.jar の場所を CLASSPATH に追加してあげる必要があります。

Emacs で CLASSPATH を設定するには setenv 関数を使います。.emacs に CLASSPATH を追加しましょう。

LISP:
  1. (setenv "CLASSPATH" (concat
  2.         "/Users/tomoya/projects/flyparse-mode/lib/flyparse-parsers.jar:/Users/tomoya/projects/flyparse-mode/lib/antlr-runtime-3.1.jar"))

僕の場合は、このようになります。

続いて、flyparse-mode.el をロードパスに追加します。

今度は as3-mode をダウンロードして、as3-mode.el と fdb.el をロードパスに追加します。

そして .emacs に

LISP:
  1. (when (require 'as3-mode nil t)
  2.   (setq auto-mode-alist
  3.         (cons '("\.as\'" . as3-mode) auto-mode-alist))
  4.  
  5.   (add-hook 'as3-mode-hook
  6.             '(lambda ()
  7.                (define-key as3-mode-map (kbd "C-c t f") 'flyparse-toggle-debug-overlays)
  8.                (require 'flymake-as3)
  9.                (setq flymake-check-was-interrupted t))
  10.             ))

という設定を書きます。再起動すると、.as の拡張子のファイルを開くと自動的に as3-mode が起動します。

M-x flyparse-toggle-debug-overlays を実行するか、C-c t f (コントロールを押しながら c を押し、コントロールを離して t f を続けて)を押すと、視覚的な構文チェックが実行されます。オフにしたいときは、同じコマンドを実行します。

flyparse-mode の flyparse-toggle-debug-overlays 実行時のスクリーンショット

まとめ

この他にも、auto-complete.elなどを使うことで、開発効率が促進されること間違いないでしょう。

長くなりましたが、Emacs で JavaScript や ActionScript を書く人の参考になれば嬉しいです。

この記事のタグ

関連記事

デザインと年齢

「デザイナーは年を取ると駄目になる」

学生時代にメディアや講師や先輩や友人に刷り込まれるように教えられたことで、実際に社会人になってみると全然そんなことない、なんてことが結構あったりしますが、上のような台詞もその内の1つかも知れません。

冒頭の台詞は端的な表現ですが、少し補足すると、30歳も後半、中年と呼ばれる域に入ろうかという年齢になると、デザイナーはセンスが枯れて良い仕事ができなくなる。ということです。

もしかしたらこれを読まれている方の中にも、同じようなことを言った、あるいは言われた方がいらっしゃるかも知れませんが、皆さんはどう思うでしょうか?

中村はそうは思いません。全く思いません。その理由は2つ。1つには、デザインはセンスだけでできるものではないこと。そして2つ目は実際に年配の方の中にも良い仕事してる方が沢山いらっしゃるということ。(中村がお世話になった会社にも沢山いらっしゃいました。)

そうです、若い人から「おっさん」とか「おばさん」とか言われてたって、中村なんかが逆立ちしたって適わないようなデザイナーはいるんです。それは別に例外ではありません。

(言葉自体が曖昧で非常に定義し辛い言葉であるのですが、)勿論センスも大事です。でも歳を重ねることでしか得ることの出来ない物も確実にあるのです。ただ若いからという理由だけで若い人を重宝するようではその業界や会社は長続きしないでしょう。

それと同時に「ベテランだから沢山の貴重な経験を重ねてセンスもある」とか「若いから未熟者で使えない」なんてことはない、とも思います。

つまり何が言いたいかというと、年齢なんてものはデザイナーの力量を計る物差しにはならない、ということです。それが指し示す物が全くないとは言いませんが、「“真面目に努力をしながら”重ねた年数」や「“向上心を持った”若さ」というように条件付きで価値が出てくるのだと思います。

老いも若きもそれだけで駄目だとか良いだとか、硬直した考え方で人と相対するように仕事をしていると、どこか歪んでしまいます。

あまりいないとは思うのですが、もし「歳を取るとセンスが枯れる」なんてことを考えている人がいたら、そう思うのは勝手ですが、決して口にしないで欲しいと思います。特に、デザイナーを志す人に対しては言わないで欲しいな、と思います。

この記事のタグ

関連記事

第5回ウェブテコ「詳説 HTML」のスライド

3月8日に行なわれた、第5回ウェブテコで発表した、「詳説 HTML」というプレゼンのスライドPDFを公開します。

発表タイトル
詳説 HTML
ライセンス
Creative Commons License Creative Commons 表示-継承 2.1 日本 License

HTML について発表するという事で、その大海原にのみ込まれそうになりつつ、なんとか纏めました。

できるだけ、広く浅くで知らない人にも理解しやすくしたつもりですが、どうもマニアックな内容だったらしいです。個人的には、ぜんぜんそんな事ないんですけどね。

内容の目次

  • HTML - HyperText Markup Language
  • HTML の誕生と理念
  • 今現在使われている HTML の種類
  • 今後使われる事が増える HTML の種類
  • 草案とか勧告とかって何?
  • 正しい HTML の書き方
    • HTML はシンプル
    • XHTML はちょっとややこしい。
    • HTML 5 その1
    • HTML 5 その2
  • 文書型宣言(DOCTYPE宣言)
  • なぜ、文書型宣言が必要なのか?
  • DTD って何?
  • ブロック要素とインライン要素
  • MIME Type

眠たくなりそうな硬い内容でしたが、最後まで聞いて頂いてありがとうございました。

質問して下さった方々もどうもありがとうございました。

この記事のタグ

関連記事

デザインと大義名分

どうもご無沙汰してます、中村です。いつの間にやら年が明けてしまいましたね。別にめでたくもないので年始の挨拶を口にするのがひどく億劫です。去年、このブログでは挨拶してるんですが、かなり無理してたんだなぁとしみじみ…

時候の挨拶のような、普段さして気にもしていないことを口にしたり行動に移したりするのって凄くエネルギーを必要とします。自分で言っておきながら白けることも多々あります。

それは何も挨拶や世辞に限ったことではありません。例えば仕事で、自分が使ったことがない物や良いと思ってない物を商品として扱う時、そんな時は罪悪感や恥ずかしさすら覚えます。

例えば「エコ」なんてどうでしょう。それを謳うだけで、さもその仕事が誠実なものであるかのような印象を与えるアレです。猫も杓子も「エコ」で既に使い古された感すらあります。

デザインの世界でも同じく「エコ」という言葉はもはや必須といって良い程浸透しています。実際に環境を大切にすることはとても素晴らしいことだと思いますし、それを念頭にデザインすることはきっと良いことなんだと思います。

でも環境問題と真剣に取り組んでいるデザイナーなんて果たしてどれだけいるのかな?と疑問にも思います。

中村の周りにいるエコ大好きデザイナー達を例に挙げてみましょう。彼らの中にはエコな商品を作って賞を貰うほどの実力の持ち主もいて、普段から環境を大切にしようなどと力強く訴えていたりします。

ところが実際の生活は、ほんのすぐそこにあるコンビニに行くのにも車を使ったり、使い終わったパソコンをシャットダウンせずに放置したり、プリントアウトするのにも惜しむことなく紙を使います。

上記の行動だけを見て駄目だなんて全く思いません。そうではなく、エコが大切だと言いながら、その実それとは全く逆の生活を送っていることが駄目だと思うのです。

自分が大切にしていることを信念にするからこそ価値があるのであって、ウケが良いというだけで、そういうことを軽々しく口にすべきではないんじゃないかと思うのです。

耳障りの良い言葉は大義名分には持ってこいですが、まずは自分がそれに見合う人物にならないと。デザインの技術も大事ですが、それより以前に、本質を見失わない仕事との向き合い方をよくよく考えなければいけないな、と思います。

この記事のタグ

関連記事

back to top