サービスHOMEフリーランス基礎知識フリーランス全般フリーランス必見!イケてるポートフォリオ作成ツール「RESUME」とは?こんにちは、フリーランスエンジニア兼テックライターのしろ(@siro3460)です。皆さんは、サイト制作の実績を何かにまとめていますか?「作ったサイトのURLはまとめているけど、見やすいポートフォリオは用意していない・・・」という方も多いのではないでしょうか。ポートフォリオがあると、営業するときに実績として見せやすくなったり、同じようなサイトを作るときに過去実績を探しやすくなるのでとても便利です。制作過程を含めてポートフォリオ化できていれば、技術力を示すこともできます。RESUMEの機能を最大限活かして、ポートフォリオを育てようRESUMEとははじめに、RESUME(レジュメ)について簡単に解説します。RESUMEとは、年間3000万PV超えのメディア「サルワカ」、美しいデザインのWordPressテーマ「SANGO」の制作者catnose(@catnose99)さんが作ったポートフォリオ作成サービスです。catnoseさんは、以下のようにRESUMEについて解説しています。RESUME(レジュメ)は、誰もが簡単にWebポートフォリオを作り、育てることができる場所です。プロジェクトを成功に導いたストーリー、社内で効率化を実現した方法、勉強会で使ったスライド、ボツになった企画書...、小さな成果や工夫も、惜しみなく書き残しましょう。その積み重ねがあなたの強力な履歴書となるはずです。出典:https://www.resume.id/media_kitサルワカ、SANGOのように美しいデザインのポートフォリオが簡単に作れるので、とてもおすすめのサービスです。次に、RESUMEの機能・特徴について解説します。RESUMEには、大きく分けて2つの機能があります。ResumeWorksResumeは履歴書を残せる機能で、Worksは実績ページが作れる機能です。文字のページで実績を残すことができます。そのため、実績だけでなく制作過程を残すことができるのが最大の特徴です。制作者のcatnoseさんも、以下のように解説されています。多くのポートフォリオは、成果物の画像や動画などのビジュアルがメインで、プロジェクトの背景やストーリーは詳しく書かれていない。そのプロジェクトを実施したストーリーや創意工夫こそ、自分の有能さを表すと思うのだ。noteRESUMEでポートフォリオをまとめることで、自分の実力を余すことなく見せることができるのです。営業に使ったり、転職活動のときの実力を示すために使ったり、過去実績と似ているプロジェクトを請負う時も強力な武器となります。次に、RESUMEの使い方について解説します。アカウント作成Resumeの作成Worksの作成の流れで解説していきますね。アカウントの作成まずは、アカウントを作る手順について解説します。詳細プロフィールを入力して「この内容ではじめる」をクリックこれで、アカウントの作成が完了です。完了すると、次のようにページが作られます。これだけだとページがまっさらな状態で簡単な自己紹介文しかないため、自分の履歴書(Resume)を作ります。プロフィールを更新したい方へログイン後にプロフィールを変更したいときは、以下の手順で変更できます。次に、Resume機能の使い方について解説します。Resume機能には、大きく分けて次の5つの項目があります。Links自由記述スペースそれぞれ機能概要、使い方を詳しく解説しますね。Resumeの新規作成まず、Resumeの新規作成方法について解説します。Resumeタブを選択し、「+Resumeを作成する」をクリッククリックすると、次のようにResume編集ページが開きます。ここからは、上から順に1つずつ登録をしていきます。Skills次に、自分のスキルを「Skills」に登録していきます。「+」ボタンをクリックスキル名・レベルを変更して「追加する」ボタンをクリックスキルの入力項目は、英字で文字を途中まで打つと候補が出てきます。候補になかった場合も登録ができるので、持っているスキルをどんどん追加していけばOKです。Skillsの完成イメージ:Experience次に、経歴をExperienceに書いていきます。入力して「追加する」をクリック経歴をいくつか登録すると、次のように時系列で経歴が表示されます。Writing執筆歴があれば、Writingに登録をします。タイトルの一覧が表示されます。Linksに設定します。「その他のリンクを追加」をクリックボタン名、URL、イメージカラーを設定し、「追加する」をクリックこれで設定が完了です。設定が終わると、次のようにボタンが追加されます。自由記述スペース最後に、自由記述スペースを登録します。自由記述の白紙を作成する」をクリックして自由記述スペースを追加エディタを使って自由に書いていく基本的に何を書いてもOKですが、自由記述スペースはResumeの中で唯一エディターを使える機能です。リンク、ボタンなどが使えるため、凝った使い方をすることもできます。プロフィールの詳細Worksの実績一覧ページ今注力していることなどを載せておくと良いかもしれませんね。全ての設定が終わったら、画面左上にある「編集終了」をクリックします。これで設定は完了です。ちなみにResumeを編集したいときは、Skillsの右側にある「Resumeの編集」をクリックすれば、編集モードに変更できます。次に、Works機能の使い方について解説します。Worksは実績ページが作れる機能なので、登録の流れを解説しますね。Workを作成する」をクリックします。クリックすると、次のように新規にWorkページが作られます。次に、カバー写真、タイトル、プロジェクトの要約を入力します。ここまでできたら、プロジェクトの詳細を書いていきます。エディタ-の使い方がわからない方もいると思うので、詳しく解説しますね。「+」メニューでできること文字を入力していない行を選択している場合は、左側に「+」アイコンが表示されます。「+」アイコンをクリックすると、次のように4つのメニューが表示されます。それぞれ使い方をイメージしやすいように、使ったときのイメージ画像を用意しました。以下を参考に、使っていけばOKです。文字を装飾する方法もあります。入力した文字を選択すると、次のようにメニューが出てきます。こちらも、使ったときのイメージ画像を用意しました。スタイルリンクだけ少し特殊なので、使い方を補足しますね。テキストを選択してリンクを設定すると、次のようにメニューが出てきます。右のメニューをクリックし、表示したいボタンデザインを選択すればボタン化することができます。最後に、RESUMEで実績を上手く見せるためのおすすめの使い方を紹介します。結論から言うと、「実績一覧ページ」+「制作過程・コンセプト・使用技術などの詳細ページ」を用意することがおすすめです。実績ページのURL実績の詳細ページボタンを1セットにして、実績数分書いていくイメージです。実績一覧ページのイメージ:視覚的に実績を一覧で見れるので、どんなサイトが作れるか伝わりやすいですよね。「実績詳細ページ」ボタンをクリックしたときに詳細ページを見れるようにしておけば、詳しい技術力を知りたい方の要望も満たすことができます。実績詳細ページのイメージ:Workの公開設定では、「Work一覧の先頭に表示」機能があるので、制作実績一覧ページをWorksの上位に表示させておくことができます。実績一覧が見てもらいやすくなるので、おすすめです。実績が増えてきたら、ジャンルごとに実績一覧ページを分けてみるのも良いかもしれませんね。RESUMEの機能を最大限活かして、ポートフォリオを育てよう今回は、簡単に美しいポートフォリオを作成できるWebサービス「RESUME」の概要・使い方について解説しました。美しいデザインのポートフォリオが簡単に作れるので、RESUMEはとても便利です。いう要望を持っている方向けに、週に1度リアルなお役立ち情報を配信しています。「フクザツなことをカンタンに」がモットーのテクニカルライター。IT企業で約5年のエンジニア経験を経て、フリーランスとして独立。フリーランス2年目で、テクニカルライターをメインに活動中。現在は、数社のメディアで記事を執筆しつつ、完全オンラインで学べるテクニカルライターレッスンを開催している。2019.08.07こんにちは!プログラマーのとだこうきです。2019.06.08フリーランスとして仕事を始めると、会社勤めの場合には総務や事務方が対応している事務作業を自分でおこなう必要が出てきます。2019.06.23この記事ではこういった疑問にお答えします。USイメージキャラクター『Freena』フリーランスの羅針盤となるメディアサイト『東京フリーランス』。フリーランスの皆さんに役立つコンテンツを配信しています。