v0 パワーアワー

VVercel
AI/미래기술창업/스타트업컴퓨터/소프트웨어

Transcript

00:00:00>> やあ、みんな。
00:00:07>> こんにちは、皆さん。
00:00:14>> やあ。
00:00:17>> 調子はどう?
00:00:23>> ワクワクしてるよ。
00:00:32>> さて、皆さん初めてのV0 Power Hourへようこそ。
00:00:37これは試験的に始めるものです。
00:00:39週に一度、
00:00:39あるいは隔週でライブ配信して、
00:00:42V0で視聴者のコメントを反映しながらライブビルドするのが楽しいんじゃないかと思ったんです。
00:00:48今後は、面白いゲストをお招きできればと思っています。
00:00:51でも今日は、Vercelコミュニティチームのメンバーがいます。
00:00:55私はアリです。V0に携わっています。
00:00:58肩書きは、テクニカルスタッフのメンバーです。
00:01:00最近はそう言っています。
00:01:02>> 確かにあなたの肩書きを決めるのに苦労したわ。
00:01:05「彼女は何でもやってるからな」って。>> キャロライン、エイミー、自己紹介してくれる?
00:01:12それじゃあ、楽しくプロンプトを試してみましょう。
00:01:15>> ええ。キャロライン、先にどうぞ。
00:01:17>> ええ、喜んで。私はキャロラインです。
00:01:19アリと一緒にV0に取り組んでいて、コミュニティと多くの時間を過ごしています。これが初めてのライブ配信です。
00:01:25それに、Vercelに入社して1ヶ月なので、本当にワクワクしています。
00:01:27これはコミュニティの多くの方々から要望があったことなんです。
00:01:30アリが週1でやるって言ったから、週1でやることになったと思います。
00:01:33>> ええ。もう皆さんご存知だと思いますが、
00:01:38私はエイミーです。Vercelのコミュニティチームに所属していて、こういったライブ配信が大好きなんです。
00:01:43これは確実に初めてではありませんが、今日は本当に楽しみにしています。
00:01:46>> ええ。ベテランがいますね。最高です。
00:01:49さて。もしまだVercelコミュニティにログインしていなければ、そこが私たちが見ているチャットになります。
00:01:57これはVercelコミュニティのイベントだと思うので、
00:02:01ログインしていることを確認すれば、
00:02:03V0で作れるプロンプトの提案や楽しいアイデアを投稿できます。
00:02:08それ以外は、コミュニティからの提案を受けて、V0で何が作れるか見ていきます。
00:02:14何か忘れてることある、エイミー?
00:02:15>> チャットのための簡単な注意事項をいくつか。
00:02:18イベントで「参加する」をクリックしてください。そうすれば、見るだけでなく実際にメッセージを送れるようになります。
00:02:24行動規範を忘れずに。
00:02:27基本的に、お互いに親切にしてください。
00:02:29>> 素晴らしい。いいですね。
00:02:32さて、キャロライン、このPower Hourのイントロとして最初のプロンプトがあるよね。
00:02:39>> アンバサダーから来たものです。
00:02:40>> 素晴らしい。じゃあ、このプロンプトから始めます。画面を共有してから、V0でのビルドに入りましょう。
00:02:52オッケー。いいね。皆さん見えてますか?
00:03:01>> ええ。
00:03:02>> 完璧。これから始めるプロンプトは、
00:03:05ASCIIシェーダーアニメーションを使ってV0 Power Hourのイントロを作成する、
00:03:12というものです。
00:03:13「Hello World」
00:03:14という挨拶から始めてください。各メッセージに対してASCII文字を順次アニメーションで再配置し、
00:03:20各メッセージを約3秒間表示し続けてください。
00:03:23メッセージは短めに。
00:03:25さあ、V0にプロンプトを入れて、何を作るか見てみましょう。
00:03:30これはかなり具体的なプロンプトですね。いいと思います。
00:03:32>> Power Hourをすごく楽しみにしてたんです。
00:03:36>> 素晴らしい。いいね。
00:03:40V0が考えていて、これから実際に作りたいものを生成し始めます。
00:03:46最高。
00:03:51>> アニメーションのイントロを作るべきだって、いい気づきだね。
00:03:54Power Hourを始めたら、それができるかも。
00:03:57>> ええ、Power Hourに使えるかもね。
00:04:00すごく可愛い。大好き。
00:04:05ホリデーをテーマにした生成もやりたいな。
00:04:08私、すごくメリーなホリデースコアを持ってるの。
00:04:12>> 今日アンバサダーの一人がサンタトラッカーをシェアしてたの、見た?
00:04:16>> まあ、すごい。ソーシャルに投稿してた?
00:04:18>> スペイン語だったから、英語に翻訳する方法を考えなきゃいけなかった。
00:04:20今サンタがどこにいるかは分からないけど、確認できるよ。
00:04:24>> じゃあ、サンタトラッカーも作ってみようかな。楽しそう。
00:04:28V0はまだビルド中。
00:04:33何をしているか教えてくれています。
00:04:37さて、
00:04:38他にどんなのがあるかな。サンタトラッカーとか。皆さんがV0に入れられるホリデーをテーマにしたプロンプトのアイデアがあれば、
00:04:47チャットに入れてください。教えてください。
00:04:51>> エルフのパフォーマンスリーダーボードとか、トップエルフとか。
00:04:56>> KPIを達成してるのかな?
00:04:59>> まさに。
00:05:00>> エルフたちはちゃんと競争してるのかな?
00:05:01>> いたずらリストといい子リストを作れるかもね。でもヴェルサイユでは、
00:05:05チームの誰がいたずらリストといい子リストに入るか分かっちゃうよ。
00:05:08>> アターがそれを止めるでしょうね。
00:05:10>> ええ、無理だと思う。
00:05:11>> 架空の人物で作ればいいんじゃない?
00:05:14>> 偽名を使えばいいよ。エルフの名前も使えるし。
00:05:17>> 有名人を使えばいいじゃん。
00:05:18有名人版、いたずらといい子リスト。
00:05:19>> ああ、いいね。いたずらといい子リストは面白くなりそう。
00:05:21>> いや、でもこれ2025年だよ。
00:05:23>> そうだね。論争を呼ぶかもね。
00:05:27>> ああ、チャットに質問が来てるよ。
00:05:29今どのモデルを使っているか知りたいって。
00:05:32>> おお、いい質問だね。
00:05:34>> 今はV0 Proを使ってるよ。
00:05:37始める前にモデルを選んでおくべきだったかな。
00:05:44デフォルトのままなんだ。
00:05:46でもこの問題はかなり具体的だからね。
00:05:48だから構築に少し時間がかかってるんだと思う。
00:05:51>> ちょっと考え中ってことだね。
00:05:53>> 質問が来たよ。
00:06:01V0 Maxは画像生成に優れているっていうのは正しいですか?
00:06:04>> はい。V0 Maxは基本的にうちの最高峰モデルです。
00:06:09複雑な作業に対して最大限の知能を持っていると書いてあるでしょう。
00:06:13Cloud Opusで動いています。
00:06:14最高品質のデザインと生成結果が得られますよ。
00:06:19>> サンタトラッカーはV0 Maxを使わないとね。
00:06:25>> 個人アカウント使ってるんだよね。
00:06:27クレジットが切れたら、誰か他の人のを使わないと。
00:06:31>> 了解。
00:06:33>> すごい。期待がどんどん高まってくるよ。
00:06:38これ、どんな感じになるんだろう?
00:06:41>> 小さなキャラクターを全部並べるために一生懸命考えてるんだよね。
00:06:46>> うん。絶対すごいものになるよ。
00:06:50>> Twitterで見かける人たちがやってたキャラクターものって、
00:06:54いつもこういうのだったんだよね。みんな何時間もかけて、
00:06:57どうやって全部揃えたのかって考えてたよ。
00:07:00V0でこれができるようになったのはすごいよね。
00:07:02キーボードで時間を費やさなくていいんだから。
00:07:04>> そうだね。これが構築されてる間に別のを始めようか。
00:07:12V0って言っちゃった。
00:07:15このタブを共有するね。
00:07:19キャロライン、チャットにプロンプト来てる?
00:07:24>> エイミー、チャットに何かある?
00:07:26>> チャットには何も見当たらないわ。
00:07:29>> サンタトラッカーを試してみるよ。
00:07:32えっと。こうしよう。
00:07:40サンタの業務用内部ダッシュボードを構築しよう。
00:07:45ソリトラッカー、ルートプランナー、トナカイ、タイマー、いたずら/いい子テーブル、そしてルートプランナー。
00:07:56どれどれ。これもV0 Proだね。
00:08:02まだ構築中。誰かサンタの格好すればよかったね。
00:08:13>> ほんとに。セーター着ればよかった。
00:08:15持ってるの羨ましいよ。
00:08:17>> でしょ。
00:08:18>> 昨日これTargetからドアダッシュで取り寄せたんだ。
00:08:22Targetから服もドアダッシュできるって知ったの。
00:08:25国を横断して引っ越したから、ホリデー用品が何もなくて、いろいろ失くしちゃった気がするんだよね。
00:08:33「明日のために今日中にホリデーセーター必要だ」って思って。Targetからドアダッシュできるなんて知らなかったよ。
00:08:40>> 知っておくといいね。
00:08:41>> イノベーションだね。
00:08:44>> サンタトラッカーにかなりたくさんやることを与えたね。
00:08:50V0でこういうのを作る時って、普段は全部一度にリクエストする? それとも骨組みだけ作ってから後で追加していく?
00:08:59この場合だと、トナカイの餌やり機能を後から追加する感じ? どういうふうに作るのが好き?
00:09:03>> 探しているものを正確にプレビューしたい場合は、できるだけ具体的に始めるのが好きなんだ。
00:09:13例えば、
00:09:14うちのプロダクトチームは、
00:09:16PRDに取り組んでいる時や製品アップデートを考えている時、
00:09:20V0に入力するプロンプトをすごく具体的にするんだ。
00:09:24実際、
00:09:25V0内で作られたベビーV0テンプレートを使って、
00:09:31非常に具体的なプロンプトで見たいものを見られるようにしているんだよ。
00:09:40>> なるほど。
00:09:40>> これはほぼ一発で決まりそうだね。
00:09:45どうかな。まだ作業中。
00:09:49あの音好きなんだよね。オーケー。
00:09:51>> 私も。
00:09:52>> 見てみよう。プレビューがあるね。
00:09:56サンタ司令センター、北極オペレーション。
00:09:59正確だね、あと5日。
00:10:03V0はクリスがソリトラッカーって言った時に分かったんだ。
00:10:08今、ノルウェーにいるって。
00:10:10>> 筋が通ってるね。
00:10:12>> わあ。ダイナミックに変化してる。
00:10:17>> かなり動いてるね。
00:10:19>> すごい。オーケー。
00:10:22わあ、すごい。エルフのパフォーマンスリーダーボードが出てきたわ、キャロライン。
00:10:26>> 最高じゃん。
00:10:28>> これ面白いね。
00:10:30>> どうなるのかすごく気になる。
00:10:33>> これ楽しいね。何が起きたの?
00:10:37>> トナカイの餌やり中。
00:10:38>> おお。
00:10:39>> 子供たちにはすごく楽しいんじゃないかな。
00:10:42月の間ずっとトナカイに餌をあげられるゲームにできたらね。
00:10:48私たちが小さい頃、そういうのがあった気がする。
00:10:50>> なんと。いたずらっ子リストといい子リストまで作ったわ。
00:10:53もちろん本物じゃないといいけど。
00:10:55>> まさか実在の人物じゃないよね。
00:10:56>> 誰も見てないといいけど。
00:10:57>> 完全に冗談だったのに。
00:10:59もうパワーアワーはやらない。
00:11:04>> さて。ちょっとこれを改善してみようかな。
00:11:09少し分かりにくいのは色使いで、いたずらっ子といい子が両方とも赤に見えるのよね。
00:11:17これ変えられるかな。
00:11:19あと、この部分をもっとインタラクティブにできないかなと思ってて。
00:11:28トナカイのゲームを作ってみようか。
00:11:31えっと。いたずらっ子の色を変えて。
00:11:39いい子と、餌をもらった/お腹すいたの色を、一目で混同しないくらい違う色にして。
00:11:50どうなるか見てみよう。あんまりいいプロンプトじゃないけど。
00:11:53じゃあ別のタブに切り替えるね。
00:11:58もう一つの生成が終わってる。
00:12:02これが最初のやつ。
00:12:05V0が動的なASCIIシェーダーアニメーションのイントロを作ったって。Hello Worldから始まるやつ。
00:12:12おお、本当だ。ただ読みにくいけど。
00:12:14「レッツゴー」って書いてある。
00:12:17えっと、背景や他のアニメーションからテキストをもっと見分けやすくしてって言ってみよう。
00:12:35さあ、どうなるかな。
00:12:39サンタトラッカーに戻ってきた。
00:12:42オーケー、ここの色が変わったね。
00:12:46いい子、いたずらっ子。
00:12:48ずっと分かりやすくなった。最高。
00:12:54>> めっちゃいいね。
00:12:57>> よし。このタブに戻ろう。
00:13:03Xで質問が来てる。
00:13:06新しいV0はいつ来るの?って。
00:13:08知りたければ最後まで見ててね。
00:13:10ホリデーサプライズかもしれないし。誰にも分からないよ。
00:13:13もうすぐ来るから。まだならウェイトリストに登録しておいてね。
00:13:17めちゃくちゃクールなものになるから。
00:13:18ワクワクすることがたくさん控えてるよ。
00:13:20だから準備しておいてね。
00:13:22オーケー。これでテキストがもっと見分けやすくなった。
00:13:26>> いいね。
00:13:27>> この緑、どう思う?
00:13:30>> V0パワーアワーなら、これがホリデーバージョンのイントロになるかもね。
00:13:38でも実際には白黒バージョンも必要な気がする。
00:13:41>> もっとホリデーな雰囲気にしてって言ったらどうなるか見てみよう。
00:13:46@マークみたいなのがある。
00:13:51まあいいか。ウェブっぽいし。
00:13:54>> うん、テック系って感じだね。
00:13:57>> 他にプロンプトある?
00:13:59>> オーケー。
00:14:00>> YouTubeで今一つ来たよ。
00:14:04>> オーケー。
00:14:05>> エイミー、やってみる?
00:14:06>> うん。エイミー、読んでくれる?
00:14:08>> プロンプトは「人道支援活動家が月を通じてシンプルなアイデア、キーワード、気づきを集められるアプリを作って。
00:14:17準備ができたら、
00:14:18思いやりのあるコミュニティ重視のニュースレターを生成できるようにして。」 >> いいね。それはもうすぐやるよ。
00:14:28>> これがホリデーな雰囲気にしてって言った結果。
00:14:30>> すごく心地いい。
00:14:32>> 気に入った。
00:14:34>> なぜか@記号が好き。
00:14:37小さな紙吹雪みたい。
00:14:38>> そうだね。
00:14:40>> 雪の結晶もある。
00:14:41>> かっこいい。
00:14:42>> 実際けっこう可愛い。
00:14:44>> ランダムなキラキラ絵文字も入れてきたし。
00:14:47>> そう、創造性。最高。
00:14:52>> 本当にクール。
00:14:53>> オーケー。新しいV0ページを開いて、今リクエストされたやつをやるね。
00:15:02さあ行くよ。「人道支援活動家が月を通じてシンプルなアイデア、
00:15:08キーワード、
00:15:09気づきを集められて、
00:15:11思いやりのあるコミュニティ重視のニュースレターを生成できるアプリを作って。」これをV0 Maxで試してみよう。
00:15:21>> すごくいいね。実は私もV0に入ったばかりの頃、
00:15:26似たようなものを作ったの。コミュニティとの会話がたくさんあって、
00:15:31ランダムにアイデアが浮かんでくるから。
00:15:34「メモページみたいなところが欲しい。そこに入力して全部覚えておいて、
00:15:40テーマごとにまとめられたらって。」すごくスマートだと思う。
00:15:44>> オーケー。Superbaseをインストールするように促されてる。
00:15:47設定していくね。
00:15:55>> このアイデア、本当にいいと思う。
00:15:57私も似たようなことをしているんです。コミュニティプロジェクトで皆がシェアしているものや、
00:16:01Vercelが開発しているもの、
00:16:03V0が開発しているもの、
00:16:04それから他にも色々と、
00:16:05常にたくさんのことが同時進行していて。>> エイミー、
00:16:08あなたは何をしているの?プロって感じがするわ。
00:16:10あなたのコツを教えてほしいわ。
00:16:11>> もっと良いものを作る必要があるんだけど、今はすごく手作業なの。
00:16:18フォーマッティングをもっと自動でやってくれるものがあれば最高なんだけど、そこに一番時間をかけているから。
00:16:26>> そうね。どんな種類の会話なのかを指定しなくても良かったから便利だったわ。
00:16:30アンバサダーやユーザーと話していても、
00:16:33あるいは単にランダムなアイデアがあっても、
00:16:35整理することに時間を使わずに、
00:16:37ただそこに入れるだけで、
00:16:38テーマごとにまとまっていくの。
00:16:40でも、そう、その点では役立ったわ。
00:16:43>> 私はV0を使っていたの。
00:16:47V0で最も過小評価されていると思うのは、スライド作成にV0を使うことなの。
00:16:52Googleスライドとか他のものを使うのから完全に切り替えたわ。
00:16:56プレゼンテーション用のスライドは全部V0を使っているの。基本的に、
00:17:00欲しいアウトラインを説明するだけでいいから。「こういうテーマでプレゼンをするんだけど」みたいな感じで。1、
00:17:082ヶ月前にV0についてのプレゼンをした時も、
00:17:11「これについて説明したい」って感じで。
00:17:13「こういうことをやりたい」って。それを全部V0に1つのプロンプトとして入れたら、デッキ全体を作ってくれたの。
00:17:19それから編集するだけ。プロンプトで編集するの。手作業でスライドを作って見栄え良くするのは得意じゃないし。
00:17:28少なくともデザインの面では、私にとってはずっと良かったわ。
00:17:33>> 今はデザインシステムがあるから、一貫した見た目を簡単に保てるし、毎回プロンプトを入れ直す必要もないわよね。
00:17:38>> まったくその通り。これが生成されたら、その例を見せられると思うわ。
00:17:44AIゲートウェイの自動接続を使って作れる面白い生成物を考えているの。
00:17:54多分これの後でね。オーケー、いいわ。
00:17:57>> すごいわね。
00:17:58>> これはクールね。実はここでSuperbaseとの統合を使ったの。V0が推奨してくれたから。
00:18:05Superbaseに接続して、それからV0が接続を継続して、このアプリを構築してくれたの。
00:18:13アイデアとリフレクション用のデータベーススキーマを持つニュースレターアプリができたわ。
00:18:18Superbaseに接続して、それからアイデア収集とニュースレター生成機能を持つメインアプリが作られたの。
00:18:24実際に試してみましょう。
00:18:27V0はこれをCommunity Voicesって名付けたのね。気に入ったわ。
00:18:31この人が考えていたものかどうかはわからないけど。
00:18:33>> そうね。もしまだYouTubeで見ていたら、他に追加したいことがあるか聞いてみたいわね。
00:18:37>> そうね。リフレクションには何を入れようかしら?
00:18:41キャロライン、コミュニティについてのリフレクションがあるんじゃない?
00:18:43人道的なものじゃないけど、
00:18:45Zero Passengersか、
00:18:47最近やった何か他のことについてのコミュニティリフレクションとか。
00:18:50>> 今日、本当に素敵なメールをもらったの。
00:18:54あるアンバサダーがスウェットシャツのサイズを間違えて注文していて、
00:18:58ちょっと混乱があったんだけど、
00:19:00私は「もちろん、
00:19:01新しいスウェットシャツを送るわ。全然問題ないから」って言ったの。そしたら彼が「これは細かいことを大切にしていて、
00:19:09コミュニティの人間を大切にしていることの証だ
00:19:11」って言ってくれて。小さな瞬間がとても大切だっていう良いリフレクションになったわ。"
00:19:17それに、
00:19:17私にとってはとても簡単なことだったのに、
00:19:20彼がそういう感謝を示してくれたことに、
00:19:22私自身もすごく感謝の気持ちを感じたの。
00:19:24>> それ、素敵ね。
00:19:25>> 私、冗長なのよね。その瞬間からどう要約すればいいかわからないわ。
00:19:28>> これをどう訳せばいいのかしら?
00:19:31>> これがCommunity Voicesに入る主要な音声モードね。
00:19:33>> そうね。ウィスパーを使わないと。
00:19:35今日、私たちが完了した小さな親切/タスクについて、コミュニティメンバーの一人から素敵な感謝のメモをもらいました。
00:19:54彼に新しいスウェットシャツを送ったの。
00:19:58これは人道的なことじゃないわね。
00:20:02>> 人道的じゃないわね。
00:20:03>> 誰かに新しいスウェットシャツを送ったのよ。
00:20:04オーケー。アイデアを保存。
00:20:06いいわね。何が起こるか見てみましょう。
00:20:10アイデアが1つあるわ。
00:20:11他にも入れましょう。皆さん、良いことって何かしら?
00:20:19なんでこれが難しいのかしら?
00:20:20そうね、クリスマス、ホリデー、友達にサンタを買ったとか。
00:20:29>> これも人道的じゃないわね。
00:20:31>> これをテストしてみましょう。
00:20:35>> いいね。
00:20:37>> オーケー。素晴らしい。
00:20:38>> 本当にすごいね。
00:20:40>> そうだね。私たちはコミュニティをまとめているんだ。
00:20:44これは最悪だ。
00:20:46ひらめきの瞬間。本当に文字通り、それを取り込んで直接入れただけだった。
00:20:53これをもう少し改善できるかもしれない。
00:20:55ニュースレターのアイデアを生成する際、
00:21:02キャプチャモーメントセクションに入れるアイデアに何かもっと追加して、
00:21:14より長く、
00:21:16より興味深く、
00:21:18魅力的に読めるようにしてみてと伝えられる。
00:21:26さて、これは社内のまとめ作業にとても役立つはずだ。
00:21:35私、
00:21:35よく「今月やったことはこれです」みたいなまとめをたくさんやってる気がする。あなたの指摘通り、
00:21:39それらが全部別々の場所にあるから、
00:21:41これを使って一箇所にまとめられたら素敵だと思う。
00:21:43>> そうなんだ。実はこれについて考えていたんだ。私のチームの一部がスタートアッププログラムを運営していて、
00:21:49スタートアップ向けニュースレターをやろうって話してたんだよね。
00:21:53>> うんうん。
00:21:53>> これ、月内に起こったことを全部キャプチャして、月末にニュースレターを出すのにすごくいい方法だと思うんだ。
00:22:01>> マッズ、見てたら、このテンプレートあげるからね。
00:22:05>> 私たちのアイデアを共有し直そう。
00:22:15これを提案してくれた人から情報を集めよう。
00:22:20その人はコミュニティのメールリストを持っていて、アプリからニュースレターのコンテンツで通知を受け取りたいんだって。
00:22:28面白いね。
00:22:30実際に構築するには、もう少し連携設定が必要になるだろうね。
00:22:34>> そうだね。何らかのメール設定が必要になるはず。
00:22:36可能だと思うけど、今日の時間内に全部終わらせるには少し時間がかかるかもしれない。
00:22:44>> 私、適当なアイデアを入れちゃってるじゃん。
00:22:47友達の仕事を手伝った。
00:22:49年配の隣人に電話した。
00:22:55これ、どれもいいね。さあ見てみよう。
00:22:58今「生成」をクリックしたら、もっと魅力的なニュースレターができるかな?
00:23:05AIが私たちのニュースレターを作成中。
00:23:11>> すごく魅力的になるはずだよ。
00:23:15>> オーケー。そうそう。これ見て。
00:23:17世代を超えたつながり。
00:23:19いくつか。オーケー。素晴らしい。
00:23:23さあ見てみよう。戻ろう。
00:23:31もう一つプロンプトがあると思う。
00:23:35>> あるよ。
00:23:36>> 一つ。キャロライン、読んでくれる?
00:23:39>> うん。コミュニティのこの人は、
00:23:41ファッションEコマースサイト用にシェーダーを使ったアニメーションランディングページを作りたいんだって。
00:23:47それから、
00:23:48全米の店舗の中から最安値を検索して、
00:23:50ショッピング向けのGoogle Flightsみたいなウェイトリストを追加するらしい。
00:23:56これ欲しい。手動でセール情報サイトを全部見なくて済むし、自動化されるもん。
00:24:01>> オーケー。これ、私の人生に必要な気がする。
00:24:06>> だよね。
00:24:06>> ホリデーショッピングやってた時、これどこにあったの?
00:24:09>> 本当に。
00:24:10>> そうだよね。3週間前にこれがあればよかった。
00:24:12それがあったら最高だったのに。
00:24:14>> 私、
00:24:14フライトは全部これでやってるよ。航空券を手に入れるために前進してる感じがするんだけど、
00:24:19実際は価格を追跡して値下がりを見てるだけなんだよね。同じことができるよ。
00:24:23>> スペースクレジットが足りなくなりそう。
00:24:27>> 必要なら私のに切り替えられるよ。
00:24:29>> いや、大丈夫。今は問題ない。
00:24:31ちょっと大げさに言ってるだけ。
00:24:32>> このパワーアワーでたくさん蓄積してるね。
00:24:36>> 本当にパワーアワーだよ。
00:24:38誰かが「パワーアワーってショットを飲むやつじゃないの?」って言ってて、
00:24:43私は「ショットは飲まないよ、
00:24:44ワンショット(一発)でやってるんだ」って言ったの。>> そうそう。アリ、
00:24:49それいいね。
00:24:50>> ありがとう。
00:24:50>> 私もそれ考えたんだけど、他の人も考えてるか分からなかったから、言わなかったんだよね。
00:24:53>> ネットで叩かれそうだけど、今までの人生で一番親父ギャグっぽいこと言った気がする。
00:24:58>> もうツイートした?
00:24:59>> いや、してないよ。
00:25:01V0にプロンプトを入れて、
00:25:03またV0 Maxを使ってるんだ。それでSuperbaseをインストールした。これもV0が指示してきたからなんだけど、
00:25:12今はSuperbaseに接続したデザインインスピレーションとシードを生成してて、
00:25:18これからも続けてくれる。
00:25:20これで必要なものは全部揃った。
00:25:23いいね。最高。
00:25:25>> オーケー。これをやってる間に、もう一個やりたい。
00:25:36うわ、3つも別々のがある。
00:25:38>> そうそう、たくさんあるよ。
00:25:39>> たくさんある。すごく具体的なのが一つある。
00:25:43>> 一つ選ぼう。
00:25:48みんなで一つ選んで、それを読んでくれたら私がプロンプト入力を始めるよ。
00:25:54>> これ、実は同じやつで、同じものの2つのパートかもしれない。
00:26:00>> ええ、ここでは2つのパートに分かれています。
00:26:02>> ええ。
00:26:03これはGからのものかもしれません。
00:26:11Ready Player One風の、
00:26:14Pixarグレードのホリデーワールドを作って、
00:26:18Gをサンタにしてギフトをライブコーディングさせて。
00:26:23Gがサンタとしてギフトをライブコーディングするのが欲しいんです。
00:26:27ディズニーレベルの未来感が必要で、
00:26:30Gがコーディングしているパワーアワークリスマスカードを、
00:26:34SVGアニメーション付きのダウンロード可能な4×5アスペクト比のカードにして。
00:26:4115秒ごとにカスタムカードを1枚コーディングするようにすべきです。
00:26:46Vercel AIゲートウェイを、あなたが決めたやり方で使って。
00:26:50アリー、その点はあなたに選択権があります。
00:26:52>> 私はゼロに決めさせます。私じゃありません。
00:26:54>> コピーライター、ストラテジスト、モーションデザイナー、あなたが100%コントロールしています。
00:26:59>> わかりました。
00:27:02>> すごい。そこから始めましょう。
00:27:04>> それ楽しみです。
00:27:06>> わからないな。
00:27:07>> これが出てきました。
00:27:11一見、この価格アラート待機リストセクションが、実際に後ろのものをブロックしているように見えます。
00:27:20私のお気に入りの方法を使います。スクリーンショットを撮ってドラッグして、
00:27:28「このポップアップが後ろの画像をブロックしているので、
00:27:34移動するか、
00:27:35サイトの残りをブロックしないようにサイズを縮小して」と言います。
00:27:42それをやっている間に、この非常に具体的なプロンプトをコピーします。
00:27:52この人は、彼らがコントロールしていると、ゼロに言っているんだと思います。
00:27:57これがどうなるか見てみましょう。
00:27:59コピペするだけなら、私がこれを修正します。
00:28:03ちょっと怖いけど、すごく気になります。
00:28:14それが進んでいる間に。
00:28:20>> どこから画像を引っ張ってくるのか、本当に興味深いですね。
00:28:23>> コメントで確認されました。
00:28:25ええ、V0にコントロールさせるつもりだそうです。
00:28:27>> はい。完璧。いいですね。
00:28:29>> 言いたいことわかりました。
00:28:31このファッションサイトの新しい生成結果が出ました。
00:28:36これをここに下げましたが、今度は背景のせいで、それが何なのか本当に見えません。
00:28:43実は、これを修正できるか試してみます。
00:28:47>> デザインモード。
00:28:48>> はい。背景が欲しいです。
00:28:57えっと。これをやるとどうなるかな?
00:29:03ええ。ダサい。
00:29:07デザイン関係の人が見たら、「彼女何やってるの?」って思うでしょうね。いろんなオプションを見て回れます。
00:29:15かなり奇抜にできますよ。
00:29:18>> すごくクリスマスっぽい。
00:29:20>> どれがいいかな?
00:29:22>> クリスマス料理食べてるね。
00:29:24>> とりあえずこれで行きます。「保存」をクリックします。
00:29:37これは私と一緒にスクロールする上部ナビバーです。
00:29:43あまりきれいには見えないけど、前よりはマシです。
00:29:49実際に見えるようになりました。
00:29:50>> ええ。
00:29:51>> では、チャットに戻って、元のプロンプトに戻りましょう。
00:29:59彼らはGoogle Flightsのようなショッピング用の待機リスト機能が欲しかったんです。
00:30:02実は、これを入力すれば、私が欲しい商品になると思います。
00:30:10Nike Airの市場価格150ドルが欲しい。
00:30:17高すぎるように思えます。
00:30:18スニーカー、待機リストに参加。
00:30:22いいですね。ベースに接続しましたが、これを見てください。待機リストに送信した後の最終状態も、あまり良くありません。
00:30:34それを変更できるか試してみます。
00:30:37ええ。デザインモードで一番好きなのは、簡単な調整です。
00:30:47プロンプトを書く必要がなかった。何を言えばいいかわからなかったので。
00:30:50>> 私も時間が大幅に節約されます。特に細かいテキスト編集で直接入れるのは最高です。
00:30:58>> チームのメンバーが「これ今まで見た中で一番ダサいよ、
00:31:02アリー。なんでこんなことしたの?」って言いそうです。>> デザインモードの無駄遣いだね。
00:31:08>> エイミー、何か言おうとしてた?
00:31:11>> ただ、ええ、って言おうとしてただけです。
00:31:12どんな色にしたいかわからない時があるから、パッと「どんな背景色がいい?」って試せるのがいいんです。
00:31:19どんなテキストがいい?
00:31:21>> この非常に具体的な、
00:31:23ギレルモをサンタにしたReady Player One Pixarグレードのホリデーワールドに戻りました。
00:31:31彼の名前とかここに入れてくれましたが、その人は写真が欲しかったのかな、と思っています。
00:31:39あと、エラーがあります。
00:31:41>> 私はサンタとしてのキャラクター画像が欲しいんだと思ってました。
00:31:49でも、まだ聞いてるなら、アイデアをくれてもいいですよ。
00:31:54これはまだ画像じゃないので、実際には編集できません。
00:32:00それは要らない、って言います。彼らは何て言ってたっけ?
00:32:12ギレルモに実際に彼の写真を取得させたいです。
00:32:21添付します。どれどれ。
00:32:25写真があると思います。
00:32:32はい。ギレルモサンタに実際に彼の写真を取得させたいです。
00:32:491つ添付します。これを試してみますが、ここにあるカードコンパイラも動作していないことに気づきました。
00:32:59>> カードがインストールのために初期化しているようですね。
00:33:05>> おそらくこの人はゲーム、つまりワールドのようなものを求めていたのに、これはダッシュボードを構築してしまいましたね。
00:33:20>> そうですね。
00:33:23>> できました。画像が表示されて、サンタがいますよ。
00:33:30さて、プロンプト編集を見てみましょう。
00:33:38サンタ帽子をかぶせて。
00:33:45>> [聞き取れず] >> 待っています。
00:33:55さて、たくさんのオプションがありますね。
00:34:05どれが気に入りましたか?
00:34:07左のこれが気に入りました。
00:34:09>> ええ、より控えめですね。
00:34:12>> わかりました。サンタGができました。
00:34:16では、戻ってもう一つの部分を修正しましょう。
00:34:25実は、これだけでできます。
00:34:33このカードを生成できないというエラーが出ていました。
00:34:38実際に「V0で修正」をクリックしましたが、これは無料です。
00:34:41V0で修正を使用すれば、料金は一切かかりません。
00:34:43クレジットを使用することもありません。
00:34:45実際に修正されるまで続けられます。
00:34:49その間に、他にもあるか見てみましょう。
00:34:55>> ええ、もう一つ来ましたよ。
00:34:58>> V0のタブがたくさん開いています。
00:35:00準備万端です。
00:35:02>> 対応できますか?もう一つ対応できますか?
00:35:03>> できます。できるかって?様子を見ましょう。
00:35:06>> ええ、
00:35:07できますよ。これは
00:35:08「フードバンク慈善団体が使用する在庫管理アプリを構築してください」
00:35:12と書いてあります。これはいいですね。商品をスキャンし、
00:35:15在庫を記録し、
00:35:16困っている人に割り当てられる注文を作成する機能があります。
00:35:20顧客アカウントもあると思います。いいですね。
00:35:25>> わかりました。
00:35:26>> プロンプトにリクエストの時刻や予想受取時刻も追加できるかもしれませんね。そうすれば追跡できます。
00:35:37>> 実は拡張プロンプトをテストしてみます。
00:35:40>> ええ、おそらくキャロラインの拡張より強力でしょうね。
00:35:44>> 実は違います。何をするのか見たかっただけです。
00:35:49わかりました。では、プロンプトを変更しましょう。
00:35:51拡張プロンプトツールを使用すると、
00:35:53「フードバンク慈善団体向けに調整された包括的な在庫管理アプリケーションを設計し、
00:35:58商品スキャン、
00:35:59詳細な在庫記録、
00:36:00困っている人に割り当て可能な注文の作成などの機能に焦点を当ててください。
00:36:05システムは顧客アカウント管理をサポートし、
00:36:08ユーザーが登録して注文を追跡できるようにします。商品のバーコードまたはQRコード統合機能、
00:36:13在庫レベルを正確に反映するリアルタイム在庫更新、
00:36:16注文の作成と管理のための直感的なインターフェースなどの機能が含まれます。
00:36:20アプリケーションが、
00:36:21安全な顧客データ処理、
00:36:22簡単なナビゲーション、
00:36:23将来の追加機能への拡張性のニーズに対応し、
00:36:25すべてデスクトップとモバイル両方の使用に適したレスポンシブデザインで実現されるようにしてください。
00:36:30スタッフとボランティアのユーザー役割と権限を強調し、在庫と注文分析のためのレポート機能も検討してください。
00:36:36すごい。本当に良いですね。
00:36:42見てみましょう。またV0Maxになっています。
00:36:47戻ります。
00:36:49>> サンタGワールドゲームはMaxでしたか、それともProでしたか?
00:36:54>> Maxです。
00:36:56>> Max。
00:36:56>> わかりました。実際に動作しました。
00:36:59見てみましょう。でもカードは実際にレビューもダウンロードもできません。
00:37:07もう少しで「修正してください」と言うところでした。
00:37:18ミームのためだけでなく、真剣な作業でも実際にそう言ってしまう回数が多くて恥ずかしいです。
00:37:25今は実際に生成しています。
00:37:27メリークリスマス、温かい願いのカードを生成していますが、クリックしてプレビューすることができません。
00:37:32でもここにタイマーがあるので、15秒ごとに実行されているようです。
00:37:38あと1秒で、ええ、また1つ生成されました。
00:37:42最もユニークなカードには見えないので、それが次の貢献になるかもしれません。
00:37:49でも様子を見ましょう。
00:37:53フードバンクのものに戻っています。SupaBaseをインストールしますが、プランをアップグレードする必要があります。
00:38:10キャロライン、これをあなたに渡す必要があるかもしれません。
00:38:12>> ええ、そうですね。
00:38:13>> 見てみましょう。これはまだ構築中です。
00:38:20実は、この間にいくつかの問題を修正します。
00:38:34いいえ、まだです。
00:38:37>> ええ、チャットではカードがコンテナに合わせてスケーリングされていないようだと言っています。
00:38:44その件から少し離れました。
00:38:51わかりました。カードがコンテナに合わせてスケーリングされていないと言いましょう。
00:39:18どうなるか見てみましょう。いいですね。
00:39:22残り時間は約5分です。
00:39:26チャットで本当に試してみたいものが1つあります。見てみましょう。
00:39:31「Spotify WrappedのようなものをV0 2025用に作ろう」
00:39:37というリクエストがありますね。それを言及したのは面白いですね。
00:39:42>> 興味深いですね。
00:39:45>> Spotify Wrappedに似た年間振り返りをV0で作りましょう。今年のV0使用状況と統計のためのものです。
00:40:02今のところモックデータを使えばいいですが、生成するのは、みんなどう思いますか?
00:40:09クリーンで、白黒の、Vercelの雰囲気のあるデザイン。
00:40:17>> いいですね。
00:40:17>> お祝いムードにしましょう。
00:40:21>> 最適化できるかもしれません。
00:40:23ソーシャル共有用に最適化できますか?
00:40:25スクリーンショットを撮れるように。
00:40:28>> プロンプトニュースを試してみましょう。
00:40:37Spotify Wrappedに似ているけれど、
00:40:39今年のV0使用統計を表示するためにカスタマイズされた、
00:40:42包括的な年間振り返り機能をV0でデザインしてください。
00:40:45コンセプトを説明するためにモックデータを使用してください。
00:40:47素晴らしい。これを試してみましょう。
00:40:50それから、データについて質問できるAIチャットボットか何かを追加したいと思います。
00:40:59>> それは本当にクールですね。
00:41:08>> 見てみましょう。
00:41:11これをやっている間に、Pixar Holiday Worldを確認してみます。
00:41:21いや、まだ動いていません。
00:41:29明らかに、私のプロンプトの仕方が正しくないようです。
00:41:34このカードのコツがわかりません。
00:41:37他のものは全部動いています。
00:41:39>> 他のものは全部動いています。
00:41:40ここにGサンタがありますね。
00:41:42私がやっているか見てみましょう。
00:41:46カードはこんな感じです。
00:41:55みんな本当に、これはすごく無防備です。
00:41:58みんな本当に挨拶してますね。
00:42:00>> 私もそう言います。
00:42:02こんな感じだよって。
00:42:03>> こんな風に見えるべきじゃないんです。
00:42:06>> もしチャットにプロがいたら、教えてください。
00:42:10もし私がバカなことをしていたら、手遅れになる前に止めてください。
00:42:16>> でも思うんですが、
00:42:18チャットでスクリーンショットを送ることはできないと思いますが、
00:42:23カードがどのように見えて欲しいかのスクリーンショットをそこに追加できたら役立ちますね。
00:42:31>> 実は、このV0振り返りにすごくワクワクしています。
00:42:37>> 私もです、ナタリー。
00:42:38>> かなり強化されているので、少し時間がかかるかもしれませんね。V0 Maxを使っていますから。
00:42:43可能な限り最高の生成が欲しいんです。
00:42:45>> 最後は優雅さとお祝いムードのバランスを計算していました。
00:42:50>> その部分、見てなかったです。
00:42:53>> そうですね。
00:42:54>> V0がTwitterと呼んだのか、わかりませんが。
00:42:58さて、見てみましょう。
00:43:07これがログオフする前の最後の生成になると思います。
00:43:11でも、もしあなたのアイデアがプロンプトされなかったら、次回のためにアイデアを準備して来てくださいね。
00:43:17さて、V0 Wrapped、まだ処理中ですが、見えているものは気に入っています。
00:43:22>> あと、
00:43:23もし何かプロンプトがあれば、
00:43:25その間にAliにDMしてください。次のパワーアワーのために読み込んでおけますから。
00:43:32>> わかりました。これはカッコいいですが、2020年だと思っているようです。
00:43:37>> うわー、時間は難しい、数字は。
00:43:40>> 時間は難しいですね。
00:43:42>> でもアニメーションは好きです。
00:43:44>> そうですね、小さな星がかわいい。
00:43:46さて、それと雪の結晶全部。
00:43:48V0は雪の結晶が大好きなんですね、それが今日学んだことです。
00:43:50>> まあ、優雅でお祝いムードにするように指示しましたからね。
00:43:52>> そうしました。ほら、できました。
00:43:55さて、V0 Wrapped 2024。
00:43:58私の名前はDeveloper Pro。はい、その通りです。
00:44:00>> ええ、あなたはそうですよ。
00:44:02>> 明らかに、皆さんが見てきた通りです。
00:44:04今年、私は2,847個のプロンプトを送信しました。1日平均8個のプロンプトです。
00:44:11>> 1日平均がいいですね。
00:44:13>> ええ、クールです。
00:44:15いいですね、156個のプロダクト。
00:44:19うわー、コード行数はかなりカッコいいですね。
00:44:21繰り返しますが、これはモックデータで、私の実際のデータではありませんが、これを生成できたらとてもクールでしょうね。
00:44:25>> もっと感じます。
00:44:26>> 次のユーザーパワーアワーでそれを構築できますね。
00:44:30>> そうですね。
00:44:31>> 興味深い、テキストスタックの内訳、68パーセントがNext.js。大好きです。
00:44:40>> ああ、それはクールですね。
00:44:43>> 3.5時間、42時間。
00:44:46>> 節約した時間も表示されていますね、開発においてどれだけ簡単に時間を節約したか。
00:44:52>> それはクールでしょうね、特に開発者でたくさん使っている場合は。
00:44:55>> そうですね。
00:44:56>> わかりました。
00:44:57>> 夜更かしさん。
00:44:58>> アーリーアダプター、夜更かしさん、午前2時に最もアクティブ、絶対に本当じゃないです。
00:45:02>> それが本当じゃないといいですね。
00:45:04>> 私はおばあちゃんです。さて、多作なクリエイター。
00:45:07これはかわいいですね、上位3パーセント。
00:45:09>> とてもクールです。
00:45:10>> ああ、それは楽しいですね。
00:45:12ああ、それから見てください、シェア可能なものを作りました。
00:45:14>> いいですね。
00:45:14>> 実際にダウンロードできますか?
00:45:16できます。わあ。
00:45:18>> とてもクールですね。
00:45:19>> 素晴らしい。さて、ここで終わるのに完璧な場所だと思います。
00:45:24>> 気に入りました。
00:45:25>> わあ。時間があっという間に過ぎました。
00:45:28>> たくさん作りましたね。
00:45:29>> わかるよ。300時間以上費やせる理由がわかるね。
00:45:33素晴らしい。じゃあ、いいね。
00:45:37では、この初めての試みにご参加いただいた皆さん、ありがとうございました。
00:45:40楽しんでいただけたら幸いです。
00:45:42今後はゲストをお招きして、皆さんにもプロンプトを出してもらえるようにしたいと思っています。
00:45:45皆さんの方が私よりずっと上手でしょうから、大歓迎ですよ。
00:45:49でも、プロンプトを投稿してくださった皆さん、本当にありがとうございました。これからも続けていきますので。
00:45:54フィードバックをぜひお聞かせください。新年にこのゼロパワーアワーをたくさんやっていくのが楽しみです。
00:46:00素晴らしい。それでは改めて、ありがとうございました。
00:46:04>> じゃあね。

