1. HOME
  2. Geekly Media
  3. UIデザイナーのポートフォリオの作り方を解説!活用方法は?盛り込むべき項目を転職エージェントが紹介
iphoneのモックアップ画面

UIデザイナーのポートフォリオの作り方を解説!活用方法は?盛り込むべき項目を転職エージェントが紹介

Web開発に携わる職業は様々な種類がありますが、中でも比較的新しい職業として近年注目を浴びているのがUI/UXデザイナーです。この記事ではその内のUIデザイナーに着目し、その仕事内容やUIデザイナーになるためのポートフォリオの作り方などについて解説します。

  • twitter
  • facebook

ギークリーはIT・Web・ゲーム業界に特化した
転職エージェントです

まずは仕事タイプ診断をしてみる

UIデザイナーとは

 

webデザイン

 

UIとは「User Interface(ユーザーインターフェイス)」の略称です。

簡単にいうと「製品・サービスと人の接点」、つまり機械の操作パネルやパソコン・スマートフォンの画面などのことを指します。

Web開発においてはWebサイトそのもの、アプリではアプリの操作画面になります。

UIデザイナーはこうしたWebサイトやアプリの画面を、ユーザーが直感的に操作し易いようにユーザー目線でデザインする仕事です。

具体的には、テキストやレイアウトを整えたりメニューやボタンの色や配置などをターゲットに合わせて最適化していきます。

Webサイトやアプリなどをユーザー満足度の高いものにしていくことがUIデザイナーの役目です。

このため、UIデザイナーはユーザー目線の考え方や行動パターンを予想できる能力が必要とされる仕事とされています。

 

UIデザイナーの求人を紹介してもらう

 

 

UIデザイナーの仕事内容とUXデザイナー・Webデザイナーとの違い

 

スマホとデザイン画

 

Web開発に関わる仕事としてUIデザイナーと並んでよく耳にするのがUXデザイナーです。

また、Webデザイナーとの違いがよく分からない方も多いのではないでしょうか。

これら3つの仕事の違いについて説明します。

 

UIデザイナーの仕事内容

 

まず、UIデザイナーの仕事は先に述べた通り製品・サービス(主にWebサイトやアプリ)をユーザーにとって使い易くデザインすることです。

Webサイトに魅力的な写真を配置したりカラーリング・テキストを見易く設計することでユーザーがストレス無く操作できるように設計します。

大抵の場合、Web開発の工程においてはWebページの構成・操作性を設計するところまでがUIデザイナーの担当範囲になります。

 

UXデザイナーとの違い

 

UXは「User Experience(ユーザーエクスペリエンス)」の略です。

つまり、ユーザーが製品やサービスを使った際に得られる体験をデザインします。

UXデザイナーは、使った結果として楽しさ・満足感といった経験・体験を得られるように製品・サービス全体を設計することが仕事です。

ユーザーの使い易さを追求するUIはUXの1要素であり、UXデザイナーの方がUIデザイナーよりも業務の幅は広くなります。

 

Webデザイナーとの違い

 

WebデザイナーはWebサイト全体のデザインを担当します。

UI/UXデザイナーが機能性を重視したサイトデザインを行うのに対し、Webデザイナーは美しさ重視のデザインをおこないます。

Webデザイナーが行うビジュアルデザインはUIデザイナーの仕事にも含まれているので、UIデザイナーの方が業務の幅は広いといえます。

 

 

UIデザイナーに求められる経験・スキル

 

スマホとデザイン案

 

UIデザイナーになるためには美術大学を卒業していなければならないのかと思われるかもしれませんが、必ずしもその必要はありません。

もちろんデザインに関する知識・スキルがあった方が望ましいですが、UIデザイナーの主な仕事は情報の設計です。

極端な話、画面のデザイン自体はWebデザイナーなどに任せることができるので、経験・スキルとして重きを置かれるのは以下の点です。

 

知識・経験

 

・Webマーケティングの経験
・ブランド戦略策定の経験
・Web業界のトレンドに関する知識

 

スキル(ソフト面)

 

