今回は、ChatGPTの質問のみでどれ位のHPのコーディングができるのか検証してみました。  「ChatGPTでコーディングの業務短縮できるのか知りたい...。」 　Chatgptのコーディングの質がどれくらいのレベルなのか知りたい。」 本記事を読めば、こちらの疑問が解決できるので、是非最後までお読みください。 ChatGPTコーディング検証の条件 今回のコーディングの条件はこちらです。 HPのデザインが完成している段階から始める。(px数や色も完成している。) コーディングの知識はほぼゼロでChatGPTの説明のみで作成する。 少しのコードの調節はアリとする。 HP制作のコーディング業務を全て任せる感じですね。 今回作成するコーディングのデザインはこちら。 それでは、実際に検証していきます。 検証開始 1.要件定義の説明 ChatGPTコーディングですが、まずつくりたいHPの要件定義を伝えました。 要件定義で伝えた内容 HPのテーマカラー、サブカラー HPデザインの特徴（シンプルでみやすいデザイン) コーディング言語の種類 どのページを作りたいのか(TOP ) ＜質問①＞ サイトの内容はある大学のHPで、トップページを作成します。HPデザインのイメージはこちらです。テーマカラーは青色、ハンバーガーメニューや詳細ボタンの色で使います。そして、サブカラーはライトブルーと白色でこちらは、HPの背景色に使います。デザインの装飾全体的に、シンプルで見やすいデザインに仕上げてください。使いたいコードはHTML、CSS、JavaScript、Slikのアプリを導入したスライダーも入れる。今回は１ページのみで大丈夫です。まずはヘッダーから作成します。 ＜ChatGPTの回答①＞ ＜コピペしたHP①＞ 結構しっかり、表示されいます！ しかし、ヘッダーのナビゲーションは、メインとサブ二段作りたいので次はその指示を行います。 2.サブナビゲーションと、メインナビゲーションを作成 ＜質問②＞ meinナビゲーションを黒色に表示させてください。またメインナビゲーションの上に、サブナビゲーションを表示させましょう。 ＜ChatGPTの回答＞ ＜コピペしたHP ②＞ なるほど。サブナビゲーションの表示されたけど、一列に並んでいますね。ここで上下の余白も意識してさらに細かく指示をしてみます。 余白の指示の仕方 ある視点から何ピクセル空いているのかを伝えるといいです。 ＜具体例＞HPの最上部からサブナビゲーションの間の余白を16pxにしてください 配置指示で良く使う用語 　　　　　　　　　 　　　　　　　　　　　　　　　 ＜質問③＞ それでは、サブナビゲーションとメインナビゲーションの配置を移動させます。まず、サブナビゲーションが、メインナビゲーションの上に来るように設置してください。ヘッダーの余白の説明。①ページ最上部からサブナビゲーションまでの余白を16pxにする。サブナビのフォントサイズは14px②サブナビゲーションとメインナビゲーションの間の余白26px③メインナビゲーションと、ヘッダー最上部までの余白を16pxにする。メインナビゲーションのフォントサイズは、14pxです。また、サブナビゲーションと、メインナビゲーションはdivで囲み、HPの右端と、各ナビゲーション右端との間に120pxの余白を開けること。 ＜コピペしたHP③＞ 指示通り、意図する配置に並べることができました。つまり文字やブロックの配置を指示するときは、上下左右の余白を指摘するといいですね。 3.大学のロゴの配置 次は、大学名の部分を、ロゴに変換します。 このロゴの変換が、中々苦労しました...。何が起きたのかというと、 ＜質問④＞ それでは次に、 h1の大学名の部分の何画像を読み込ませたいです。画像サイズは80px80pxで余白は今のままでいいです。 修正してください。 このように質問し質問に出てきたものをコピペすると、ロゴと、ナビゲーションが中央寄ってしまいました。 ＜コピペしたHP④＞ そこで、HPの左端と画像の間の余白の間が80pxになるよう修正してください。と指示すると、ナビゲーションも左に引っ付いてしまいました。 ＜コピペしたHP⑤＞ この部分で、5回ほど修正してようやく、ロゴを左端、ナビゲーションを右側に配置できました。 ＜質問文⑥＞ display:flexで２つの要素を両端に持っていきつつ、右端、左端の余白は開ける配置にできますか？ ＜コピペしたHP⑥＞ 4.ハンバーガーメニューの作成 次は、ハンバーガーメニューを作ります。ここの部分でも余白を調節する指示を行いながら作成します。 ＜質問例⑦＞ ありがとうございます。 それでは、次にヘッダーの右端にとHPの最上部に余白なしで収め て縦80px、横80pxの、ハンバーガーメニューを作りたいです。背景色は黒色で、装飾は、 太さ2px長さ、 60pxの3本の白い線が、 縦幅、 横幅均等に並ぶイ メージです src="./assets/images/common/logo.png" alt="大学名"> ＜解答例⑦＞このような回答が出てきて、、、  ＜コピペしたHP⑥＞ このようにHPの右端に、配置することができました。 この要領で、ハンバーガーメニューの下に、お問合せボタンもつけて、ヘッダーにMVをつけるとを変える指示を行うと。 【ChatGPTで作成したのサイト】 【目標のHPサイト】 この様にボタンの細かな装飾は、できなかったものの、ほぼデザイン通りに、文字と画像、ボタンを配置することができました。 ChatGPTコーディングの特徴 実際に、ノーコードでヘッダーを作成し、コーディングを行うコツが２点がわかりました。 ①ボタンやナビゲーションの文字など、1つずつ指示を行うとコーディングできる。②各要素に指示を行うときは、こちらの5点を捉えて指示すると正確にコードが書ける。 上下の余白　（上の要素との間の余白は30px空ける。）
　 左右の余白　（HPの中央に配置する。) フォントサイズ 背景色 ボタンのサイズを指示する。 この2点を意識してコーディングを行うとこの様なデザインも作成できます。 【メインの学科セクション】 【メインの入試セクション】 まとめ ChatGPTのコーディングで、初めは、意図する位置に移動させることができず苦戦していたのですが、px単位で細かく配置やサイズ、カラーを指示することで知識がなくても正確なコーディングができます。 このコーディングをWeb制作で活かすならば、下記の3点が出来ると思います。 コーディングのたたき台を作成する。 分からないコードの作成の補助 コーディングの知識のないディレクターチームもHP制作（HPの動きについてお客様との認識のズレを無くす為） 以上の様に、ジェイラインでは、Web制作の最新技術も応用しながら、Web制作サービスを提供しております。Web制作にご興味のある方はこちらからお問い合わせください。

