初めての【差がつく】ポートフォリオの作り方〜WEBデザイナー〜

ポートフォリオの作り方アイキャッチ画像 WEBデザイン

今はWEB業界とは関係ない業界で働いているけど、

将来的にWEBデザイナーになりたい!スキルアップしたい!

という方向けにポートフォリオの作り方を伝授します。

WEBデザイン会社に入ってから何度も未経験者の面接を行ったことがあります

その中でもこの人は経験ないけどいいなと思った他の未経験者とは違う「差がつく」ポートフォリオ作成をメインにお話ししますね。

WEB業界に転職しようと思ったら必ず、「ポートフォリオ持参、もしくは提出」と書類や面接の条件に入ってきます。今回は未経験でも入れる会社をメインにしたポートフォリオの作り方です。

ポートフォリオとは

ざっくり言ってしまうと、ポートフォリオとは今の自分にどれだけのデザインスキルがあるのかをまとめたものです。

まゆやん
まゆやん

一言で言えば作品集ですね。

面接や書類審査の時、未経験者でもポートフォリオがあるかないかで「この業界に本当にきたいのか」やる気を見せることができます。

そして今のデザインの実力で少しでも会社の役に立てそうと思わせることができたら合格に一歩近づきます!

まゆやん
まゆやん

なので未経験者の場合はポートフォリオ作りは必ず行った方がいいでしょう。

 

個性が出るのでこだわりたい!という部分にはこだわればいいのですが、あくまでも未経験者がWEBデザイナーになるためのポートフォリオなります。

未経験者の場合はいかにポートフォリオを作成しながらデザイン力を上げていくか、自分の魅力を伝えていくかが大切になります。

ポートフォリオの作り方

ポートフォリオには様々な作り方が存在します。本のようにしっかりとしたものから、WEBページに自分のページを作成し、そこに実績を公開する。紙ベースからWEBまで様々なのです。

未経験者には自分のWEBページ内に実績を公開するまでいくのにも時間がかかってしまうので、今回は書類として提出する用のポートフォリオ作成法になります。(PDFや紙)

 

色々とデザインをした後にA4用紙にまとめるイメージですが、A4にまとめる時は得意なアプリでも構いません。

 

まゆやん
まゆやん

過去にパワーポイントを縦にしてデザインした方や、ワードで作成する人もいらっしゃいました。もしどうしてもどちらかと言えば私はパワーポイントをおすすめします。

ほとんど見たままA4用紙に印刷されますし、PDFに簡単にできるのでおすすめです。

慣れているアプリを使うのが一番ですよ。

ポートフォリオの構成

構成も様々ですが、今回は、

  • 表紙
  • 自己紹介ページ
    未経験者は特に重要
  • 目次
    全部作り終わってから作成する
  • バナー作品
    多くなくていいので丁寧に
  • WEBページ作品
  • 裏表紙

こんな感じのページ構成です。

 

自己紹介ページの作成

自己紹介は今までの自分がどんな人であるかをわかりやすくまとめたものですね。

このページは未経験者の方がアピールできる最適なページになります。

自己紹介ページのデザインの流れ
  • STEP1
    伝えたいことを書き出す
  • STEP2
    分類ごとに分ける
  • STEP3
    文章を考える
  • STEP4
    デザインを考える
  • STEP5
    デザインする
まゆやん
まゆやん

デザインするためには下調べや情報の整理などが大切です。

伝えたいことを書き出す

どんなことを書くかというと、ポイントは「履歴書じゃ伝えきれない自分の魅力」をちょっと他人風に書くことです。

第3者の目線から自己紹介をしてもらうようなイメージです。デザイナーになるのですからちょっと個性的なくらいでも業界の人は驚きませんよ。

まゆやん
まゆやん

(WEB業界は変わり者が多い業界でもあります。アーティストだからかな…)

面接の時にどんなことを伝えたいかをぶつけるような感じで、たくさん出しましょう。

 

分類ごとに分ける

次に分類をします。例えば、

「経歴」「性格」「スキル」「趣味」など自分が伝えたいことを整理します。

