IT人材のためのキャリアライフスタイルマガジン

Webデザイナーのポートフォリオとは?|作り方・参考になるサイト

職種研究

Webデザイナーの就活において、ポートフォリオの作成は必須の資料です。未経験でももちろん、Webデザイナーを志望するのであればポートフォリオを作り、今のスキルをアピールすることも大切です。ポートフォリオの作り方、アピールすることなど、チェックしてみましょう。

更新日時:

Webデザイナーのポートフォリオとは?

Webデザイナーを志望するのであれば、ポートフォリオは就活に必須です。Webデザイナーのポートフォリオは主に過去に担当制作してきたサイトや自分のスキルシートなどををまとめたものを提出するか、もしくは面接の際に持っていくことが多いです。

Webデザイナーのポートフォリオの内容は人様々ですが、ただスクリーンショットやWebサイトのタイトルだけを記載するだけでは作品のスキルやデザインセンスが伝わりません。採用担当者が何を知りたいのか、どんなことを求めているのかをイメージしながら作成しましょう。

そもそもポートフォリオとは?

元々の意味は、有価証券で使われていた紙ばさみという意味でしたが、次第に保有証券を意味する言葉となりました。または、個々の投資家が保有している金融資産の集合体のこともポートフォリオと呼ぶそうです。この記事で紹介しているWebデザイナーとしてのポートフォリオは、今までの実績やスキルを評価してもらう資料集、作品集のようなものと考えてもいいでしょう。もしくは、カタログ代わりとして作成、使う場合もあります。

ポートフォリオの作り方

Webデザイナーとして就活をしようと思い、ポートフォリオを作ろうとしても、やはりどのようなものを載せたらいいのか分からないという人といるかと思います。当然、Webサイトの紹介はもちろんのことなのですが、具体的にどのような内容を載せたら良いのかなどをまとめてみました。

Webデザイナーのポートフォリオを作成する方法

Webデザイナーのポートフォリオを作成する場合、二つの方法があります。1つは、紙をクリアブックでファイリングした紙媒体のポートフォリオで作成する方法。もう一つは、サーバーなどにアップロードをして観覧者制限をかけ、就活用、採用者向けへの公開ポートフォリオとして、作品を集めたポートフォリオサイトを作成するという方法です。 会社の指定がなければ紙媒体かポートフォリオサイトを作成しましょう。ですが、時々ポートフォリオをお持ち下さいなどの指定されたポートフォリオの作成が求められることがありますので、その場合は会社の方法に従って作成しましょう。

紙とファイリングで作成

一番スタンダードかつ面接の時にも持っていけるタイプのポートフォリオです。100円ショップなどで構いませんので、A4サイズのクリアブックに印刷したポートフォリオを入れて見やすくすることが大切です。 レイアウトや表紙などをデザイナースキルを発揮させてこだわりのポートフォリオデザインにしてみましょう。特に、紙媒体のポートフォリオはインパクト重視、レイアウトの見やすさなどに力を入れるとじっくりと読んでもらえるかもしれません。

ポートフォリオサイトとして作成

最近では、Webデザイナー志望者は、ポートフォリオをサーバーやWebページとして作成し、観覧できるようなポートフォリオサイトとして作成し、公開することが多くなってきました。ポートフォリオサイトを作ることができるWebツールなどがあるので、オンライン上でいつでも観覧することが可能になりました。

Webデザイナーは、ただPC上のWebサイトを作成するだけではありません。他にもスマートフォン用のページやガラケー用のWebページなど様々な媒体に合わせたサイト制作を行います。紙とファイリングしたポートフォリオだと、持ち歩けますが、郵送で送るか、持ち込むかのいずれかなので、採用担当者に見てもらうことを考えると少々手間と時間がかかります。

ポートフォリオサイトとして公開し、観覧制限を設けることによって、採用担当者にすぐに見てもらうことができます。ポートフォリオサイトの難点は、OSやブラウザの環境によっては崩れてしまう場合もありますので、注意が必要です。見た目はもちろんのことですが、様々な環境を考えたWebデザイナーのポートフォリオサイトを作成する必要があります。

ポートフォリオに載せる項目

自分のプロフィールや経歴、こだわり

当然ですが、自分の自己紹介は載せておくのが礼儀ですね。簡単でいいので、なるべくプロフィールをきちんと載せましょう。経歴はもちろんのことWebデザイナーとしてのこだわりや信念、得意なジャンルのデザインなどを書いてみましょう。

今できる範囲のスキルシート

志望者のWebサイト制作のスキル状況を会社はきちんと把握したいものです。Webサイトで制作に使用するソフトウェアやツール(Dreamweaver、WordPress、Photoshop、Illustratorな)の操作レベルや機能の使いこなしレベルなどどの程度できるのかを記載しておきましょう。そうすることによって採用担当者が求めているレベルやスキルに達しているなら、面接の機会などを設けてもらえるようになるはずです。