こんにちは。Webマーケターの岡本です。 現在は、ChatGPTの分析や、SNS運用、分析、広告運用などの業務をおこなっています。 Webマーケターとして、販売戦略の立案や、SNSの分析を行うとなると、その分野の、ビジネス書を、大量にインプットしないといけなくなります。本日はその過程で身につけた、速読術6つを紹介します。 速読術①本を読む前に、その本の要約記事や動画を見る。 こちらは、本を読む前に、ある程度著者が何を伝えたいのかや、本の全体の構成が、わかる為、非常に読みやすくなります。 映画で、ネタバレしているような感じです。 今の時代だとYouTubeで本の要約YouTuberがわかりやすく解説している動画が沢山あります。もし見つかったらラッキーと思い是非見てから本を読んでください。 速読術②本のあらすじ、目次を読解する。 こちらを行う理由は、本の構造上、1ページ目に、著者の伝えたい事が、要約されているケースが多いためです。 また、特に本の１ページ目は立ち読み対策で、著者が特に力を入れて執筆する部分でもあるので、あらすじはしっかり読むといいでしょう。 また目次を読み込む理由は、２つあります。  1つ目、本全体のどの分野を掘り下げている語っているがわかる為。  本を読み進める前に、次にどのような内容が紹介されるのかが、予め予測しながら読み進める事ができるので速読につながります。 ２つ目、読む必要のない部分を予め捨てる事ができる為。 ビジネス書は特に情報量が多いので、読書では、取捨選択が重要という事です。私自身も、ビジネス書をたくさん読んでいますが、全て読み切らず今必要なポイントのみ読むようにしています。 目次を読んで興味を持った所から読み進めていきましょう。 速読術③具体例は全て飛ばす こちらは、ビジネス書の決まり文句として、ある主張をしたいときに、説得力を持たせるために、例A、例B、例Cというように具体例を多用する為です。主張がわかったら、全て飛ばしてください。 反対に「つまり〜」という助詞は、主張をまとめる時に、使います。今後読書では「つまり」という文言を追いかけて著者の主張をつかみましょう。 また、ビジネス書の文言で、難しい言い回しの単語も1回目の読書で覚える必要はないので、ざっくりこんな事あったなーぐらいで読み進めていきましょう。 速読術④本で学びになった事は付箋をはる。 こちらを行う理由は、重要なポイントを本を閉じてもわかるようにするためです。 ①~③を意識すると一気に本を読み進めれるのですが、その分、重要なポイントを見失いがちになります。 ですので、文章を読んだときに、心を動かされたり、自分の課題に近い内容に付箋を貼りましょう。 大体、１ページを読み終えると初めの付箋をつけた部分の内容はほぼ忘れているので、2回目見返す時は、付箋をつけた部分から読み返し反復し記憶を定着化します。 速読術⑤読み始めて自分に合わない本は読むのをやめる。 こちらは、全ての本が、自分の課題を解決する答えを持っているとは限らないので、ある程度読み始めて、自分が知りたい情報が得られないと感じたらすぐに読むのを止めても構わないという事です。 私自身、読み始めたが、数ページで離脱した本も沢山あります。ですので、間違えたら次の本を買うぐらいのペースでポンポン読み進めていきましょう。 まとめ 下記の５つのポイントを押さえると速読がしやすくなります。 ①本を読む前に、その本の要約記事や動画を見る。 ②本のあらすじ、目次を読解する。 ③具体例は全て飛ばす。 ④本の中で学びになった箇所に付箋を貼る。 ⑤目次を見て自分に合わなければすぐ読むのをやめる。 皆さんも、こちらの投稿の中でどちらか、1つでもいいので試してみましょう。 ジェイライン株式会社では、採用支援と、採用サイト制作を30年行い採用ブランディングに特化した提案をおこなっています。 支援実績は、10,000社以上、採用サイト制作1,000社以上。 採用サイト制作で、お悩みの方はこちらのリンクからお問合せください。