Key Takeaway

VercelのV0チームが初めてのPower Hourライブ配信を実施し、コミュニティからのプロンプトを使って多様なアプリケーションをリアルタイムで構築しながら、V0の機能と活用方法を実演した。

Highlights

V0 Power Hourの初回ライブ配信イベントで、V0を使ったリアルタイムビルドのデモンストレーション

ASCIIアニメーション、サンタトラッカー、ニュースレターアプリなど多様なプロジェクトを構築

V0 ProとV0 Maxの使い分け、Supabase統合、デザインモードなどの機能を実演

コミュニティからのリアルタイムプロンプト提案を受けて即座にアプリケーションを生成

フードバンク在庫管理アプリやファッションEコマースサイトなど実用的なユースケースを紹介

V0 Wrapped 2024(Spotify Wrapped風の年間振り返り機能)を最後に構築してデモを締めくくり

拡張プロンプト機能とデザインモードを活用した効率的な開発ワークフローを実演

Timeline

イントロダクションとPower Hourの概要説明

V0 Power Hourの初回配信が開始され、Vercelコミュニティチームのアリとキャロライン、エイミーが自己紹介を行った。この配信は週1回または隔週でV0を使ったライブビルドを行う試験的な企画として始まり、視聴者からのコメントを反映しながら進行する形式が説明された。最初のプロンプトとして、アンバサダーから「ASCIIシェーダーアニメーションを使ったV0 Power Hourのイントロ」を作成するリクエストが紹介された。V0がプロンプトを処理し始め、チームはホリデーをテーマにしたプロンプトのアイデアについて会話を交わした。

