WEBCRE8.jpウェブクリ8.jp

webデザイナーによる、デザインとwebを楽しむ情報ブログ

考える。

WEBCRE8.jpによるweb制作やデザインについての考察を
書き綴っていくカテゴリです。

[webデザイン]目的を実現する為の3段階のwebデザイン能力

この記事は約12分ぐらいで読めます

[webデザイン]目的を実現する為の3段階のwebデザイン能力
webデザイナーがやることは段々増えてきていると言われますが、実際にwebデザインをするにあたって必要な能力って何なのでしょうか。勉強の仕方も含め考えてみましょう。

webデザインの仕事はたくさん!

webデザインって一口で言っても色んな人がいますよね。美しくてうっとりするようなデザインが出来る人、イラストが描けて温かみのあるデザインが得意な人、プログラミングやwebサービスを駆使して思いもよらない表現をする人…。

それらはその人がこれまで制作してきたものや学んできたことから形作られてきたものです。一体どんな能力を磨けばそうなることができるんでしょうね。webcre8の考えるwebデザインの仕事、それに必要なこと、学び方を整理してみました。

思うに、webデザインに必要な能力とは、発想力、知識、技術力です。

ちなみにこの記事は「web制作のワークフローのどこまでをwebデザインと呼ぶのか」という話ではなく、「どういう能力を身につければデザインが良くなるのか」と言う話です。

webデザインに必要なこと:発想力

依頼者の発案からイメージするのは発想力

依頼者の発案からイメージするのは発想力

webデザインに必要な発想力とは、必要とされる要件に対して適したデザインをイメージできるかどうかです。会社によってはwebディレクタがやってしまったり、ここまで決まった状態で発注されることもあると思います。

webデザインのスタート

webサイトのデザインをするときってどんなときでしょうか。人からの依頼、自分でサイトを制作する時、制作会社で働いているとき…。

シチュエーションは違いますが、webデザインは全てそのサイトを作る目的を実現するために必要とされますよね。依頼者は「こういうことがしたい」という目的を持っているものの、それがどういうサイトなら実現できるのかはわかっていないことも少なくありません。自分で作るサイトだって、まず最初に考えるのは「○○するためのサイトが作りたい」という事が先に来る筈です。

どんな目的を実現するかによって見た目も、構造も、情報設計も変わってくると思います。最初に提示された目的に対して、どんなデザインが適しているのか。引き出しが多い方がその目的にあった提案がしやすいかもしれません。

先に大まかなイメージが提示される場合

お客さんやディレクターに予めサイトのイメージを渡される場合があります。これは、ディレクション的な観点やマーケティング的な観点、または実際には個人的な好みで提案されることもあると思います。

仕事としてはそれぞれがそれぞれの領分に与えられた範囲内で最大の成果を作ることが目的なので、「提案をそのまま受け取ってその中で最高なものを作る」ということでもいいのですが…もし可能であるなら「その目的を実現するためにはその方向性が本当に正しいのか」という事は考えてみたり、話しあってもいいと思います。

発想力を高めるには

webデザインのための発想力を高めるにはどうしたらいいでしょう。

実際のサイトやギャラリーサイトを見る

webデザインの発想力を高めるには色んなサイトを実際に見て使ってみたり、ギャラリーサイト等で色んなサイトを見ると良いと思います。このサイトはなぜこういう作りのサイトになっているのか。その選択肢と選び方を学ぶのです。

[ブログ]webから得たものをwebに返すということ

この記事で紹介したブログはそれぞれ気に入ったところがあって紹介しているブログです。それぞれのブログがなぜこういうデザインなのか、考えてみるのも面白いですね。

web以外の優れていたり楽しいものを見る

もちろん、世の中に既に存在するサイトが全てではないと思います。現実に存在する素敵なもの、購買意欲をそそるもの、雰囲気を盛り上げてくれるものをwebデザインに落とし込むことはユーザーの印象を作り上げることに繋がるでしょう。