2023年11月6日（米国時間）、OpenAIは、特定の目的のために「ChatGPT」をカスタムできる「GPTs」を発表しました。「GPTs」はなんと、カスタマイズして個人で販売できるそうで、AIは進化し続けています。 本日は、ChatGPTで、企業の特徴を調べさせる方法について紹介します。例えば企業のビジネスモデルが理解できなかったり、営業までの準備に使えます。 ChatGPTで調査分析を行う手順 ChatGPTで調査分析を行う手順は、下記の4つです。 手順①ChatGPT4にWeb pilotのプラグインを付け加える。 手順②調べたい企業の【場所】【職種】【企業名】を記述し、URLを読み取って調べてほしいということを先に伝えておく。 手順③調べてほしい内容を提示する。 手順④URLを貼り付ける。（企業のトップページを貼るといいです。） それでは、具体的に説明していきます。 手順①ChatGPT4にWebPilotのプラグインを付け加える 今回のChatGPTの活用方法では、WebPilotというプラグインを使うので、まずそちらの設定をオンにして行います。 プラグインの設定について、詳しくは下記の記事からご確認ください。 https://media.jlweb.jp/archive/%e8%a8%98%e4%ba%8b%e3%82%bf%e3%82%a4%e3%83%88%e3%83%ab%e3%81%8c%e5%85%a5%e3%82%8a%e3%81%be%e3%81%99%e3%80%82%e8%a8%98%e4%ba%8b%e3%82%bf%e3%82%a4%e3%83%88%e3%83%ab%e3%81%8c%e5%85%a5%e3%82%8a-15 手順②調べたい企業の場所、職種と企業名を記述し調べてほしい事を伝える。URLを読み取る事も伝える 今回の質問で「何をしたいのか」を説明します。 例えば、「ジェイ・ラインという会社のビジネスモデルを知りたい」などです。 ここで注意していただきたいのが、その会社の職種も付け加える事です。同一の名前がある場合は別の企業の調査を拾ってきてしまうので、職種までしっかり説明しましょう。 ＜具体的＞ 大阪に本社がありweb制作を行ってるジェイライン株式会社を、下記のURLを読み取り調べて下さい。 手順③調べてほしい内容を提示する 手順②でChatGPTに説明してほしい事を伝えたら、どんな特徴を調べてほしいのか箇条書きでまとめます。 【プロンプト例】 ＜ChatGPTに調査してほしい項目＞会社概要主にどのような商品を販売しているのか？企業理念ビジネスモデル市場動向 手順④：調べたい企業HPのURLを貼り付ける 最後に、調べたい企業サイトのURLを貼り付けたら完了です。 ※会社概要が記載されているページのURLを貼り付けるとより調査しやすくなります。 具体的な質問と回答例 ＜質問例＞ 大阪に本社がありweb制作を行ってるジェイライン株式会社を、下記のURLを読み取り調べて下さい。＜調べたい項目＞会社概要事業内容主にどのような商品を販売しているのか？企業理念ビジネスモデル＜企業URL＞http://www.sakamotozoki.co.jp/katanuki.html ＜回答例＞ まとめ:ChatGPTで調査分析を行う時は、丁寧に説明することが大事 企業の調査分析を行う手順は４つ 手順①chatgpt4にWebPilotのプラグインを付け加える。 手順②調べたい企業の場所、職種と企業名を記述し調べてほしい事を伝える。 手順③調べてほしい内容を提示する。 手順④URLを貼り付ける。 このように、ジェイ・ラインでは最新のIT技術を活用しながらHP制作を行っております。 HP制作にご興味のある方は、こちらからお問合せください。

