美しくプロフェッショナルなオンラインポートフォリオを作成します。コーディングやwebデザインの知識は必要ありません。(所要時間3分)チュートリアルも参照して実際にお試しください。
「Typekit」の名称は「Adobe Fonts」に変わりました。
はじめに
Creative Cloudメンバーは、Adobe Portfolioを使用して、美しいビジュアルのレジュメを10分以内で作成できます。
このチュートリアルでは、コンテンツに合わせてデザイン済みレイアウトを選び、画像、ビデオ、テキスト、カラー、フォントを使ってカスタマイズする方法を紹介します。Creative Cloudの一部として、Adobe PortfolioをBehanceアカウントに同期し、Creative CloudファイルおよびPhotoshop Lightroomの写真コレクションからシームレスにコンテンツを読み込むことができます。
ポートフォリオの作成を開始するには、https://www.myportfolio.com/にアクセスします。
レイアウトの選択
レイアウトページに移動します。ポートフォリオのレイアウトを選ぶ際は、コンテンツの種類に適したものを選びます。
例えば、写真を見せる場合は、MatthiasやLinaなど、画像を強調するレイアウトを選びます。
また、例えば広告代理店としてコンセプトや広告文などの文章と、テキスト、画像、ビデオを合わせて仕上げた広告などのキャンペーンプロジェクトを見せることが目的である場合、Thomasレイアウトを選ぶと良いでしょう。各キャンペーンの雰囲気を伝えながら、広告文と画像を表示するのに適しているためです。
レイアウトを決めたら、「このテーマを使用」をクリックしてテーマを選択します。後でいつでもデザインのカスタマイズやレイアウト変更は可能です。
プロジェクトの追加
編集モードで、ツールバーのプラス(+)アイコンをクリックし、「プロジェクト」を選択します。「コンテンツを追加」画面で、プロジェクトの名前を入力し、「プロジェクトを作成」をクリックします。
メディアを追加します。コンピューターからファイルをアップロードし、ビデオの埋め込みコード、Creative CloudファイルやLightroomの写真コレクションからコンテンツを読み込みます。
プロジェクトに追加したメディアを変更するには、マウスを要素の上に置き、横の鉛筆アイコンをクリックします。表示されたツールバーを使って編集、並べ替え、または削除することができます。
完了したら、ページ右側に表示されたメニューの下部にある「続行」をクリックします。プロジェクトのカバー画像を選択し、プロジェクトの情報を入力します。これらのメタデータを追加すると、他の人が作品を見つけやすくなったり、Behanceアカウントに同期したりすることができます。
ヒント:Behanceアカウントを持っている場合は、BehanceとAdobe Portfolioとの間でコンテンツが自動的に同期されます。Behanceにプロジェクトを追加すると、Adobe Portfolioに表示されます。同様に、Behanceアカウントに自動的に表示されるようにAdobe Portfolioプロジェクトを設定できます。
レイアウトのカスタマイズ
コンテンツのフォント、カラー、間隔などを選択してカスタマイズできます。プロジェクトページで、「ページコンテンツを編集」をクリックし、右に表示されたメニューから「グローバルスタイルを編集」をクリックすると、ポートフォリオの要素について様々なパラメーターを試すことができます。
Creative Cloudメンバーは、Adobe PortfolioからAdobe Typekitを使って、数百もの高品質なフォントから選ぶことができます。フォントメニューで「Webフォントを管理」をクリックすると、フォントが表示されます。サムネールをクリックし、「フォントを追加」をクリックしてから「完了」をクリックすると、フォントメニューにフォントが追加されます。
Typekitから追加したフォントは、Adobe Portfolio全体で使用できるようになります。
連絡先ページの作成
連絡先ページまたは概要ページを追加するには、ツールバーでプラス(+)アイコンをクリックし、「カスタムページを作成」を選択します。新規ページ画面でページ名を入力し、ページを作成をクリックします。
エディターで「テキストを追加」をクリックし、自身に関する簡単な説明を入力します。テキストをハイライトしてスタイルを編集したり、ハイパーリンクを追加したりします。電子メールアドレスや電話番号などの連絡先を記入してください。「ページを更新」をクリックしてページを保存します。
ページを追加すると、ポートフォリオの右上にあるナビゲーション領域に自動的に表示されます。
ソーシャルメディアへの接続
ポートフォリオのナビゲーション領域にマウスを置き、鉛筆アイコンをクリックします。「カスタマイズ」を選択します。ソーシャルプロフィールを選択するには、「ソーシャルプロフィール」タブをクリックして、追加するソーシャルメディアのスイッチボタンをオンにします。ソーシャルメディアのURLを入力します。
「ソーシャルアイコンスタイル」タブをクリックし、ソーシャルメディアアイコンの外観をカスタマイズします。アイコンのスタイル、カラー、不透明度、サイズ、位置などを選択できます。
プレビューと公開
ページ下部の「プレビュー」をクリックし、公開する前にサイトの最終チェックをおこないます。デバイスアイコンをクリックし、タブレットやスマートフォン、縦置きや横置きで、レイアウトがどのように見えるかを確認します。
ページやプロジェクトをクリックし、サイトをプレビューします。完了したら、「編集に戻る」をクリックします。
「サイトを公開」ボタンをクリックすれば完了です。
Adobe Portfolioの作成について詳しくは、よくある質問(英語のみ)をご覧ください。カスタムドメイン名を購入している場合は、Adobe Portfolioでのカスタムドメイン名の使い方を知ることができます。