プログラミングやWebデザインのオンラインスクール「TechAcademy」ではCacooをコース教材として導入しています。Webデザイン初学者向けのWebデザインコースでは、ワイヤーフレームやサイトマップの作成方法をCacooで解説、受講生とメンターの制作物提出や共同作業にも活用しています。TechAcademyご担当者にWeb制作やコースでCacooを活用する方法をお伺いしました。
■プロフィール（写真左から）
- 伏田雅輝（ふせだ・まさき）：キラメックス株式会社 取締役 ブートキャンプ事業の責任者
- 浅見憲司（あざみ・けんじ）：ブートキャンプ事業部 カリキュラムディレクター
| 課題と導入目的 | ■Webデザイン初心者にも易しい作図ツールが必要 ■制作物の提出やレビューをオンラインでリアルタイムにやりたい ■160時間内の受講生とメンターのコミュニケーションを効率化したい |
| 効果 | ■Webデザイン初心者でもワイヤーフレームやサイトマップを簡単に作図ができた ■メンターと受講生のコミュニケーションや共同作業がオンラインで完結 |
| 業種 | Web制作 |
| Cacooを利用している事業部 | ディレクター、コース受講生 |
| 利用しているヌーラボサービス | Cacoo、Backlog |
目次
2.5万人の受講生を誇るオンラインスクールのTechAcademy
――キラメックス様の事業概要について教えてください。
伏田雅輝（ふせだ・まさき）：キラメックス株式会社は、プログラミングやWebデザインなどを学べるオンラインスクール「TechAcademy」を運営しています。TechAcademyでは、個人向けのスクール、企業向けの研修、子ども向けプログラミングスクールのTechAcademyキッズなど大きく3つの事業を運営しています。今まで25,000人以上の方に受講いただいています。
――TechAcademyにはどのようなコースがあるのでしょうか？
伏田：Webデザインやプログラミング、アプリ開発などを学べる29コースを用意しています。受講生のオンライン学習は、現役のプロのパーソナルメンターがフォローします。メンターは合計300名以上在籍しており、マンツーマンメンタリング、毎日15時から23時のチャットサポート、課題レビューなどを行います。
キラメックス株式会社 取締役 伏田雅輝さん
160時間のWebデザインコースはプロのWebデザイナーを育成する
――CacooをTechAcademyのコース教材として使用しているそうですが、どのようなコースで利用しているのでしょうか？
浅見憲司（あざみ・けんじ）： Webデザインコースとプログラミング関連のコースのカリキュラムにCacooを利用しています。
――Webデザインとプログラミング関連のコースではCacooをどのように活用していますか？
浅見：Webデザインコースは、学習時間160時間でオリジナルサイトの制作を目指す学習プログラムです。HTML、CSS、JavaScriptを使って課題となるWebサイトを受講生に制作してもらいます。Cacooはコース内で制作するすべてのWebサイトの、ワイヤーフレームとサイトマップの作成に利用しています。
プログラミング関連のコースでは、独自でオリジナルのWebアプリケーション開発をするところまでがゴールとなっており、企画設計の段階で、Cacooでサイトマップやワイヤーフレームの他、データベースのER図を作成してもらいます。
ブートキャンプ事業部カリキュラムディレクター 浅見憲司さん
――Cacooで作成したワイヤーフレームはWeb制作ワークフローのどの場面で使用していますか？
浅見：Webデザインコースを例にすると、Cacooでサイトマップとワイヤーフレームの作成 →Photoshopでデザインカンプの作成 → コーディングという流れでサイト制作を進めていきます。
同コースは前半と後半に分けており、前半はWebデザインの原則や制作フローを学んでポートフォリオサイトを実際に作成してもらいます。後半はコーポレートサイトとショッピングサイトのサンプルデザインを作成してもらい、最終的にオリジナルサイトのWebデザインを制作してもらいます。
前半のポートフォリオサイトの例では、Cacooでワイヤーフレームを作成したら、Photoshopを使ってデザインカンプを作成します。さらにその後、デザインカンプを基にHTMLとCSSでコーディングをして、ウェブサイトを完成させるという流れです。
Webデザインコースでの課題で使用されるワイヤーフレーム
SP（スマートフォンサイト）、タブレット、PCなどのデバイスにあわせて作成されたワイヤーフレーム
メンターと受講生がCacooで共同制作できる環境は手戻りの防止に繋がる
――TechAacdemyのコース教材にCacooを導入した効果はいかがですか？
浅見：学習段階では無料で使えて、利用方法の習得コストが低く、メンターと受講生が制作物のレビューをオンライン上で簡単にやり取りできるのに魅力を感じて、Cacooを選んだのですが、導入した結果、狙い通りの効果を得られて満足しています。
――オンラインレッスンだからこそ、オンラインで制作物の提出やレビューが完結するのは必須ですね。
浅見：そうですね。Webデザインコースでは、週に2回メンターと受講生のマンツーマンメンタリングがあります。その際に、受講生がCacooで作成したワイヤーフレームやサイトマップをメンターがリアルタイムで添削したり、アドバイスしながら修正したりします。Cacooを使うことでこういった共同作業ができるのは大きな利点です。
160時間という限られた時間でカリキュラムを進める必要があるので、Cacooで成果物の認識合わせながら共同制作を進められるのは、手戻りの防止にも役立っています。
週2回のメンターと受講生が顔を合わせて質疑応答するマンツーマンレッスンマンではCacooが使用されている
TechAcademyに必要な「無料・簡単・共有」の3条件がCacooに揃っていた
――TechAcademyを運営されている方からみてCacooの使い勝手はどのような印象を持ちますか？
浅見： Cacooを選んだのは、無料で使える、直感的かつ簡単に使える、制作物を共有できる、という3つの理由があります。特に、共有できるという点では非常に助かっています。Cacooは、作成した図のダウンロードもできますが、ダウンロードした画像ファイルをURLを送るだけで共有できるので、受講生・メンター双方にとって有用なツールだと思います。
Cacooを選んだ理由を「無料・簡単・共有」の3つとお話しする浅見さん
――CacooはWebデザイン初学者でも使える作図ツールですか？
浅見：はい。直感的に使えて習得コストが低いので、CacooはWebデザイン初心者にも自信を持っておすすめできます。実は、私自身もカリキュラムの説明資料の作成にCacooを利用しているのですが、他の作図ツールと比較してとても使いやすいと感じます。
Cacooを使う前は、WindowsペイントやPhotoshopを使って図版を作っていたのですが、操作や図の管理などが煩雑で使いづらく……。その点、Cacooは操作性も申し分ないですし、図の管理も簡単なので助かっています。
ちなみにカリキュラムの作成には、Cacooだけでなくプロジェクト管理ツールのBacklogも使用しています。企画から公開までのスケジュールをガントチャートで管理して、関係各所の調整や連絡は親子課題で管理しています。BacklogにCacooの図のURLを挿入すると図が自動で展開するので併用すると便利ですね。
伏田：Backlogはキラメックスのプロジェクト管理ツールとして全社的に使用しています。社員一人ひとりにアカウントを発行しており、事業部と開発チームの橋渡し役として、プロジェクトやタスクの共同管理に活用しています。
TechAcademy運営チームのカリキュラム作成ではCacooが利用され、サービス提供元であるキラメックス社のプロジェクト管理にはBacklogが利用されている
――今後CacooをTechAcademy内の別のコースで使用する計画はありますか？
浅見：はい。プログラミング関連のコースで更に活用したいと考えています。具体的には、初心者向けの内容としてプログラムの流れ図、上級者でしたらシステムやネットワークの構成図などです。
Cacooはテンプレート機能も豊富なので、そうした機能を活用して、初学者でも学びやすいカリキュラムを充実していきたいです。
▼Web制作に関するおすすめ記事はこちら
- Web制作チーム必見！アイデアや作業工程の可視化に便利な図4選
- 「図の共有がリンク1つで完了！」フリュー株式会社がライセンス契約の作図ソフトからCacooに移行した理由
- 簡単！Cacooで作るアプリとWebサイトのプロトタイプとは？
- モックアップの作成工数を50%削減！中古車オークションサイト「カープライス」のCacoo活用事例