ChatGPTで調査分析ができたらな。 企画を考える時間をできる限り短縮したい。 調査の分析を行う時のポイントがしりたい。 このような悩みを抱えている営業マン、マーケターは多いでしょう。本日はこちらの疑問に答えます。 ChatGPTで企業分析を行う3つの手順 ChatGPTのキャッチコピーの作成手順は下記の3つです。 手順①：ChatGPTで何をしたいのか伝える 手順②：調査したいものの現状を丁寧に説明する。 手順③：調査したい内容を伝える。 具体的に説明していきます。 手順①：ChatGPTで何をしたいのか伝える まずは、自分は、ChatGPTで何をしたいのか？」を伝えましょう。 今回ですと、「調査分析を行ってほしい。」ですね。そうする事で、ChatGPTが何を答えたらいいのか方向性がしっかりします。 手順②：調査したいモノの現状を丁寧に説明する。 次に調査してほしいモノの概要を丁寧に説明します。 理由は、調査するものの指標が少ないと十分に調査してくれない為です。 調査分析ではこの②番が最も重要で、この説明が不足していると、ChatGPTは十分な判断をしてくれません。 「書きすぎでしょ！」と思うほど丁寧に説明する方が解答の精度が段違いに上がります。 ＜ChatGPTに説明すべき項目＞企業の特徴や、売上高、配当金、指標、財務、ターゲット層、キャッシュフロー、従業員数、強み、弱み、サービスの単価等 例えば、このように書きます。 手順③：調査したい内容を伝える。 手順②まで書けた方お疲れ様です。 最後は、調査したい項目を説明します。 ChatGPTの調査分析では、こちらの調査ができます。 企業の5年後のチャンスと、課題 業界の市場動向や SWTO分析 顧客層 顧客ニーズ 競合他社 ペルソナ分析 質問文と回答の具体例 以上の点を踏まえて質問を行うと、このような回答になります。 【質問例】 私は、企業分析を行いたいです。企業の特徴はこちらです。【特徴】30年Web以上制作に携わってきましたジェイ・ラインが運営するインサート代行サービス です。 これまでよくくかった料金体系やレギュレーションについてシンプルなサービスと しました。 あれば、シード以外にも、企画、デザイン、 運用・保守の対応や、 全業務を含 めたワンストップでの対応も可能です。【顧客】・HP制作会社 毎月コンスタントになり大量のHP製作を行う為・中小企業 →中小企業はHP制作に充てられる予算が少なくかつ品質を確保したHP製作【サービスの強み】低価格: これまでに制作に関するアドバイスを行うことで、慎重なコスト削減を行うこと で低価格なサービスメニューを実現しました。高品質 内製のテクニカルディレクターが対応するため、 例えば更新性を担保したコード 設計なども可能です。 納品前にはテスターによる体制チェックを徹底し、万全な 状態で納品いたしましたスピーディー : 社内にディレクター、フロントエンジニアが常駐いるため、 お問い合わせの 対応、 またご依頼から納品までスピーディーな対応が可能です。・シンプルな料金体系。 切り替え・アコーディオン・コンテンツ モーダルスムースス クロール・CMS編集・緊急対応 Webサイトの企画提案 Webデザイン・運用・保守作【業料金形態】トップページ 11,000円 9,900円 8,800円 下層ページ 5,500円 4,950円 4,400円【従業員数】日本20人、 ベトナム7人の16人体制＜調査してほしい内容＞上記の企業の、SWOT分析を行ってください。 【回答例】 ChatGPTで質の高い調査分析を行うためのコツ 上記の手順を踏まえるとChatGPTでキャッチコピーは作成できるのですが、より精度を上げるためのコツも存在します。 コツ1.回答で気になった部分をさらに詳しく解説させる １度目の調査分析の回答から気になった情報を深掘りすることで下記の内容を追加で調査できます。 良いアイディアを取り上げこの解答を1000字でより詳しく解説させたり。 その内容の、具体的な事例まで考えさせる。 市場調査、SWTO分析を行った上で、売上を上昇させるアイディアを練る。 コツ2. アイディアを何度も改善修正させる。 今までの説明を聞いて、ChatGPT「すごい！」と思ったかもしれませんが、ChatGPTの回答で結構な確率で、あまり良いアイディアが得られない事もあります。 ここで、諦めず、「別のアイディアを5つ考えてください」、「さらに世間がまだ聞いた事がない驚くアイディアを考えてください」と何度もアイディアをブレストさせます。 すると、何回かの修正の中にいいアイディアが出てきます。 コツ3.ChatGPTの回答でよく分からない点をわかりやすく解説させる。 何回も調査分析を行っていると、ビジネスモデルや収益の流れ、取引先の関係などがわからなくなる場合があります。 ここで、再度質問を行うと、図や言葉でわかりやすく説明してくれます。 ※図で説明させるには、「Show me」というプラグインの登録が必要になります。 詳しくはこちらから https://media.jlweb.jp/archive/%e8%a8%98%e4%ba%8b%e3%82%bf%e3%82%a4%e3%83%88%e3%83%ab%e3%81%8c%e5%85%a5%e3%82%8a%e3%81%be%e3%81%99%e3%80%82%e8%a8%98%e4%ba%8b%e3%82%bf%e3%82%a4%e3%83%88%e3%83%ab%e3%81%8c%e5%85%a5%e3%82%8a-15 ChatGPTの調査分析でよく起きる失敗例 調査分析でよく起きる失敗例は、調査したいモノまとめる時に括弧＜　＞をつけない事です。 手順②の調査したいモノの現状を丁寧に説明する。という内容の注意点です。 ここで、情報をまとめるときに、括弧をつけたり、記号をつけないと、指示内容と間違えて読み取る場合があります。 まとめ:ChatGPTで調査分析を行う時は、現状の説明が特に大事 調査分析の手順は3つ 手順①：ChatGPTで何をしたいのか伝える 手順②：調査したいものの現状を丁寧に説明する。 手順③：調査したい内容を伝える。 ジェイラインはこのように、最新のIT技術を活用しながら採用サイト制作を行っております。 採用サイト制作にご興味のある方は、こちらからお問合せください。