まゆやん
まゆやん

必ず「スキル」は書いてくださいね。面接官が質問しやすくなります。

多すぎても見栄えがよくないのでA4 1ページくらいで伝えきれると◎

 

文章を考える

第3者目線の文例ですが、

田中花子 27歳 愛知県名古屋市生まれ。
●●大学●●学部を卒業後、●●株式会社に総合営業職として入社。地域活性のために日々営業や企画書の作成、プレゼンテーションなどを行うが、昔からの夢「WEBデザイナー」を叶えたいという気持ちを抑えきれず、転職に踏み切る。現在は仕事を続けながらも、独学やデザインスクールに通うなどして日々デザイン力を磨く。

こんな感じです。もっと膨らませたり、アピールしたいことを盛り込んでもいいと思います。

結局、面接時の自己紹介でも話すのですが、人は話した内容や、聞いた話をほぼ忘れます

手元に残った時に、履歴書以外にも自己紹介があることはこんなことを話していたなと、思い出すきっかけになるので「履歴書では伝えきれない魅力を書く」ことを意識してくださいね。

 

デザインを考える

大まかに自己紹介文ができたら、そこからデザインを考えます。

デザインの決め方は大きな枠ごとに区切って何か裏紙など実際に書きながらデザインしていくとデザインしやすくなりますよ。

まゆやん
まゆやん

イメージはジグソーパズルです。

 

顔写真はつけた方がいいのかとよく質問をいただきますが、顔写真はなるべくつけた方がいい印象を与えますよ。

写真は証明写真のようなものではなく、自分の趣味や人間性のわかるものが良いです。写真もデザインの一部です。

自己紹介ページは情報量も多く、未経験者が一番アピールできる場所なので、力を入れてくださいね!

バナーを作成する

まず一番はじめに未経験の方に任せられる仕事と言えば、「バナー作り」なのです!

バナーとは、画像リンクのことです。

バナーを作る際には、

こんな相手にこんな情報を届けたいからここのデザインにこだわりました。

などと言えるようになるようにしておくと面接でも書類審査でも通りやすくなります。

バナーの作成途中のものもガンガン保存しておきましょう!途中経過や失敗も載せることができるのでポートフォリオが埋まります。

そしてそれがストーリーになるのでおすすめですよ。面接で話せますし、この途中経過のデザインも好きだと言ってくれる面接官が現れるかもしれないです。

 

どんなバナーを作るべきか

どんなバナーを作成すればいいのかは、行きたい業種によって変わります。もしWEBデザイン会社であればそのデザイン会社の実績を確認してください。

実績から「その会社の得意分野」が見えてきます。

例えば銀行系が多ければ銀行系のバナーを作成し、ファッション関連が多いならファッション関連のバナーを作成します。

面接の方はよく担当する業界のバナーがきたら目を引くものです。

まゆやん
まゆやん

この時点でちゃんと弊社のことを調べてきているんだなと思わせることができます。そうすると印象にも残りやすく、やる気や熱意もアピールできるきっかけになるのです。

 

また、2つ目のバナーはその会社の実績が少ない分野のバナーをあえて作成すると良いでしょう。

こんな分野でもデザインできるんだよ、ということを見せるチャンスです。もし、その会社に無事に入れ、その会社が新しい分野に挑戦する時にデザインチームに入れてもらえるかもしれませんよ!

 

3つ目は自分が得意な分野のバナーを作成しましょう。

服が好きならセール情報バナーや、旅行が好きなら旅行系、そんな感じで気楽に作成しましょうね。

 

ポートフォリオにバナーを貼り付ける

バナーを3つくらい作成したらポートフォリオのページは2〜4枚くらい埋まります。

バナーの横、もしくは下に

・ターゲット
・伝えたい情報
・意識したこと
・迷ったこと
・このデザインにしなかった理由(ぼつになったバナー)

などを書くと良いでしょう。イメージはこんな感じ。配置などはなんでも良いです。

ポートフォリオの作り方_03

 

バナーに対して細かくコメントを入れることでポートフォリオを見た側の人間は