サイト名・URL、スクリーンショット

サーバー上やインターネット上に自分が過去に制作したWebページがあるのなら、記載しておきましょう。ポートフォリオでは一番観られるところで、Webデザイナーとしてのデザインセンス力やページの構成、みやすさなどを評価しやすくなります。 また、自分がこのようなサイトデザインができるカタログのようなアピールもできるので、ポートフォリオを作成する時は、この部分は力を入れてみましょう。

製作期間、自分が担当した箇所(コーディング、デザインなど)使用しているソフト

Webサイトを作るのにどの程度かかるのか、共同制作の場合は自分が担当した箇所のコーディング、またはデザインを記載しておくことも大切です。使用ソフトは、一般的に使われているDreamweaverやPhotoshopなど使えるソフト名を入れておくことによって、より職場での戦力として期待されやすいでしょう。

自分のWebデザイナーの仕事スタイルを紹介

自分の基本的な仕事の進めかたや、自分の得意な制作スタイルなどを書いてみましょう。スマートフォン向けのサイトを制作するのが得意とか、コーディングを駆使した見やすいWebサイトを制作するのが得意など、自分がアピールできることをどんどん書いてみましょう。

今後のWebデザイナーとしてのビジョンや目標、やってみたい仕事、デザインなど

Webデザイナーの仕事をすることによって、業界にどう貢献していきたいのか。どんな仕事をしていきたいのか、自分の将来性ややってみたい仕事など、あなたの目指したいことを書いてみましょう。ビジョンや目標を明確にすることによって、採用担当者が求めている人物像やスキル、期待できそうな目標や将来などが分かれば、どのような戦力となるかなどを考えるので、それが採用のカギとなることでしょう。

Webデザイナー業務未経験の場合

未経験でWebデザイナーとして就職をする場合、業務未経験であることは承知のうえでポートフォリオを作成することが大切です。できれば、多くの作品を作り、技術的な面とデザイン面を見せられるような作品を制作しましょう。採用担当者が知りたい情報は、どの程度のスキルがあるのか、どれくらいの期間で戦力となるのかなどを見極めて採用します。

Webデザイナーの業務未経験だと、Webサイトを制作することはもちろん、Photoshopなどの画像ソフトウェアが扱えるかどうかもみられますので、制作したWebサイトとバナーを制作すると良いでしょう。もしくは、Photoshopの操作が未経験でなければ、バナー以外のボタンなどの制作画像も載せておくだけで、Photoshopの基礎ができているなど、Webデザイナーとして必要なスキルのアピールにもつながります。

デザインカンプでWebデザイナーのポートフォリオ制作

WebサイトはただHTMLコーディングをしてサイトを制作をしただけでは、ただの質素なサイトができあがるだけです。業務未経験でも気軽に制作できるのが、Photoshopを使ったデザインカンプです。デザインカンプは、完成見本としてWebサイトのトップページを制作することをいいます。コーディングはデザインが崩れない程度にすることで、簡単にWebサイトのポートフォリオとして制作することができます。

デザインカンプとコーディングをした物をポートフォリオとして載せることによって、仮に他のWebデザイナーがデザインカンプを上げてきた場合に対応できるというアピールになるのです。ぜひ、やってみてください。

紙で作る場合

Webデザイナーのポートフォリオを制作するには、紙媒体でのポートフォリオも実は必要になってきます。たとえば、「面接の際にはポートフォリオをお持ち下さい」と書かれていた場合は、紙媒体でのポートフォリオを制作しなければなりません。

見やすいポートフォリオを作りましょう

載せる作品はなるべく、簡潔に2ページ以内に収まるようにしましょう。例えば、左ページに制作したWebページのスクリーンショット。右ページに『制作期間』『制作意図』『使用したソフトウェア・アプリケーションなど』『制作時のこだわりなど』を載せて見やすくアピールしてみましょう。また、レイアウトの形式はバラバラにせず、統一をすることによってさらなる見やすさ、正確性をアピールすることができます。

最初のインパクトを大切してみましょう

ただ作品を淡々と置いただけのWebデザイナーポートフォリオでは、採用担当者は驚きませんし「あ、その程度のレベルなんだ」と思われてしまいます。特にWebポートフォリオは表紙のインパクトも大切です。ポートフォリオサイトなら簡単に選んで見ることができるのですが、インパクトには少々欠けます。そのため、次のページをめくってくれるようなインパクトを重視しながらポートフォリオを制作してみましょう。

表紙は、自分で撮ってきた写真をデザインするもよし、Illustratorや自分の制作してきたWebサイトのスクリーンショット画像を上手く組み合わせてデザインしてみるなど、採用担当者がアッと驚くような表紙にしてみましょう。そうすることによって、次のページなどをじっくりと読みたくなるような印象をもたせることができるでしょう。あなたのWebデザイナーとしての実力を十分に発揮することができるのも、紙媒体ならではのアピール方法でもあります。

ポートフォリオを紙で作成するメリット・デメリット

