Webデザインを上達させるために大切なこと。デザインが苦手なあなたや私へ。IT系女子ログスマートフォン用の表示で見るIT系女子ログWebデザイナーのエッセイ。デザイン、コーディングで気になることをあれこれ考える。2015-04-27Webデザインを上達させるために大切なこと。デザインが苦手なあなたや私へ。KnowledgeWebデザイナーとして参加していた案件が炎上してしまい、デザイン業務をすることがとても怖くなってしまいました...。そんなデザイン恐怖症を克服するため、デザインをもっともっと上達させよう!と決めました。私の個人的な意見で恐縮ですが、同じようにデザインで悩める方が、デザインを前向きに捉えるきっかけのひとつにでもなれればと思い、自分なりに大切だと思うことを書き出しました。関連記事デザインは2年でどのくらい向上するものなのか。私は未経験でWebデザイナーとして入社して2年目です。先日、新規サイトの案件に、メインデザイナーとして参加させていただきました。本来ならば2日で提案デザインを出すところを、「不慣れだから」ということで3日のお時間をいただきました。ところが2日たってもチーフデザイナーからのOKが頂けず、3日目の午後になってもOKが頂けない...。チーフには「このクオリティでは今日中にクライアントに出せない」と...。クライアントからは「何時になっても良いから今日中に出して」との声があり、必死でやるも、やはりクオリティが上がらず、仕上がらないデザインをチーフに引き継いで、泣く泣く終電で帰りました。xvire1969出社すると、とても綺麗なデザインが出来ていました。なんとチーフは3時間で仕上げたとのこと。デザインとはとても難しいのだと痛感この1件で痛感したのは、自分のデザイン力の無さと、プロのデザイナーと今の私との実力の差です。Webもデザインも、未経験で入社して2年目。案件を任されるようになってきたのですが、自分の力だけではなかなか進まず、力不足を身にしみて実感しています。それと同時に今まで難なく進んでいたのは先輩やチーフのサポートがあってのこと、というのも実感しました。1年間、のほほんと過ごしてきたツケだと思います...。デザインができないことが、とっっっても悔しくて周りの方々に申し訳ないので、Webデザインを上達させる為にはどうすれば良いのか、を考えてみました。kohlmann.saschaこれが、プロになるために一番必要なことです。私は覚悟しているつもりで、していませんでした。簡単に考えていたのですが、甘かったです。いうのも、今まで先輩のサポートが多分にあり、自分にデザイン力がある程度あると勘違いしてしまっていたのです。いざ、自分の力だけでデザインしようと思うと、手が動かなかったのです。今までデザインに使ってきたアイデアのほとんどを、先輩の引き出しから拝借していたんですから、当たり前ですよね。自分の実力の無さが露呈して、とても情けなかったし、悔しかったし、自分自身に残念な気持ちになりました。デザインと向き合い続ける私はデザインが苦手です。自覚していなかったのですが、なるべく避けながら、当たり障りない箇所にしか手を出さないようにしていました。逃げていては上達できるわけないですよね。そんな私ですが、チーフから掛けて頂いた言葉がすごく身にしみましたので、ここに書き残しておきます。「デザインというのは感覚やセンスという、"特別な能力がある人しかできない"、一般の感覚からは理解できない領域と思われがちだが、実はそうではない。今バリバリ活躍しているデザイナーも始めは皆、未経験で初心者。勉強して、たくさん制作して、たくさん考えて、たくさん経験してきた積み重ねがあるから、いとも簡単にデザインされたように見えるだけ。デザインするというのは、実はロジカルな部分も多い。"この色にこの色を合わせるとこの印象を与える"とか"この配置はこの印象を与える"とか"このターゲットにはこのレイアウト"とか、論理的に計算された上でデザインが出来ている。勉強する領域が広いから、すぐに諦めた人にとっては"特別な能力がないとできないもの"のように感じているだけ。理解できるまで、諦めずに勉強し続ければどんな人でもデザインできるようになる。チーフ分からなくても諦めず、デザインと正面から向き合うことに決めました。2014/04/18「センスは作っていけるもの」と教えて頂いた、とてもオススメの本です。他責でなく自責で考える「良い素材がないから」「良いキャッチコピーがもらえないから」「使える写真が少ないから」「納期が短いから」「具体的な指示がないから」「体調が悪いから」「まだ勉強中だから」......できない理由はいくらでも探せると思います。制限のある中でいかにクライアントの希望に沿ったものを作り出すのがデザインの真髄であり、ここでデザイン力のある、ないがダイレクトに反映されます。制限があるから、デザインがより重要になるそもそも、制限のない案件なんてあるんでしょうか。仕事でデザインに関わる以上、お金がかかります。どんな案件でも、限られた予算内で制作する以上、制限があるのは当然のことですよね。「良い素材がない」なら、探せばいい。探せないなら、作ればいい。「良いキャッチコピーがもらえない」なら、コピーの扱い方を変えればいい。変えれないなら、デザインにあうコピーを書けばいい。書けないなら、コピーなしで成立するデザインを作ればいい。制限のある中で、クライアントの希望に沿ったデザインを作れるのであれば、こちらから提案していけばいい。デザイナーが提案してもいいクライアントやディレクターより、Webデザインに詳しいのはもちろん私たちWebデザイナーです。こちらからより良いデザインにするためにはどうすれば良いかを伝えていくことで、よりクオリティの高いデザインにできると思います。デザインのはてな良いデザインをたくさん知る良いデザインを知らない人が、良いデザインをつくれるわけがない何も参考にせず、自力で制作していませんか?チーフ曰く、「何も見ずに自力で制作できるのは、それまでに何百サイトも作ってる人。何百サイトも作ってる人は、自力で作らず、まず参考サイトを探す。」つまり、色んな制作経験があるデザイナーでも、制作に入る前にはその都度参考サイトを探すのに、経験の浅いデザイナーが何も見ずに制作に取り掛かっても、いいデザインが出来るわけがない。何も見ずに制作するということは、自分の引き出しだけでデザインするということ。そんなにたくさん、デザインの引き出しがありますか?制作経験が浅く、限られた引き出しの中で何とかデザインしようとするから、何回修正してもクオリティが上がらないんです。参考サイトを探すべきなのですが、いざ業務の限られた時間内で探そうとすると、見つからないことも多いです。普段からWebサイト集をチェックしたり、制作ブログを読んだりして、良いデザインを知っておくことが大切です。Webサイト集のサイトも、ありがたいことに色んなサイトがあります。大手企業のサイトが多いところ、フラットデザインの多いところ、レスポンシブデザインの多いところなどなど...。カテゴリ分けの仕方も様々です。普段チェックするときに、どのサイトがどんなデザインが多いか見ておくことで、より早く参考サイトを探せるようになります。色んなサイトをブックマークしたりRSS登録してみてはいかがでしょうか。まとめRSSリーダーの効率的な使い方「RSSとは」な人に朗報!Feedlyでフィード購読のすすめ私もずっとFeedlyを愛用しています。細部まで観察して、なぜ良く見えるのかを自分の頭で考える良いデザインはなぜ良く見えるのか参考サイトと同じ色や素材を使っていても、うまくはまらないときがあります。このデザインはよく見えるのか。余白の取り方?色?大きさ?シャドウのかけ方?ラインの使い方?写真の置き方?続くコンテンツとのバランス?細部まで見るとちょっとした効果で全体のバランスを取っていたりします。効果的なのは、イマイチなデザインと比べること。見えるのか、なぜイマイチに見えるのかも同時に考えると、イマイチなデザインをしなくなるそうです。良いデザインの完コピをして、どんどん手を動かす潔く完コピして、学ばせていただく良いデザインをたくさん知るでも書きましたが、自分の引き出しをたくさん作らないことには色んなデザインに対応できず、なかなか上達しません。良い勉強法は、公開されている良いWebデザインを完全にコピーすること。私は、これを始めに聞いたときにかなり抵抗がありました。「パクるなんてダメ!」と思っていたのですが、パクるというより模写するという考えです。丸パクリのものを業務で提出すると怒られますが、勉強するには完コピすることが一番効率的なんだそうです。効率的かというと、完成度の高いデザインと同じように実際に自分の手を動かして作っていくことで、経験を積んでいけるからです。私の実践するトレース方法できることなら、横に置きながら進めていきたいのですが、私のような初心者は時間がかかり過ぎてしまいます。始めは下に見本を置いてトレースしてもいいです。トレースしながら、完全に同じものを作る為にはどうすればいいかを考えながら手を動かします。"よく見ると1pxの線があった"とか、"シャドウのかけ方が凝っている"とか"フォントの選び方"とか、大変勉強になります。ロゴはトレースしなくてもいいですが、写真素材も自分で近いものを探すのも勉強のうちだそうです。意外と探し出すのが難しいことに気づきます。部分的にトレースするだけでも勉強になりますが、できればヘッダーからフッターまでまるっと1ページ完コピしましょう。フッターでどのようにバランスを取っているかも大事だからです。キャプチャーのススメ普段Webデザイン集をチェックしているときに、トレースしたいサイトのキャプチャーを取っておくと良いでしょう。Webなので、日が経つとリンクが切れていたりするからです。私はTopページと下層ページの2枚ずつキャプチャーを取っています。Screenshotを愛用していますが、セキュリティ上心配な記事を見つけたので他の者を探そうかと思っています。株式会社LIG自分用の素材リストを作る素材をイチから作るのも良いのですが、その都度作っていてはとても時間がかかります。できることならその時間を他に使いたいですよね。普段から無料素材を見つけたりしたら、自分用の素材リストを作っておくことで、いざという時かなり効率よく探せます。あとは制作しているデザインに合うよう少し調整をしてあげればいいので、イチから作るよりもかなりの時間短縮になるのではないでしょうか。管理が出来ているかで、スピードに差が出るただ、素材は膨大な数になっていくと、探し出すのも一苦労になっていきます。自分が探すときにどの手順で絞り込んでいくのが分かりやすいか考えた上での分類をしておくこともとても大切です。私は今はローカルフォルダに素材を保存していて、フォルダ分けで管理しているのですが、Evernoteで管理していこうかな、と考えています。[schoo]デザインの基礎力をワンランクアップしたい私(Webデザイナー)の注意書きへこたれない心をつくるこれもデザインを上達させるために必要なことです。「120%の力でデザインした、これ以上いいデザインは考えられない」という出来でも、見る人によって様々な意見があるのは当然です。修正はつきものだし、もしかするとクライアントの意向が変わって全替えなんてこともザラにあります。その度に落ち込んだり、悲しんだりしていては、とてもじゃないですが心が持ちません。いちいち落ち込んでいると、指摘を受けることが嫌になってきます。指摘を素直に受けることもデザインが上達する方法のひとつなのですが、指摘を受けることを避けてしまいます。引いて、冷静に受け止めるデザインには正解がなく、クライアント目線では「好きか嫌いか」が判断材料だったりするので、"絶対"はあり得ないのです。「修正されるもの」と80%くらいの気持ちで、自分のデザインとの距離を少し取る。「どんどん修正しますよ」「もう1案出しましょうか」くらいの気持ちでいることも結構大事です。へこたれて、上達する前に辞めてしまっては意味がありません。難しいことですが、へこたれない心をつくることもデザイン上達には不可欠です。30代から始めるWebデザイナー初心者ガイドどや!?すぐにはじめられるWebデザイン勉強法!女子大学院生がWebデザインについて語るブログ「Web-DAYsign」が面白い。30代から始めるWebデザイナー初心者ガイド新人Webデザイナーが誰でもぶつかる壁。そんな壁は壊しちゃえ。株式会社LIG最後にこの記事が少しでも、私と同じようにデザインが苦手な方へのお力になれれば幸いです。以前、省エネ脳についての話をしたことがあります。プロとアマの脳の使い方には違いがあって、プロのように脳を省エネ化するには、英語学習で考えると約2200時間の勉強で実現できる、ということでした。2200時間勉強したらどのくらいのレベルになるのかを検証したく、勉強する分野を考えていたのですが、"Webデザイン"と決めました。Webデザインの勉強は多分野で検証しづらいのですが、なるべく記録を取っていきたいと思います。00:06Webデザインを上達させるために大切なこと。デザインが苦手なあなたや私へ。»SearchProfileWebデザイナー4年目。ヒトクセあるけど軽やかでふところの深いデザイナー、目指してます。読者になるRankingRecommend2019-12-10【2019年版】社内じんわりアクセシビリティ普及活動記録2019-02-02webが求められる普遍性2018-12-17ジェネレーティブアートに挑戦するならp5.jsがはじめやすい2018-11-26デザイナーが1pxを大切にしたい理由はてなブログをはじめよう!tosssaurusさんは、はてなブログを使っています。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。