ディレクター
ディレクター

「こういうことを意識して作っているんだな」

とデザインに対して感想を持ちやすくなります。

何もコメントがないと「デザインがうまいか下手か」でしか判断されなくなるのでコメントをつけておくことが未経験者にとっては大きな差がつくポイントとなるでしょう。

 

このページの作成ポイントとしては、バナー以外のデザインを統一することです。

文章量によっては多少なり調整してもいいのですが、基本的にはデザインを統一しましょうね。

 

WEBページを作成する

ついに出ました、WEBデザインらしいデザイン!

面接官は正直、未経験者にはあまり期待していない部分ですので、もしHPが1つでも作ってあるのなら他の未経験者の方とはかなりの差がつく部分になります!

作成の細かい作業の仕方は後日、記事にしますね。

HPを作成する手順は結構あるので、コーディングなどが面倒な方はデザインだけして、あとは無料のオンラインツールホームページ作成ソフト【Jimdo】で作成するのもありです。

無料プランだとURLがJimboになって面接官にバレてしまうので、それがバレるのが嫌な方は月額990円(税抜)のプランに入りましょう。

 

作成するにあたって

作成する時に注意する点は、自己紹介以外のページを作成することです。

WEBデザインとは誰かの何か目的があって作成するものですので、自分の興味にあうことを作成してみましょう。

デザインする時に押さえるべきポイント

1.なぜそのテーマにしようと思ったか

2.誰にこのHPをみてもらいたいか

3.このHPのゴールは何か(買ってもらいたいのか、集まって欲しいのかなど)

この3つを必ず意識してくださいね。

コーディング時に気をつけること

レスポンシブに対応しているHPを作成しましょう。

レスポンシブデザインとはスマホやPC、タブレットも横幅が変わってもデザインが横幅に合わせて最適化されるデザインのこと

今のWEB業界ではレスポンシブデザインが主流となっています。

コーディングは大変ですが、これができると仕事の幅が増えるので1つでもいいのでやりきってみましょう。

 

ポートフォリオに反映させる

TOPページができたらポートフォリオに反映させましょう。

バナーの時のポートフォリオと同じような要領でやっていきましょう。

多分ここまで作成できたのならば、かなり要領を掴んでいるはずなので言いたいことや書きたいことが山ほど出てくるはずです。

 

他のページもできたら同じようにポートフォリオに反映させても構いませんが、時間がない方の場合、TOPページ作成でも十分です。

まゆやん
まゆやん

HPを一つでも作ったことがあるということが大きなアドバンテージになります!

 

「表紙」「目次」「裏表紙」を作成する

正直にいうとあまりこだわらなくてもいい部分です。

もしこだわりたい!デザイン力を見せつけたい!という方はガンガンこだわってセンスを見せつけてしまいましょう!

もしこだわるのだとしたら表紙がおすすめ。たくさんある中で目に留まりやすくなります。

表紙は大きなバナーを作るイメージで作るといいかと思います。

目次は最後に作成するのがおすすめですよ。もしかしたらここにも作品を載せたい!と思うことがあるかもしれないからです。

 

仕上げをする

全てのデザインができたら不備がないかチェックしてPDFにしてまとめましょう

その後家にプリンターがある方は印刷をしてみて、色の出方が悪かったりしたらコンビニでプリントするのもよし、紙の質がいいものに変えてもよし!

プリントができたら、ファイルにまとめたり、こだわりがあるのならラミネートするのもありだと思います。

ここまできたらあとはもう見せるだけなので完成ですね。

まゆやん
まゆやん

長い時間お疲れ様でした!

まとめ

ポートフォリオは未経験者にとってあるだけで大きな差がつくポイントになります。

差がつくポイントは

・自己紹介は履歴書では伝えきれない自分の魅力を第3者目線で書くべし

・バナーは受けたい企業の得意分野バナーを作成すべし

・HPの作成はレスポンシブデザインにすべし

 

以上を踏まえてポートフォリオの作成をしてみてくださいね。

 

タイトルとURLをコピーしました