採用に特化したAI について知りたい人事担当者におすすめの記事です。 本記事では、アメリカで開発された、採用に特化したAIの特徴と、それがAIが採用業界をどのように影響をもたらすのかについて解説します。 PeopleGPTとは？ アメリカのスタートアップ企業Juicebox社がリリースした採用支援サービスです。企業理念としては、高額な人材紹介量をゼロにしたいというもので、手頃な月額課金型のスカウトサービスを提供しています。 料金設定はこんな感じです。 毎月請求毎年請求（20％オフ）無料：＄0無料：＄０プロ：＄99（¥15,000）プロ. ：$79（¥10,507）チーム：＄249(¥37,372) チーム：$199(¥29871)企業　：＄要相談   企業　：＄要相談    PeopleGPTの概要 サービスの特徴は、企業が求める人材を、求職サービスから抽出し、スカウトメールを送るというものです。 また、求める人材の抽出の精度は、AIが学習する事で上昇します。 これまでの採用活動 これまでの採用活動は、マイナビや、ビズリーチのように、企業と求職者がそれぞれ情報を提示し、ニーズが合致すればマッチングするというものでした。そしてその企業と求職者をつなげるのは人力で採用戦略を立てて、求める人材が来る様な採用活動を行っていました。 PeopleGPTの採用活動 PeopleGPTが登場すると、より効率的に企業の求める人材へのアプローチが可能になります。 つまり、人力で行っていた企業と求職者をつなげる採用活動は、ほぼ不要になります。今後は、求職者でも企業に合わせた、エントリーシートの作成や面接練習を行い、AIに依存した採用活動になるでしょう。 PeopleGPTが日本にもたらす影響 ①HR市場の縮小 主にHR企業の役割は、企業が求める人材と、求職者をつなげる事でその活動がPeopleGPTで自動化できる様になるので、サービスが浸透すれば、HR企業の存在価値が小さくなる可能性があります。 しかし、日本のPeopleGPT利用率はほぼなく、そのサービスを紹介する日本の記事も少ないので、日本に定着するまでには時差が2年ほどかかるのではないかと推測しています。 ②優秀な人材の流出 企業と求職者のマッチングがこれまで以上に容易になるため、優秀な人材の転職リスクが発生してしまいます。 自社の人材DB (社員の基本情報や人事評価、スキルなどの人材データを集約し、可視化したもの。 )はクローズドにした方がいいでしょう。 ③採用に苦戦する企業も出てくる。 現在企業は日本は、売り手市場なので、企業の応募数の方が余っています。結果、求職者にエントリーのメールが大量にきて、企業側には、返信すら来ないという現象も起きそうです。メールを送った後、面接に来るようフォローすることが必要でしょう。 今後の対策 ①PeopleGPTに一度でも触れて採用AI の勉強をする。 この対策が一番いいと思います。理由としては、人事や採用エージェントの採用活動が効率化される可能性があるためです。 採用は、実際に雇い3年ほど育ててから採用して良かったのかがわかるので、AI で選定ができるのか、まだ答えは出来ていません。 しかし、その思い込みで何も行動しない企業と、実際に試して出来ること、出来ない事が分かった上で選択する企業では大きな差が開くでしょう。 月15,000円の投資から、良い人材が集まる仕組みを作れるかもしれないので、私も、そのような未来なった時に依頼が来るよう、日々採用AIを検証しております。 ②採用のデータを多く所有している企業は採用AIを開発する。 PeopleGPTはというサービスは、オープンAIで、API も公開しています。ですので、AIでのマッチングや、文章生成、質問の解答などができます。 ビズリーチやリクルートなど、企業と求職者両方の情報を持っている企業は、PeopleGPTの仕組みが日本版でも出来るかもしれません。 また、企業と求職者片方の情報しかない企業でも、たとえば、ある企業に合わせた志望動機を自動で生成するサービスを作るなど、採用AIを開発する側に回ることも可能です。 まとめ PeopleGPTとは、最先端の採用マッチングAIであり、今後の採用活動に大きく影響を及ぼす可能性があります。PeopleGPT、AI事業は、現在急速に進化を遂げている為、AIを使いこなす人と従来のやり方で進める人の間には相当な格差が開きます。 今後の対策として、PeopleGPTに一度でも触れて採用AI の勉強をしてみてはいかがでしょうか？ ジェイ・ライン株式会社はこのように、最新のAI技術も活用しながら、採用サイト制作を行なっています。支援実績は、10,000社以上、採用サイト制作1,000社以上。 採用サイト制作で、お悩みの方はこちらのリンクからお問合せください。

