【Studioはじめてみた #11】魔法なし、自力勝負。最終課題スタート！

こんにちは、IT+の巴です。
現在、caroa campでStudioを勉強中。基礎編を終え、発展編の真っ最中。
いよいよ最終課題（発展課題②）に挑戦です。
Studio学習もついに11週目（全13週）に突入しました！

前回（10週目）の記事「【Studioはじめてみた #10】打ち消して、崩して、また積む。新たな修行の記録」もぜひどうぞ。

ホバー地獄を抜けたと思ったら、今度は“ゼロから作る”修行編に突入。
どうやらこのコース、最後まで気を抜かせてくれないようですw

修行続きの課題もついに4つ目。
今回はいったい、どんな新たな試練（そして発見）が待ち受けているのでしょう！？

1. 東京に戻って、ようやく腰を据えて…？

アクティブな夏休みもついに最終週。
日本各地を旅して回った夏も一区切りし、ようやく自宅のある東京へ帰還。

「さあ、やっと腰を据えて勉強できる！」…はずなんですが、この言葉、もう何度言ったでしょう（笑）

夏休み最後の日まで、子どもたちの習い事やイベントで予定はびっしり。
結局、静かな時間は夜だけといういつもの展開に。

caroa campの集中講座も残り3週。
このタイミングで登場したのが、最終課題――「ポータルサイト制作」。

テーマは、架空の島の移住情報を発信するポータルサイト。
発展課題①で学んだ「RSS」「CMS」「アニメーション」をベースに、さらにオリジナル要素を盛り込む“チャレンジ編”です。

2. モデルサイトなし、魔法使いも不在。

これまでの課題では、参考サイトや解説動画がありました。
でも今回は──なし。

頼れるのは、Figmaのデザインカンプと
Googleスプレッドシートのディレクトリマップ1枚だけ。

要するに、道しるべはあるけど道筋は自分で切り開くしかない状態。
（地図はあるのにルート案内がないタイプですw）

しかも！発展課題①のような“魔法使いの解説動画”もなし。
ついに一人立ちのときが来たようです…（震）

3. 情報を読み取るところからスタート

まずはディレクトリマップとFigmaのデザインカンプをにらめっこしながら、ページ構成を読み取るところからスタート。

ディレクトリマップを確認していると、自分がこれまで“何となく”理解したつもりになっていたことに気づきました。

OGPの意味、タイトル設定、index指定など、「今さら！？」という基礎の理解抜けがポロポロ出てくる。

“理解して作る”とは、まさにこのこと！

4. Figmaの迷宮、そして迷子

やっと必要なページを揃え、トップページのファーストビュー周辺から構築へ！
……のはずが、一瞬で失速。

デザインカンプを見たときは「今回は落ち着いたデザインだし、前回より簡単そう」と思っていたのですが、実際に手を動かしてみると、まったく進まない。

何度FigmaとStudioのデザインエディタを行ったり来たりして、数値を読み取って構築している“つもり”でも、見た目がまったく揃わない。

Figmaを隅々まで見れば見るほど、逆に迷子にww

「これは勉強だ！」と自分に言い聞かせ、一瞬“Figma to Studio”を試してみようとしたのですが。。。
（決して諦めやズルではなく、これも学習です！w）
まさかの閲覧権限しかなく、あっけなく撃沈。

ズル（いや、効率化！）は封じられ、結局すべて自力でコツコツ構築することに。

5. トップページの壁、再び

トップページのファーストビュー周辺からまったく進まず。
こっちの数値を変えたり、あっちの設定をいじったり。
そして、デザインもあっち行ったりこっち行ったりwww

数日格闘の末、「いったん飛ばして先に進もう」と切り替え、他のセクションを先に進める作戦にww
（今度こそ、ちゃんとレスポンシブ設定も忘れずに！）

やっとなんとか、トップページを“ひとまず”上から下まで構築完了。

残った課題は以下の4つ。
① 追従ナビゲーション
② 追従するメッセージタグ
③ 横スクロールのタグ一覧
④ 背景にオブジェクトを埋め込む表現

どれも一筋縄ではいかなそうな内容。
ここからが本当の“最終課題”らしい部分かもしれません。

6. まとめ

今週は、見本なし・解説なし・助けなしの完全自力構築。
魔法使いもいない中で、自分の力で読み取り、考え、形にしていく時間でした。

完全自力構築。限りなく実務に近い課題設定！
やはりcaroa campの学習は、“愛のあるスパルタ教育”です。

次週はいよいよトップページの残した難関へ！
果たして“ポータルサイト”は残り2週で無事完成するのか！？

そして忘れてはいけない、課題③のメンターさん添削後の修正も待っています…。

ではまた、Vol.12で！