{5827B669-020C-48B8-9AAC-12BEFD69433C}

1月25日にプログラミング学習サイト「Progate」のiOSアプリ版がリリースされたので早速試してみました。この「Progate」というサービスは、会員登録(Facebookログイン、Twitterログイン、メールアドレス登録)することでオンライン上で様々なプログラミングが学べるe-ラーニングなんですが、とにかくUIが直感的で分かりやすいのが特徴です。今回リリースされたアプリ版はそのUIをスマートフォン向けに最適化したもので、PCを持っていない小・中・高校生・大学生、通勤・隙間時間を活用したいプログラミング未経験ビジネスパーソンのスキルアップ、子供と一緒にプログラミングの勉強を始めたい保護者の学習の入り口等を想定しているとか。

 

{6B60C981-F115-44A9-977C-C7685F103241}
PC版を利用したことがなくてもアプリ内から新規登録可能です。

 

{D141278D-7E4C-4DDC-85AA-F877024B0455}

子供の利用を想定してか、かわいいキャラクターが頻繁に出てきて非常にカジュアルな印象です。

 

{844768B2-2D6B-4C01-B4C7-F56AD06A0DA6}

アプリ版で学習できるのは、現時点ではHTMLとCSSのみですが、今後のアップデートでJavaやRubyなども追加されていくそうです。PC版は基本無料&追加課金システムですが、アプリ版も学ぶ内容によってそうなっていくのでしょうか?

 

{FAA895CB-D34A-46A0-A897-679513C801AC}

とりあえずHTMLの初級をおさらいしてみましょう。

 

{562AB986-2D18-47E0-8CF8-1DB51D7135B2}

「Progate」の特徴は、ただスライド教材を見るだけでなく、その後に実際にコードを書学べることなんですが、それはアプリ版でも健在です。

 

{2DD1B936-25C0-4200-8A79-46ED7BF70CCD}
”教科書”という感じではなく直感的に理解できるようなレイアウトで、これなら子供でも難なく読めるでしょう。

 

{5BC499F7-8E6C-4796-8074-74A4DB15717D}

HTMLでは一種類のタグについてスライドで学んだら即実践に映ります。

 

{7E8AFF1C-4938-431D-B999-E5072D2414F1}

まあ書くといってもスマホなので実際には演習画面で独自のキーボードから”選択”するんですけどね。

 

{2CDF101C-8394-4661-91E9-DE12FFA93569}

画面の右側でコードを書くとそれがすぐに左側で反映されるという実に分かりやすい仕組み。

 

{6890B36C-4AB2-4F92-8B1C-ABE775AF3E40}

それが正解だと次に進めます。

 

{3A36ECD3-C69A-48FE-AF15-600417C4E103}

ここで面白いのは、一つこなすとかアプリ内ポイント的なものが付与され、それが一定数貯まると「Level Up!」となりレベルが上がること。この演出のため、学んでいるというよりもゲームをプレイしている感覚で次々と学習を進められます。まさにゲーミフィケーション。

 

{FA6C400A-2F3E-4B8E-98D6-7814B263B696}

一番最初のHTML&CSSは全23ページありますが、こうしたUIのおかげで「まだこんなにあるのかよ…」とゲンナリすることなくサクサク学習を進められます。カジュアルな見た目ですが、その分まるっきりプログラミングについて分からない人でもとっつきやすく、大人でも隙間時間の暇つぶし間隔で学べて良いんじゃないでしょうか。ダウンロードは無料なのでよかったら試してみて下さい。