一時期流行ったテーブルを上から見下ろしたようなデザインがありましたよね。たくさん作られすぎて陳腐化するというのはどのジャンルのデザインでもあると思いますけど、あれは如何にも物書きの机といった風情で良かったですし、趣味嗜好も表現できるブログに向いた表現だったと思います。比喩的な表現、web以外で良しとされているものをデザインに落とし込むのは、知ってさえいれば発想としてはわりと簡単です。リアリティを出す技術力が必要ですけどね。

DesignWorks

http://designwork-s.com/

DesignWorksは、面白いプロダクトを主に紹介するブログです。何かwebに活用できるものはないでしょうか。

webデザインに必要なこと:知識

イメージを具体化するのは知識

イメージを具体化するのは知識

webデザインに必要な知識とは、発想されたイメージで表現したいことや目的をどう具体化すれば叶えることができるかを知っており、理解しているかどうかです。UIについて詳しかったり、マーケティングに詳しい人はやはりすごく勉強しています。

webサイトを利用する人の心理や人体の特性

webサイトや写真の色彩が見る人の心理にどういう影響を与えるか。目はどう動くと疲れるか。どのくらいクリックの待機時間で人がストレスを感じるか等、統計やレポートの物語る資料を調べることができます。年代による好みの違い、流行り廃り等、考えておけば確かな違いが生まれます。webサイトは人が使うモノなのでターゲットにもよりますが、アクセシビリティなどへの配慮も必要ですね。これらは大抵知らないと気付けません。

使いやすく、利用されやすいもの

ユーザビリティに関する知識、情報設計に関する知識もwebデザインにとって重要です。これらのことは気をてらう事では成立せず、ひたすら使いやすさ、理解しやすさ、見やすさなどの追求が必要です。既に検証や統計で証明された作り方を踏襲しつつ、自分でも使ってみたり、ユーザテストを行ってみたり。便利なツールを使うのもアリです。

知識をつけるには

webデザインに役に立つ知識を得るにはどうしたらいいでしょうか。

webのみでない各ジャンルの勉強をする

上に挙げたような心理学や色、目の機能や人間工学、対象であるを知ることは役に立ちます。フォントや表現技術をいくら知っていても、それぞれが見る人にどういう印象を与えるか知っていないと、適切な利用が出来ないでしょう。

その他、国ごとの習慣や社会、言語、宗教や哲学、はたまたエンターテイメントや芸能、スポーツ等、およそ知っていて役に立たない知識なんてないと思います。

[デザイン]なぜレタッチするのか。記憶色とか写真とか心象風景の話

この記事は写真やものの色と光、脳の認識の話です。直接webとは関係がないとしても、制作をする上で非常に役に立つ事は多いです。

OVERKAST - 理論のインストールと転回

http://overkast.jp/

webデザインに隣接した知識や心理学に基づいた考察などの記事が多く書かれているOVERKAST。

関連したwebサイトを使って体験する

実際にサイトを触ってみたりすることで、人間工学や心理学に基づいたデザインが出来るかもしれません。前もって学習しておくに越したことはないですが、自身がヘビーなネットユーザー(体験が十分)であるなら、昔から言われているセオリーが最早今の環境では通用しないことに気付けたり、やはり正しいのだと再確認出来たりすると思います。もちろん、そういった知識を学んだあとでそれらを体験してみても遅くはないでしょう。

2012年10月のwebサービス・コンテンツ28(リリース・話題になったもの)

いろんなwebサービスやコンテンツを触ってみましょう。内容の似たもの、目的の似たもの、ビジネスモデルの似たもの。色んなサイトが参考になります。

webデザインに必要なこと:技術力

具体化されたデザインを表現するのは技術力

具体化されたデザインを表現するのは技術力

