【ChatGPT】Web制作者がAIを触ってみるスレ
今のところChatGPTを使う場面って企業サイト内のQ&Aチャットくらいかね? webサイトは、画像などどう使うかも含めてchatGPTに伝えたらコーディングしなくとも作ってもらえるな
コードもそんなにおかしくなくて微調整で使える
これではプログラマは廃業じゃね?
素人でもwebサイト作れる プログラマの優位性は減ると思うよ。
コード作ってくれる そのコードが意図通り動いた!って思っても
セキュリティとかに問題あったりしないか確認は必須だから
私みたいななんちゃってだと切り捨てされるだけだわ(涙 そもそもアプリ作る場合は1つのコードだけで済まないからな
複数にまたがるわけだし、関数やクラスにもする
AIがちょっと書いたコードは実務で使用できないよ ツイッター見てたら
Chromeのプラグインを全く経験のない人が
ChatGPTで作れたって報告してたよ >>13
バーカお前のスキルはもうクズなんだよ
プログラマーは誰でもなれるからお前の報酬も減るだけ
ゲラゲラ🤣 プログラムやコードの意味を理解するより
AIを使役するのがめちゃくちゃ面白い
これプログラマーヤバいだろマジで 素人でも簡単に○○できました──の文脈は、デモでは目を引いても実用性はあんまりないのよな
一歩踏み込むとそこに専門知識が必要になってくるわけで
特化職のタスクを軽くしてくれるようなツールになってくれることを願う いつも素材探しがダルすぎるから
DALL-Eが早く実用レベルになって欲しいわ。
著作権の問題と、気持ち悪い合成でまだ全然ダメだけど >>20 自己レス
といってる側からAdobeがFireflyなるサービスリリース。
これで著作権問題のハードルは超えたかも 名前にFireついてるところに一抹の不安を覚えなくもないが、いいサービスに育ててほしいところ デザインカンプ読み込ませてそれなりの構造のHTMLかけてたら完敗かも。 >>25
FigmaやXDしばりなら
ググると既にたくさん出てくるね 2022年の4月頃から既にあるようだが普及してないのかな
Quest.AI
FRONT-END.AI
TeleportHQ
Locofy
精度についてはそれなりって感じか 何が嫌だかって、AIで修正出来ない場合は
俺らがそのソースを修正をさせられるのが嫌だな >>26
Locofyとかいうのは知らなかったけどあとは触ったことある
カンプの時点で簡単にコーディングできそうなデザインにするという本末転倒なことをやれば速度は上がると思う
ちょっと複雑なデザインになるともうダメなのはどのエンジンも同じ 現状だとテキストデータの整形やコードへの変換、複雑な構文の説明あたりが実用的ですね。
偶に誤りますが、小規模なものなら結構良い精度で動いてトータルで労力減らしてくれている印象です。 >>29
実際にや手見ればわかると思うけど、プログラムと違って
見た目で正解不正解の判定がひつようになるCSSはAIにはまだ判定できない。
吐き出したソースで出来ていない事にAI自体が気が付いていないから修正案もおなしのばかり出てくる >>30
そうだね。
結局簡素なデザインで良いならWordPressの出来いのテンプレでいいし、
でもそういうのってクライアントワークの実務で使う事まずないわ
bootstrapでさえ、構築後の拡張とカスタマイズ考えたら使いたくないと思うくらいなので。
というわけで我々の仕事が消えるのはもうしばらく先か ブロガー:既にあるデザインからブログを当てはめて作る
web制作:オリジナルのデザインからコーディングを起こす
工程が全く違うからねぇ
>>26
そんなツールあるのか、サンクス。
一回やってみてどれくらいのもんか見てみますわ。
>>34
そうだね、オリジナルデザインをコーディングするための技術や環境はまだないのかも。
ただ、AIにサイト制作を指示する用のツールみたいなのが生まれて、それで動的なデザインとかシステム処理とかも生成してくれるようになると、立場が危うくなってきそうな気がする。
WEB制作経験あるディレクターいればそれなりのサイトは作れるとかになりそう。。
連投すまん。
情弱すぎて知らなかったが、STUDIOってツールも相当すごいやん。
中途半端なWEBサイト制作者は余計に仕事減りそうやわ。。
Wixとかもこれくらいすごいんかね。。
え、これどうやって差別化すればええんや・・・?
情弱は情弱のクライアントからくるWEB制作依頼(WordPress、LP制作)やっ解けばええんか? 今ならAIとかあるしこんな便利なサイト作成ツールもありますよ
自分で作成したらどうです?
・お金勿体ないしそうするわ
・WEBの事はプロに任せたいわ
自分は今は後者のお客さんの方が多いかな。
例えばそれなりの規模の企業ならWordPressつかって
自分たちで公式サイト作りましたってあまり見なかったし
トヨタとか三井住友銀行がWIXで作られてたらなんかそれはそれでダセーなw WordPressも自分たちで更新できる為のCMSなのに
結局更新怠ると操作方法とか忘れて、更新お願いしますってなってるからなあ なるほどなぁ。
まあなんとなくのHP作ってたら淘汰されてしまって、マーケティングやブランディングも当たり前に考慮しているHP制作者がうまいこと利用する感じかな。 まだ20代30代前半なら将来を見越していっそ今後伸びそうな業界に転職も選択肢に入れるのもありだな
かといって、ホワイトカラーのデスクワークはほぼ同様に置き換えられる可能性がある
ほんの1-2年前に注目され始めたビックデータ駆使するデータサイエンティストでさえやばいじゃんな。
今後伸びそうな業界なんてわからないよな。宇宙関連とかか ケアワーカーエッセンシャルワーカーが低賃金とかそういう
伸びるものと人間に必要なものが関係無いという社会のバグを直さないと
投資以外の仕事なんかする意味なくなる その昔キーパンチャーと言われた職種(今でいうデータ入力?)
伝票なんかをテンキーでいかに早く正確に入力できるかみたいな職種も
OCRがここまで無料で精度高くなると厳しいだろうね。 >>41
うむむ。
アラサーではあるが、WEBの仕事割と好きなんだよなぁ。
ちょっとした工作要素(そう捉えてはダメだけど、)もの?づくりとしては割と好き。 ホームページのcssでiPhoneでの表示がおかしいと言われてMacまだ持ってないが
AIでチェックしてコード修正案出してくれないかなぁ GPT4使ってる人いる?
GPT3.5と比べて全然良くなってるときくが、このWEB仕事で使えるレベル? 下記の法則に従って、別のソースを同様にエスケープなどして書き換えて欲しいんだが
どういうプロンプトで実現できるかわかるひといる?
書き換え前
<ul class="">
<li>
<img src="images/" alt="" />
</li>
<li>
<img src="images/" alt="" />
</li>
<li>
<img src="images/" alt="" />
</li>
</ul>
書き換え後
"<ul class=\"\">",
"\t<li>",
"\t\t<img src=\"images/\" alt=\"\" />",
"\t</li>",
"\t<li>",
"\t\t<img src=\"images/\" alt=\"\" />",
"\t</li>",
"\t<li>",
"\t\t<img src=\"images/\" alt=\"\" />",
"\t</li>",
"</ul>" >>49
コードの修整は一度に処理しようとすると大抵失敗するので段階的に処理したほうがいいですね。
それでもコード量が増えると大文字小文字を間違えたり記号が消えたり文字数制限に引っかかったりするので、その辺を細かく列挙して少量ずつ変換すると上手く行きやすいです。
結局チェック作業は必要ですし、データ量が多い場合はリファクタリング機能か正規表現を使ったほうが圧倒的に早く終わったりします。
自分の場合は正規表現を考えるための相談役に落ち着きましたね。 >>50
ありがとう。
自分はまだどう使うがな~って段階なのでアドバイス助かります。 >>49
chayaAIがミスる可能性考えたら正規表現でよくね? 正規表現用っぽいソースを作る為に正規表現を使って加工するのがめんどいなって思ったんで、、
ChatGPT活用に良い機会だって思ったんだが正確性の求められるものはあかんねぇ
落合陽一がやってるような自然言語プログラミングとかやってた方が楽しいんだろうね >>53
命令を「正規表現を使って」とか、その正規表現を示せ、で1行づつぶちこんで、成果の正規表現は重複以外全部足せば良いんじゃね >>54
最終的にこのレベルまで具体化してようやく実現できるレベル。。
##要件
①HTMLソースを条件に従って修正してください。
#条件
下記を1から順に処理してください
1:最初にHTMLソース内のメタ文字(ファブルクォーテーション「""」)を全て\でエスケープしてください。
2:次に行ごとに行頭と行末をダブルクォーテーションで括ってください
3:最後に行末にカンマ「,」を付与してください
#①HTMLソース
<ul class="">
<li>
<img src="images/" alt="" />
</li>
・・・・・略
こんな事なら意味ないからなー。
見本Aを見てBを同様に書き換えてください
で実現してくれんかのー バックエンドやメンテなら早めに実用レベルになりそうな気はするが
めんどくせえフロントエンドにはどう使えばいいか思いつかねえ >>55への自己レス
雛形、間違ってたw これが正しいらしい
# 命令書:
# 制約条件:
# 入力文:
# 出力文: SuperChatGPTってChromeのアドオン入れると
コミュニティで他の人が使ったプロンプトが見れる
みんな何に使ってんだ?って思ってたまに覗いてるわ
~~~~~
Midjourneyという画像生成AIに絵を書いてもらいたい。
ここでは、あなたはプロンプトメイカーとしてのみ動作することとする。
###プロンプトは下記の制約条件を必ず満たすこととする。
・単語数に制限はない
・すべてを英語で記述すること
・すべて単語で記述すること
・文章は書かないこと
・カンマ区切りで特徴を列挙すること
・特徴は簡潔な英語の形容詞+単語か、単語のみで書くこと
・AIに情報を与える前提でAIが理解しやすいように配慮すること
・与えるプロンプトのみを出力すること
###下記のプロンプトを生成してください。
~~~~~~ 自分はまだ手を出せてないのですが、githubの作ってるcopilot Xはどうなんでしょうね?
ttps://github.blog/jp/2023-03-23-github-copilot-x-the-ai-powered-developer-experience/ >>59
試したよそれ。
感想としては、CSS/HTML用で考えるなら
コード保管候補の機能が少し範囲広がった程度って感じかな。
/*ボタン*/ って入力すると下の行に適当にcssが出てくる感じ。
(文字サイズや背景色なども指定せずとも適当に書いてくれるのは賢い)
でも個人的にはこれなら保管やスニペット登録でいいかなって思った。思い通りのが一発で出てくるから。
プログラム組むならまた別だと思う。 デザインがあって再現して欲しい時に使えるようになったら次のステージって感じやね >>60
それはcopilot Xの方ですかね?
補完機能とは別にGPT4搭載のチャット機能が搭載されているらしいのですが。
どうも新旧のバージョンの情報が混在していて機能ごとにウェイトリストなどが別れているので手が出なくて。 >>63
ごめんよく読んでなかった。自分が試したのは旧タイプだわ
自然言語でもプログラミングができるようになるのか >>64
ChatGPT4の能力でコーディング向けにカスタマイズされていて、プロジェクト内の構造などを把握して動作してくれるようなので結構期待してるんですよね。
音声認識での操作なんかも開発進めているようですし、プロ向けのノーコードのプログラミングも割と近い将来実現するでしょうね。 早く来ないかな。
ttps://youtu.be/5XheKKZoGnE MSだからvscodeのまま使えるのが助かるわ
aiコーディングの為に新たにエディター変えたくないもんな
無料だし。vscodeはなんで無料で維持できるのだろうか >>67
VSCodeを入口にして本家VSで稼いでるんですかね?
VSCodeでも情報収集やらはしているようですが。 意外と伸びないね
みんなAI使ってないのか‥
いうて俺も画像生成くらいだけど 俺はChatGPT使ったおかげで30万ぐらいの仕事したわ
これはすごいわ GPT4使ってるけど3.5の方がサクサク動くな
4はプラグイン入れて活用中でウェブの要約とか翻訳とかその他諸々どんなことがどんなレベルなのかをお試し中
まだ仕事レベルのことはしてないわ
プログラムは、習い事教室のメンバーのペアリングを自動的に決めてもらうPythonコード書いてもらっただけかな
現在のところは、みんなコード類は自分で書いちゃった方が早いんじゃないの
出てきたコードがちゃんとしてるかどうかも検証しないとならないわけで、それはそれで手間だと思う
画像生成はFirebirdを少しやった
細かいところが思い通りに出なくてめんどくさくなってやめたw ごめん自己レス
FirebirdじゃなくてFirefly chatGPT4の感想
jsとphpは実用レベル
reactやlaravelなどフレームワークが噛むとちょっと怪しくなる
pearlはまだ難しいことやらせてないからわからんが致命的な間違いはなさそう?
マークダウンはうんち ヘッダーフッター3カラムになるようにhtmlとcssを書いてね
bingchatだとカラムが上下にずれて上手く行かなかった
chatGPTだと成功
もっといいプロンプトあるのかな