・ユーザー目線に立てるスキル
・柔軟性
・コミュニケーション能力

 

スキル(技術面)

 

・デザインソフト(Adobe Photoshop・Adobe Illustrator・Sketch)
・HTML・CSS・JavaScript
・マーケティングスキル(特にユーザー行動分析)

 

まずはキャリアの相談をしてみる

 

 

Webデザイン業界におけるポートフォリオとは

 

サインする手

 

ポートフォリオは、これまで関わってきたプロジェクトや制作物を集めた作品集で、クリエイターの就活には欠かせないツールです。

UIデザイナーに求められるものは美しさだけでなく、ユーザーの使用感・利便性を意識しているかといった点も重視されます。

Webデザイナーに求められるのは独自性のあるデザインである一方、UIデザイナーに求められるのは機能性をもったデザインです。

 

 

ポートフォリオを作成する上で押さえておくべきポイント

 

コーヒーとペン

 

冒頭で「ポートフォリオは作品集」と記載しましたが、転職におけるポートフォリオは単なる「作品を鑑賞するもの」ではいけません。

転職において、ポートフォリオは作品を通して応募者がどのような人物か見極めるために使われます。

従って、ポートフォリオに載せる作品は自信作を厳選するのではなく、以下の視点で選ぶと良いでしょう。

 

自身の仕事の幅をアピールする

 

対応可能な仕事の幅が広いUIデザイナーは企業から重宝されますし、就職先の幅も広がります。

自身の得意分野の作品のみを載せずに、掲載する作品にバラエティを出すことが大切です。

 

冒頭にはインパクトのある作品を持ってくる

 

冒頭の作品がありきたりなものだと、多忙な採用担当者は最後までポートフォリオに目を通してくれないかもしれません。

冒頭には思わず次の作品も見てみたくなるようなインパクトのある作品を載せると良いでしょう。

 

経緯の羅列ではなく、アピールポイントを明確にする

 

大切なのは完成されたプロジェクトの最終成果物よりもそのデザインに至った経緯における自身の考え方を伝えることです。

従ってそのデザインに至るまでの試行錯誤の経緯や、何故そのデザインを選択したかなど、重要なポイントを強調して大きく載せましょう。

単なる作品の経緯の羅列ではなく、その作品における自身の重要な局面を大きく掲載するなど、内容に強弱をつけることが重要です。

 

自身が担当した役割を明記する

 

採用後にポジションのミスマッチが起きないようにするために、そのプロジェクトの中で自分が担当した役割を明記することも大切です。

 

 

ポートフォリオの基本構成

 

本の見開き

 

単なる作品を羅列しただけのポートフォリオでは、採用担当者から見れば何を伝えたいのかよく分かりません。

時系列にこだわらず、自分が最もアピールしたいプロジェクトから先に見せるようにしましょう。

その上で以下の構成を参考にしてみて下さい。

 

・コンセプト文(サービスの概要・背景・クライアントニーズ・ターゲットユーザーなど)
・サイト名・URL
・作品の公開年月日
・プロジェクト規模(スタッフ構成・プロジェクト総人数など)
・プロジェクトの期間(スケジュールや実作業時間など)
・プロジェクトにおける自分の役割と担当範囲
・制作環境(サーバー環境や使用ツール)・使用言語
・成果(アクセス数・ダウンロード数・コンバージョン率など)

 

 

ポートフォリオに盛り込むと良い項目

 

机の上のタイプライター

 

上記の基本構成に加えて以下のような項目を盛り込むと、採用担当者が応募者の能力をより明確に知ることができるでしょう。

 

メインビジュアル・モックアップの画像

 

作品のサイトのメインビジュアル・モックアップ素材を載せることで、採用担当者が実際のサイトをイメージし易くなります。

 

画面遷移図や動作後のキャプチャ画面

 

サイトの中で特に注目して欲しい箇所については画面遷移図も載せ、自身のこだわりポイントを説明しましょう。

ページの動きをよりイメージし易くするため、動作後のキャプチャ画面を載せるのも有効です。

 

プロトタイプの画像

 