サンタトラッカーダッシュボードの構築開始

チームはサンタの業務用内部ダッシュボードの構築を開始し、ソリトラッカー、ルートプランナー、トナカイの餌やり、いたずら/いい子リストなどの機能をリクエストした。V0 Proモデルを使用してプロジェクトを生成し、視聴者からの質問に答えながら、V0 MaxとV0 Proの違いについても説明した。生成されたダッシュボードには動的に変化するサンタの位置情報やエルフのパフォーマンスリーダーボードが表示され、チームは色使いの改善をリクエストして、いたずらっ子といい子の区別をより明確にした。ASCIIアニメーションのイントロも完成し、テキストの可読性を向上させるための調整が行われた。

Community Voicesニュースレターアプリの開発

視聴者からのリクエストで、人道支援活動家が月を通じてアイデアやキーワード、気づきを集め、思いやりのあるコミュニティ重視のニュースレターを生成できるアプリの構築が始まった。V0 MaxとSupabaseの統合機能を使用し、データベーススキーマを持つ本格的なアプリケーションが自動生成された。チームはコミュニティからのリフレクションを入力例として使用し、アイデア収集機能をテストした。その後、生成されたニュースレターコンテンツをより長く魅力的にするためのプロンプト改良が行われ、社内のまとめ作業やスタートアップ向けニュースレターへの応用可能性についても議論された。