OpenAIは6日(米国時間)、特定の目的のために「ChatGPT」をカスタムできる「GPTs 」を発表しました。「GPTs」はなんと、カスタマイズして個人で販売できるそうで、AIは日々進化し続けています。 本日は、ChatGPTで、コーディングの修正する方法について紹介します。 ChatGPTでコードを修正する手順 ChatGPTでコードを修正する手順は３つです。 手順①コーディングで「つまずいている」部分を説明する。 手順②コーディングで「どのように修正してほしいのか」伝える。 手順③修正したいコードを提出する。（HTML、CSS、JavaScriptなど） 具体的に説明していきます。 手順①コーディングで「つまずいている」部分を説明する。 まずは、コーディングの現状の説明や、つまづいている部分を紹介します。 こちらの質問の書き方のポイントは、上司や同僚に伝えるように、前提条件や動作のパターンも丁寧に解説する事です。 【プロンプト例】 スライダーmax‐with 611pxの段階で、スライダーが2つになり、各スライダーの外側の余白が、15pxずつ均等に空くデザインを作成したいです。しかし、2つのスライダーが、やや右寄りになっています。 　 手順②コーディングで「どのように修正してほしいのか」伝える。 手順①でChatGPTにしてほしい事を伝えたら、どんな修正をしてほしいのかを説明します。 ここでのポイントは、Pixel数、フォントカラー、フォントサイズも伝えると、ほぼズレなく修正が可能になります。 【プロンプト例】 ブロックの外側の余白がHPとから15pxずつ均等に空くようなデザインを提案してもらうことは可能でしょうか？ブロックの背景は＃744E4Eでお願いします。 　 手順③修正したいコードを提出する。（HTML、CSS、JavaScriptなど） 最後は、現在書いているコードを貼り付けたら完了です。 コードは長くても問題ないです。 具体的な質問と回答例 【質問文】 現在、HP制作のお知らせセクションで、すべて、お知らせ、イベント、ブログの４つのボタンを作成しています。現在はCSSコードにactiveをつけてボタンを押すと色が変わる反応を作っているのですが、このボタンをラジオボタンにしたいです。このようにコードを書いているのですが、どのように変更すればいいでしょうか？条件:色はやフォントサイズ図形のサイズはそのままにしてください。記載したコード<div class="news-btn1">　<a href=""   class="news-btn2">　<a href="" class="news-btn3">・・・ 　 【回答例】 まとめ：ChatGPTでコードの修正は可能。 ChatGPTでコードの修正を行う手順は３つ ①コーディングで「つまずいている部分」を説明する。 ②コーディングで「どのように修正してほしいのか」伝える。 ③修正したいコードを提出する。（HTML、CSS、JavaScriptなど） ジェイ・ラインはこのように、最新のIT技術を活用しながら採用サイト制作を行っています。 採用に課題を抱えている方は、こちらからご相談ください。