webデザインに必要な技術力とは、実際に学習したことを表現できるスキルを持っているかどうかです。一般的に「webデザインの学習」と思われているのはここにあたるものが多いと思います。作業の質を目に見える形で良くする為に学習しやすい半面、技術に終始してしまうこともあります。

クオリティーの問題

パーツやエレメント一つ一つのクオリティーの高さは、そのサイトが扱うコンテンツにももっともらしさを与えます。クオリティーが高くて悪いことはないでしょう。もちろん、絵にもヘタウマと言われるモノがあるように、雑な感じや緩さが必要な場合もあります。ですがなんにせよ、与えたい印象を与える為にはその徹底が必要です。

修練によるスピードアップ

実際に仕事としてやる場合、スピードは重要になります。ものづくりと言うモノはある一定のラインを越えると時間効率が非常に悪くなってきますが、逆に言うとそのラインまでは時間をかければ誰でも到達できます。短時間でそこに至る事が出来るのがプロだと思います。そしてその完成度において限りなく100に近づけていくのは匠の世界です…!

技術力を磨くには

では技術力を磨くにはどうしたらいいでしょうか。

チュートリアルをこなす

とりあえずたくさんのチュートリアルをこなしましょう!チュートリアルは色んなサイトで扱われていますし、webの世界の先輩方が作ってくれた優れた制作例は一日一個ずつやっても多分一生なくなりませんw そのうちPhotoshopの使い方だってめきめき覚えられます★

[Photoshop]極座標フィルタでできるクリエイティブ表現色々

- Photoshop VIP

http://photoshopvip.net/

Photoshop VIPはたくさんのチュートリアルやデザイン素材を紹介してくれます。これらを駆使して素敵なデザインを自分のものにしましょう!

ツールの使い方を覚える

PhotoshopやIlustraotr等のソフトそれ自体、アクションやブラシなどのプリセットやダウンロードアイテム、CSS等の駆使…そう言ったことを学べば素早くキレイなデザインが出来ます。

私がweb制作でよく使うサイト47+α 作業ごとリスト

サービスを活用しましょう。あなたの制作を効率よくしてくれるサイトが沢山あります。それで節約した時間を、今度は他の部分のディティールを良くするために使うのです!

たくさんのものを作る

サイト自体をたくさん作っていれば当然覚えられます。ワークフローにもよりますけど、様々なサイトを作れば対応力が、似たようなサイトばかり作れば各作業のスピードがアップします。

ブログをどう始めたらいいか分からない人へ。目的とテーマ

何もアウトプットの場を持ってない人はブログを作ってみるのはいかがでしょうか?

一つ一つを突き詰めて考える

さらっと作っているとそこそこのサイトしかできません。時間があるときにでも美しいサイトがなぜ美しいのか、凝ったディティールはどうやって生み出されているのかを観察し抜くのです。

デザインが苦手な人も分かる「デザインは全て意味がある」6つの要素

良いイメージが出来て、知識に裏付けられた要素を選択できたのなら、後はそれをどれだけ表現できるかです。色、形、ホワイトスペース、写真、文字等…時間の許す限り、いくらでも拘りましょう。98を99に、99を99.9に、99.9を99.99にするために。

終わりに:本当に必要なことを選んで力をつけよう

製作工程のそれぞれにおいての力を高めるために、このような学習や修練を積めば良いのではないかとwebcre8は考えています。しかし、その全てが必要だと言われても、誰しも時間がいくらでもあるわけではありませんよね。

webcre8はwebデザイナーではありますが、今自分自身や実際の業務における必要性で考えれば、デザインの技術より発想、発想より知識を求めています。技術もまだまだ全くの未熟ではあるんですがね…。

自分に足りないもの、必要なものは何なのか…自分の仕事にはどのフェイズの能力が必要なのか。そして今は必要なくても少しずつでもやっていた方がいいのか。そう言う事を考えて勉強の手段を選び、能力を高めていくといいのではないでしょーか!