web系に関わる情報を 専門家が毎日発信!

webデザインのポートフォリオの作り方と参考集【採用担当が解説】

 

こんなツイートをしたんですけども、webデザインのポートフォリオの作り方と参考ポートフォリオ集を採用担当目線で解説しました。ポートフォリオはwebデザイナーが就職あるいは転職する際に、必須となる作品集でして、面接合否の50%くらいを占めると思います。意識したいポイントだけ覚えると便利です。

 

この記事の信頼性ですが、僕はwebデザイン分野で5年働いていて、webデザイナーの採用面接も月に1回くらい行なっています。その際にポートフォリオも毎回拝見していまして、どんな視点で見ているかを採用担当目線で解説できると思っています。

 

webデザインのポートフォリオとは

 

webデザインにおけるポートフォリオの役割をまず確認しますと、いわゆるあなたの作品集ですね。作品集をなぜ作るかというと面接で役立つからです。

 

自分の作品集

webデザイナーの面接というのは、ほぼほぼ面接でポートフォリオによる自分のアピールを行います。その際には、どういうデザインが好きでどんな工夫をどんな役割のもとで行なったかを説明することを通じて、アピールをすることになります。なので、面接の時にどんなアピールをするのかも意識しながらポートフォリオを作成すると役立つかと思います。

 

面接のアピールとして最強

またwebデザイナーの仕事の性質を考えると、ポートフォリオが必要な理由もわかりますよね。webデザイナーはなかなか専門職でして、面接で雄弁に話せても実際にwebデザインツールを使えなかったりするということも考えられないわけでもないです。

 

なので実際にどんなwebデザインを作成できるのかを、ポートフォリオを通じて説明するという役割もあるということも覚えておきましょう。

 

webデザインポートフォリオの作り方

 

webデザインポートフォリオの作り方というのは、そこまで難しくなくて下記のような情報を盛り込んで整理できると大丈夫です。基本的に、ポートフォリオはwebデザインスクールに行けばテンプレなども用意されていますし、マイナビクリエイターに登録すればmatchBoxというポートフォリオ作成サービスを無料で利用できるのでなんとでもなります。

 

内容
自己紹介経歴、強みなど簡単に
スキルセットコーディング、webデザインツールなど
制作物紹介概要とwebデザインキャプチャ
やりたいこと今後やりたいことや志望動機

 

使えるサービスは使い倒した方がいいので、ガンガン使いましょう。ポートフォリオの作り方自体で悩むよりも、どんなwebデザインを作るかとか、webデザインスキルを上げていくことに集中した方がいいですね。

 

webデザインポートフォリオで説明する際に意識したいこと

 

では早速webデザインのポートフォリオの作り方を解説していきます。webデザインの「ポートフォリオでは、全体的な構成、自分の役割とチーム構成、シーンとユーザーとニーズとデザインの工夫、これらを説明できるように作成していきます。

 

自分の役割とチーム体制

 

webデザイナーが働く上では、ほぼほぼwebディレクターやエンジニアと一緒に今日どうすることになりますよね。なので、面接の際にもどのようなチーム構成の中でどんな役割でwebデザインの制作を行なってきたかほぼ質問されます。

 

一人で制作したということはあまりないと思いますが、出来るだけwebディレクター、エンジニアと協業したこと、そしてコミュニケーションを通じて制作したということを織り込みながらポートフォリオの説明をしていきましょう。

 

シーンとユーザーとニーズとデザインの工夫

また、ポートフォリオで制作したwebデザインの説明をする際には、なぜこれを作ったのか、なぜこのwebデザインなのかということも説明できないとなりません。ここで採用目線でいうと、どんな人のどんなシーンにおけるどんなニーズに対してどんなデザインの工夫したのかを解説できるとgoodです。

 

例えば、デート向けの飲食店が並んでいるwebサイトのデザイン集であれば、デートの行き先で悩んでいる若いカップルに対して、夜景を楽しむ、ワインを楽しむなどデートの目的に沿って探せる検索と、デート向けなのでデートに行きたくなるような画像をメインにして飲食店を選べるwebサイトを制作しました。こんな感じで良いと思います。そこまで難しく考える必要はなくて、ある程度考えた上でそれをしっかりwebデザインスキルで制作できることをアピールできれば良いのです。

 

webデザインポートフォリオの参考集

 

Mana

個人的に参考になるなーと思う個人でのポートフォリオを公開しているのは、manaさんですね。ビジュアルデザイン系のポートフォリオもあれば、留学系のwebメディアよりのポートフォリオもありますね。

 

参考:http://ja.webcreatormana.com/

4430デザイン室

もう1つは4430デザイン室ですね。4430デザイン室は、Javascriptもおそらく使っており簡単な動的処理も施されています。4430デザイン室は、ランディングページもあればwebメディア系もありますので、色々なポートフォリオの参考になると思います。

 

参考:http://4430design-room.com/index.html

 

まとめ

 

ということで、webデザインのポートフォリオの作り方を解説しました。ポートフォリオはwebデザイナーにとって必須の作品集であるので、大学生も転職希望者も必ず作りましょう。既存サービスを使いたい場合は、マイナビクリエイターに登録してmatchBoxを無料で使いましょう。

 

人気:webデザインスクールのおすすめと選び方【デザイン歴5年の僕が解説】

最新情報をチェックしよう!