キャッチコピーの作り方に悩んでいる。 いいキャッチコピーが思い浮かばない。 Chatgptでキャッチコピーを作りたい。 このような悩みを抱えているWebマーケター、ライターは多のではないでしょうか。本日はこのような疑問に答えます。 ChatGPTでのキャッチコピーを作る5つの手順 ChatGPTのキャッチコピーの作成手順は下記の５つです。 手順①：ChatGPTで何をしたいのか伝える 手順②：どのようなキャッチコピーを作りたいのか伝える 手順③：キャッチコピーのターゲットの詳細を説明する 手順④：意図するキャッチコピーの条件を設定する 手順⑤：キャッチコピーの具体例を付け加える それでは、具体的に説明していきます。 手順①：ChatGPTで何をしたいのか伝える まずは、「ChatGPTで何をしたいのか？」どのような、キャッチコピーを作りたいのかを伝えましょう。 今回ですと、「キャッチコピーを作成したい」ですね。そうする事で、Chat GPTが何を答えたらいいのか方向性がしっかりします。 手順②：どのようなキャッチコピーを作りたいのか伝える 次はキャッチコピーの詳細な内容を説明します。 説明する内容はこちらです。 現状の説明（どのような人がキャッチコピーを作りたいのか。） ターゲット（誰に向けて、キャッチコピーを作りたいのか。） ゴール （ターゲットにどのような行動を促したいのか。） 【プロンプト例】 「私の会社は家具を販売する会社を経営しており(現状)、転職採用で30代の真面目で、一生懸命に働きく男性 (ターゲット)がその企業に共感しエントリーしたくなる(ゴール)キャッチコピーを考えてください。」 　 手順③：キャッチコピーのターゲットの詳細を説明する ②番のターゲットでもいいのですが、よりキャッチコピーの精度を上げたいなら、ターゲットを詳細に書いた方が良いです。 特にこの内容を書くといいでしょう。 年齢 性別 職業 性格 年収 趣味 悩み等 【プロンプト例】 ＜ターゲットの詳細＞ 年齢30代の真面目で、一生懸命に働き、年収は300～400万で平均より低い「将来的には年収やキャリアアップしたい」という事に悩みを抱えている男性です。 手順④：意図するキャッチコピーの条件を設定する ここで言う条件とは、文字数制限や雰囲気（例：情熱的、スタイリッシュ）、キャッチコピーの方向性を決めることです。 この条件を付け加えることで、ChatGPTの回答の精度が格段に上がります。 条件を書くときは、 かっこで括ったり、＃をつけるなど、特別な質問の中で目印をつけるとChatGPTは理解しやすくなります。 【プロンプト例】 ＜条件＞ ・7~10文字以内 ・明るい雰囲気にする。 ・20個、箇条書きでまとめること。 ・・・ 手順⑤：キャッチコピーの具体例を付け加える 最後に具体例を伝えることで、ChatGPTはその文体や雰囲気に近いキャッチコピーを生成しやすくなります。 むしろ具体例を書くことが本当に、重要で、修正する手間が大幅に削減されるので 必須で付け加えた方がいいです。 【プロンプト例】 ＜下記のキャッチコピーを参考に文章を考えてください。＞ ・転職して叶える、あなたの夢をサポートするイケア ・高収入＆成長環境で、あなたの人生をリード 　 質問文と回答の具体例 以上の点を踏まえて質問を行うと、このような回答になります。 【質問例】 私は、キャッチコピーを作りたいです。 私の会社は家具を販売する会社を経営しており、 転職採用で30代の真面目で、一生懸命に 働く男性がその企業に共感しエントリーしたくなるキャッチコピーを考えてください。 【ターゲットの詳細】 メインターゲットは、 30代の真面目で、一生懸命に働き、 年収は 300~400万で平均より低い 「将来的には年収やキャリアアップしたい」 という事に悩みを 抱えている」 男性です。 そのような人物に共感されて転職したキャッチコピーを20個考えてください。【条件】 上記の文章が必ずしもキャッチコピーに入れなくてもいいです。 ビジネスで使える真面目な文章にする。 【企業PRポイントはこちらです】 高収入、 まかないあり、 昇級、 成長できる環境、 車通勤OK 、交通費あり、大手企業、 副業 可能、 社割制度、社会保険完備、 ボーナスという、メリットがある。 <下記のキャッチコピーを参考に文章を考えてください>・ 転職して叶える、 あなたの夢をサポートするイケア ・高収入&環境で、あなたの人生をリード ・イケアで人生のステージを上げる、 輝く30代へ 【回答例】 ChatGPTで質の高いキャッチコピーを作成するためのコツ 上記の手順を踏まえるとChatGPTでキャッチコピーは作成できるのですが、より精度を上げるためのコツも存在します。 コツ1.条件を絞り込み、キャッチコピーの方向性を絞ること。 Chat GPTの質問文では、初めは大まかに何をしたいのかを伝えて、徐々に条件を絞り込んでいきます。 まさに推理のようですね。 「犯人は日本人の2０代の男性である。→大阪の〇〇大学生で、テニスサークに入っていることが新たにわかった。」 のように、キャッチコピー作成に必要な情報をできるだけ細かく伝えると、その情報をちゃんと理解し、テーマに合わせて作ってくれます。 ＜よく使う条件はこちら＞ ○○文字以内。 キャッチコピーの雰囲気を伝える。（情熱的な、スタイリッシュな) 重要ワード（＝○○）を必ず入れる。 ビジネスで使う真面目な表現にしたい。 専門用語を使わない。 箇条書きでまとめて下さい。 コツ2. 一度の質問に、20個以上回答させること。 今までの説明を聞いて、ChatGPT「すごい！」と思ったかもしれませんが、 実際のところは、20個回答させて、1つ良い案が見つかったら良い方です。 ですので、キャッチコピー作成は、質より量を求めて、良い答えが出なければ、どんどん改善案を考えさせましょう。 よく起きる失敗例 キャッチコピーの具体例を書かないこと。 すみません。重要なことなので２回言います。 15回ほど様々なキャッチコピーを作り検証した結果なのですが、 初めのうちは、具体例を書くのがめどくさくて、端折っていたら、良い返答が返らず結局、具体例を書いたケースのみ求める回答になりました。 ですので、条件を絞るのが面倒な方は、２つ程度条件をかき、具体例を書くぐらいでも 良いです。 【具体例を書かなかった回答例】 まとめ:ChatGPTでキャッチコピーを作るには、条件絞りと、具体例が重要 キャッチコピーを作る手順は５つ ① ：ChatGPTで何をしたいのか伝える 。 ②：どのようなキャッチコピーを作りたいのか伝える。 ③：キャッチコピーのターゲットの詳細を説明する。 ④：意図するキャッチコピーの条件を設定する ⑤：キャッチコピーの具体例を付け加える ただ、キャッチコピーの作成で初めのうちは、求める質のキャッチコピーにはならず、10 回以上の失敗を重ねてキャッチコピーが作れるようになりました。 ですので、この記事をここまで読んでいただいたのならば、ぜひ一度ChatGPTに質問してみることをオススメします。 ジェイラインはこのように、最新のIT技術を活用しながら採用サイト制作を行っております。 採用サイト制作にご興味のある方は、こちらからお問合せください。