ファッションEコマースサイトとデザインモードの活用

シェーダーを使ったアニメーションランディングページを持つファッションEコマースサイトの構築がリクエストされ、全米の店舗から最安値を検索するGoogle Flights風の機能が追加された。生成されたサイトではポップアップが背景画像をブロックする問題が発生し、チームはスクリーンショットを使ってV0に修正を依頼した。デザインモードを使用して背景色やレイアウトの調整を手作業で行い、プロンプトを書くよりも効率的に細かい調整ができることが実演された。並行して、Ready Player One風のPixarグレードホリデーワールドプロジェクトも開始され、ギレルモをサンタにした画像生成が試みられた。

フードバンク在庫管理アプリと拡張プロンプト機能

フードバンク慈善団体向けの在庫管理アプリケーションの構築リクエストが来て、商品スキャン、在庫記録、注文作成、顧客アカウント管理などの機能が求められた。チームは拡張プロンプト機能を使用し、簡潔なリクエストを詳細な仕様書レベルのプロンプトに自動拡張させた。拡張されたプロンプトには、バーコード/QRコード統合、リアルタイム在庫更新、セキュアなデータ処理、レスポンシブデザイン、ユーザー役割と権限、レポート機能などが含まれた。V0 Maxを使用してSupabaseとの統合を含む本格的なアプリケーションが生成され、プロンプト拡張機能の有用性が実証された。

V0 Wrapped 2024の構築とまとめ

配信の締めくくりとして、Spotify Wrappedに似た年間振り返り機能「V0 Wrapped 2024」の構築が行われた。V0 Maxと拡張プロンプト機能を使用し、今年のV0使用統計を表示するカスタマイズされた年間レビューが生成された。完成したアプリには、年間プロンプト数、1日平均プロンプト数、生成したプロダクト数、コード行数、テックスタックの内訳、節約した開発時間、最もアクティブな時間帯などの統計が含まれた。さらに、ソーシャル共有用のダウンロード可能な画像も自動生成され、実用的な機能が実演された。最後にチームは視聴者に感謝を伝え、今後もゲストを招いてPower Hourを続けていく予定を発表し、初回の配信を成功裏に終了した。

Community Posts

View all posts