マーカーネット株式会社

WEB制作ブログ WEBデザイン、HTMLコーディング、PHP、スマートフォン制作などWEB制作全般に役立つ情報を発信していきます。

WEBデザイン WEB制作

初心者向けWEBデザイン力強化トレーニング法

投稿日:2014年9月11日 更新日:

af9920057178x
学生時代デザインを勉強してきて、いいものを作る、作れる自信を持っている新人さんが驚くことは先輩デザイナーの圧倒的なスピードだと思います。

社会に出ると当然「納期」があり、「自分のペースで」なんてことが許されないことが大半ですね。自分のペースで作り続けてきた学生と納期に追われ続けたデザイナーとでは、そもそもの鍛えられ方が違います。

では、新人デザイナーさんがいかに早く成長して一端のデザイナーになる為にどんなことをすればよいか。

世間では昔から先輩の技術を盗めなんて言われてますが、デザインは大工さんのきめ細やかな技術のように体を使って覚えるものではない為、意味がありません。
キーボードの叩くテクニック?必要ありません。ショートカット?本を読めば書いてあります。

また仕事のスピードは時間に追われていれば勝手に身に付きます。

まずデザインを真似ることから始めてみよう。

xf3025059715
真似る?そんなかっこ悪いことできるかよ?
って考えてしまう人もいるかと思います。ですが、最初のうちは真似すらできないと思います。できないから真似るのではなく、出来るようになるために真似ると考えてください。真似ると言ってもそのままコピーして盗むという意味ではありません。
デザインの基礎力を強化する為には真似る力がないとイメージで思い描いたデザインはまず出来ません。よいデザインがどうやって作られているか真似てみることから始めると、文字バランスや色数のバランスなど意外な発見があり、ソフトを扱う技術としても身に付くことになるので、最初のトレーニングとしてはお勧めです。

その内自分のなかで自然に昇華されるようになり、想像力や引出しも増えて、気づくころには一端のデザイナーになれていることと思います。

思い描いたものを描ける基礎力を身に着ける為に、よいデザインを真似てみることから始めてみてください。今は良質なデザインを集めたリンク集サイトも多数あるので、参考にしてみてはいかがでしょう。

最後に

大事なこと忘れてました。ホームページはそれぞれターゲットとなる人と、クライアントの目的が合致して初めて成功するWEBサイトと言えます。この記事に書いてあることはあくまで制作プロセスの基礎技術や感覚を早く磨く為の私なりのアドバイスなので、このことを念頭において技術のみに溺れない良いデザイナーさんを目指してください。

-WEBデザイン, WEB制作

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

ワードプレス導入時に入れておくと便利なプラグイン(セキュリティ編)

ワードプレス導入時に入れておくと便利なプラグイン(セキュリティ編)

ワードプレスはオープンソースのため、そのソースコードが公開されております。 誰でも無償で、誰でも改変して商用利用も可能であるというメリットもございますが、 デメリットとして悪意のある者から不正侵入を許 …

ごろごろしながらウェブネタ探し

皆さん! こんばんは!! 株式会社マーカーネットでwebデザインを修行をしている新人デザイナーKです。 普段、皆さんはデザインを作るとき、どこからデザインのネタを探しているんですか? 私は場合は、そう …

オンライン上でPDFファイルをWordファイルに変換する

オンライン上でPDFファイルをWordファイルに変換する

WEBディレクターとして働いていますと、PSDやPNGなどのデザインデータ以外にもパワーポイントやエクセル、PDFなどのファイルなどクライアント様からさまざまな素材をいただいたり、こちらが資料を作成し …

<WordPress>カスタムフィールドテンプレートのテキストエディター(TinyMCE Advanced)で プラグインの設定通り反映されないとき

知ってそうで知らないCSS3の便利な使い方【その2:属性セレクタ編】

前回構造疑似クラスについて便利な使い方をご紹介しましたが、 (知ってそうで知らないCSS3の便利な使い方【その1:構造疑似クラス編】) 今回はCSS3の属性セレクタをご紹介します。 E[foo] fo …

レスポンシブにも対応!行ごとのブロック要素の高さを自動で合わせる方法。

レスポンシブにも対応!行ごとのブロック要素の高さを自動で合わせる方法。

ブロック要素の高さを揃えるJavaScriptはいくつかあります。 その中でも行ごとの高さを変えたい場合に便利な「fixHeight.js」をご紹介します。 「fixHeight.js」の設置方法 ま …