使用感について試行錯誤した経緯を見せるため、作品のプロトタイプの画像を載せることもおすすめです。

 

クライアントの要望と自身の対応

 

クライアントからどのような要望が課せられ、それに対してどのように対応したかという経緯を載せることもアピールに繋がります。

 

 

企業が見ているポイント

 

ネクタイをしめる手

 

先述の通り、UIデザイナーの転職において採用担当者が見たいのは応募者の作品ではありません。

採用担当者がポートフォリオを通して見ているのはあくまで応募者の能力考え方です。

ポートフォリオを通して採用担当者が見ている応募者の能力をまとめると以下の通りです。

・プロデュース能力
・ユーザー視点で考える能力
・対応できる仕事の幅

 

上記のような能力をポートフォリオで表現するにはどうすれば良いか見ていきましょう。

 

プロデュース能力

 

UIデザイナーはUIをデザインするだけでなく、各担当者をまとめてサイト全体のディレクションまで任されることもあります。

その際に必要となってくるのは、一つ一つのデザインのディテールよりも関係者を巻き込んでサイト全体を最適化できるプロデュース能力です。

このプロデュース能力を見極めるためにポートフォリオでは

 

・ポートフォリオが一冊の本として完成しているか
・目次や見出しに統一感があるか

 

といった点が見られるでしょう。

 

ユーザー視点で考える能力

 

ユーザーの使い易さを追求するUIデザイナーに一番大事な能力は「ユーザー視点で考える能力」です。

感性のみで作らずに、常にポートフォリオを手に取ってくれた人の視点を意識して作りましょう。

ユーザー視点で見易く使い易いWebサイトをデザインするように、ポートフォリオも見る人に分かり易く美しいデザインである必要があります。

一つ一つのページのフォントや情報の載せ方などを工夫し、丁寧に作ることが大切です。

 

対応できる仕事の幅

 

UIデザイナーとして企業で働くからには自分が作りたいものだけを作っていれば良いというわけにはいきません。

企業は多様な要望に応えられる人材を求めています。

先述の通り、ポートフォリオには自身のお気に入りの作品ばかりを載せずに多様な作風・表現に対応できることをアピールしましょう。

 

キャリアパス診断を使ってキャリアの可能性を見ることもおすすめ

 

株式会社ギークリーでは、簡単な質問に答えるだけでChatGPTがキャリアについて診断するコンテンツを展開しております。

将来描ける可能性のあるキャリアについて、職種・年収・要求されるスキルの項目から知ることが出来る、完全無料で利用可能な診断コンテンツです。

診断結果の閲覧に加え、プロのコンサルタントとの面談も無料で行えるため、キャリアについてお悩みをお持ちの方はぜひ活用してみてください。以下のボタンより診断が行えます。

 

【簡単3分】キャリアパス診断をしてみる

 

 

まとめ

 

スマホアプリ画面

 

今回はUIデザイナーの転職におけるポートフォリオに求められるポイントをご紹介しました。

単なる作品集ではなく、応募者の能力や考え方を表現するツールであることが理解できれば、より効果的なものを作ることができるでしょう。

大切なのは最終成果物の美しさ・独創性よりも、そのデザインに至った過程です。

作品を仕上げるまでの経緯や、自身の試行錯誤の中で特にアピールしたい点を採用担当者に分かり易く伝えられることが大切です。

以上の点を踏まえ、転職成功へ向けてより完成度の高いポートフォリオを目指しましょう。

 

【あわせて読みたい】基本的なポートフォリオのつくり方を知りたい方はこちら!

 

まずはキャリアの相談をしてみる

 

この記事の監修者

ギークリーメディア編集部

主にIT・Web・ゲーム業界の転職事情に関する有益な情報を発信するメディアの編集部です。転職者であれば転職市場や選考での対策、企業の採用担当者様であればIT人材の流れ等、「IT業界に携わる転職・採用」の事情を提供していきます。

iphoneのモックアップ画面

この記事が気に入った場合は、
SNSでシェアをお願いします

あわせて読みたい関連記事

この記事を読んでいる人におすすめの記事