Create.xyzで子供もAIプログラミング！エンジニアが考える学びのポイント

AI時代のプログラミングは「アイデアを形にする力」が鍵です。AIが自動でコードを生成する「 Create.xyz 」を活用し、子供でも簡単にプロ級のサイトが作れる新しい学びを紹介します。創造力を育むヒントが満載です！

Create.xyzがもたらすプログラミング学習の革新

今、プログラミングの学び方を大きく変えているのが「Create.xyz」というプラットフォームです。Create.xyzは、 AIがユーザーの指示に基づいてコードを自動生成し、簡単にWebサイトの公開までできる 革新的なツールです。

例えば、「ペットの紹介サイトを作りたい」と自然言語で伝えるだけで、AIがページ構成やデザイン案を自動で提案し、HTMLやCSS、JavaScriptといったコードまで生成します。「背景を青にして」「ボタンを丸くしたい」といった細かな要望にもリアルタイムで対応可能です。

子供でもプロ級のWebサイトを作れる時代

Create.xyzの最大の魅力は、「 子供でもプロが作ったような立派なWebサイトを作れてしまう 」ことです。

従来のプログラミング学習では、Webサイト制作だとHTMLやCSSの文法を覚えたり、デザインの知識を身につける必要がありました。しかしCreate.xyzでは、AIがそれらの作業を代行し、ユーザーはアイデアを伝えるだけで本格的なWebサイトが完成します。

実際に、Create.xyzを使った子供が大人顔負けのデザインや機能を持つサイトを作り上げる例も増えています。こうした体験は子供たちに「自分でもこんなことができるんだ」という自信と達成感を与えます。

さらに、Create.xyzは 作ったサイトをそのまま公開できる ため、家族や友達にシェアしたり、学校のプロジェクトとして活用することも可能です。これにより、「作る楽しさ」と「人に見せる喜び」を同時に味わうことができます。

下記のWebサイトは、ビジュアルプログラミングが苦手だった中学生の娘が作ったものです。AIを埋め込んだチャットサービスやWebゲームなども簡単に作ることができたと言っていました。

【 娘が作った作品紹介ページ 】

娘がCreate.xyzで作った作品紹介ページ

【 もぐらたたきゲーム 】

娘がCreate.xyzで作ったもぐらたたきゲーム

要件定義と機能分解のプロセスを学ぶ

AIがコードを書いてくれるからといって、何も考えなくてよいわけではありません。重要なのは、「どんなものを作りたいか」を具体的に思い描く力と、「作成に必要な機能」を細かく分解する力です。

システムエンジニアリングの世界ではこの2つの項目を決定することを要件定義といいます。

システムエンジニアが要件定義をしっかり行うことでプロジェクトの成功率が高まるように、Create.xyzを使う際も以下のようなプロセスが欠かせません。

・どのような画面が必要か？
・どんな情報を掲載したいか？
・ユーザーが操作できるボタンやフォームはどのようなものか？

こうした要素を一つひとつ洗い出すことで、プログラミング以外でも役立つ「論理的思考力」や「問題解決力」が自然と身につきます。Create.xyzを使うことで、子供たちは「 目的を明確にする力 」と「 アイデアを具体化するスキル 」を同時に磨くことができるのです。

アイデアを具体化すると要件定義書になります。例として、小学生ぐらいの子供でも作れるレベルの要件定義書を作成しました。この内容を基に、実際にCreate.xyzでWebゲームを作ってみます。

このあと制作する作品の要件定義書

Create.xyzのはじめかた

Create.xyzのWebページ を開き、ログインをします。

ログイン画面へ移動する

初回はサインアップします。次回以降は初回で登録したメールアドレスを入力すると登録したメールアドレスにログインリンクが届きます。

ログイン画面からサインアップ画面へ切り替える

次回以降ログインするために使用するメールアドレスを入力しサインアップします。

サインアップ画面でメールアドレスを入力する

ログインが完了したらトップ画面が表示されます。トップ画面の左下にチャット欄があり、ここに制作したいもののイメージを入力し「Send」をします。

トップ画面で対話しながらWebサイトを制作する

これだけでも簡単なWebサイトが完成します。でも、背景がさみしいですね。そんな時はチャット欄に「背景の画像を、◯◯をイメージした画像にして下さい」などと入力し「Send」を繰り返し改善します。

Webサイトの改善を行う

次に、Webサイトを公開する場合は右上にある「Publish」ボタンを押します。公開するとすべての方に見えてしまうので、自分だけで楽しむ場合は、この操作は行わないで下さい。

キャプション: 完成したWebサイトを公開する

公開するURL名を決めます。

公開するURLを設定する

決定したURLページにアクセスすると閲覧することができます。たったこれだけのステップで、Webサイトの制作を行うことができます。

公開したWebサイトにアクセス

もっと使ってみたいと思っていただいた方は、 Create.xyzの公式ドキュメント がとても参考になります。英語が苦手な方はブラウザの翻訳機能でもかなり読みやすい構成になっています。

ぜひ、大人の方も含めていろいろなWebサイトを作ってみて下さい。

プログラミング学習の本質は「要件定義」と「ドメイン知識」にあり

これまでのプログラミング教育では、言語の習得やロジックの理解に膨大な時間と労力を費やしてきました。

しかし、システム開発の現場で最も重要なのは「何を作るか」を明確化する要件定義です。加えて、医療や金融など特定の分野の深い知識（ドメイン知識）を身につけることこそ、求めるシステムを正しく形にするためのカギとなります。AIがコード生成を担う時代だからこそ、要件定義の精度や分野への理解がプログラミング教育の要となり、そこにこそ学習の真価があるのです。子供の可能性を後押しし、一緒に「何を作りたいのか」を考える時間を大切にしてあげてください。

最後に、Create.xyzは発信をする際の強力なツールです。イベントの紹介ページなどアイデア次第で様々な使い道があります。皆様もぜひ活用してみて下さい。