今ではポートフォリオサイトとして公開し、就活のアピールに一役買っているWebデザイナーのポートフォリオですが、紙で作成するのには、ちゃんとしたメリット、デメリットがあります。むしろ、ポートフォリオサイト(Webページとして)と紙媒体のWebサイトのポートフォリオ両方の準備をしておいたほうが、「しまった、用意してなかった」とならなくなりますし、今後の就活がしやすくなるでしょう。

たとえば、ネット環境がないカフェなどで面接をする際、紙媒体で作成しておけばサッと取り出してアピールすることができます。もしくは、ノートパソコンを持っていって、Webポートフォリオをローカルで見ることができるようにしておいて、紙のポートフォリオで詳細を見てもらうなどの優位な使い方をすることができます。ノートパソコンを持ち歩く際は、バッテリー切れにならないようにしっかりと充電をしておくことも視野にいれておきましょう。

紙のポートフォリオを作成するデメリットとしては、印刷費がかかることやプリンター環境の問題、または持ち歩かなければならないという点です。また、会社の仕事内容などによってはいくつものパターンや種類のポートフォリオを作成しなければならないので、そういった意味では紙媒体でのポートフォリオの作成は少々手間かもしれません。 しかし、Webデザイナーであれば、どんな会社でも良いということであれば、広告代理店向け、モバイルサイト向け、商業向けなど各ジャンルごとにポートフォリオを作成したほうが、業種や仕事内容によって持っていくポートフォリオの幅が広がり、臨機応変に対応することができるようになります。

Webデザイナーに向いている人は?

Webデザイナーになりたいけれども、どんな勉強をしたらいいのか分からない。自分が適正なのか分からないということはあると思います。では、Webデザイナーとして向いている人、適正である人はどんな人でしょうか。

1.デザインセンスがある人

当然ですが、デザイナーとして働く以上、デザインのセンスがなければこの仕事は勤まりません。特にWebデザイナーはパソコン上で観られるWebサイトの制作だけでなく、スマートフォンやアプリケーション用のサイトのデザイン、制作を任されることが増えてきました。そのため、スマートフォンなどはデザインの幅が広がりつつはありますが、機種によっては見づらかったり、デザインが崩れたりしてしまっては意味がありません。そのため、臨機応変なデザインスキルとセンスが求められる職種でもあります。

2.コミュニケーション力がある人

Webサイトをデザインしたり、制作するだけがWebデザイナーの仕事ではないということをしっかりと認識しておきましょう。Webデザイナーとしての仕事は、まず依頼してきたクライアントがどのようなサイトを作りたいのか、どのようなコンテンツを作ろうとしているのかなどを打ち合わせして、Webサイトの構成やイメージ資料、デザインカンプの制作など、クライアントとの打ち合わせをする機会が多い職種でもあります。そのため、Webデザイナーを志望する人には、クライアントの打ち合わせがスムーズに対応できるようなコミュニケーション力も求められるのです。

3.向上心がある人

どんな仕事でも、自分から学ぼうとする人、向上心がある人は評価されますよね。Webデザイナーも向上心があったり、自分から学ぼうとすることはとても大切なスキルともいえます。特にインターネットは日々変わっていく技術ですから、HTMLの新しいタグが急に廃止になったり、追加されたりなど、技術の向上は全世界で動いています。 Webデザイナーになるためには、デザインセンスが必要と書きましたが、デザインセンスというのは、あるとかないとかそういうものではなく、デザインセンスというものは経験によって磨かれていくものであることを忘れてはなりません。デザインセンスを磨く要素として効果が高いのが、向上心を持って勉強することが一番だと思います。最初は誰でもセンスというものはありませんし、天才と呼ばれる人たちもまた、デザインセンスを経験によって磨いてきたのです。

Webデザイナーになるためのスキルや経験は仕事で学んでいくことができます。そのため、基礎さえ勉強をしておくことによって、未経験やアルバイトからでも応募することはできるのです。「自分はデザインセンスがないからなれない」と諦めるのではなく、常に向上心を持って、勉強をすることが大切です。ぜひ、向上心が高く、デザインセンスを磨いていくことができるWebデザイナーとしての道を目指してみて下さい。

参考になるサイト

最後にWebデザイナーのポートフォリオを制作するうえで、参考にしたいサイトやポートフォリオサイトを補助してくれるWebサービスサイトをご紹介しましょう。もちろん、紙媒体と合わせられるようにポートフォリオサイトを印刷して、作成することもWebデザイナーのポートフォリオを制作するには、便利でしょう。どのサイトも簡単、便利なので、ぜひ活用してみてください。

ポートフォリオを作成して自分のスキルをアピールしよう

いかがでしたでしょうか。 ポートフォリオの作り方や参考になるサイト、アピールするポイントについて説明しました。自分のスキルと個性がわかるようなポートフォリオを作って、アピールできるようにしましょう。

関連タグ

アクセスランキング