【Studioはじめてみた #13】最終週、夏休みの宿題ノリで追い込み！

こんにちは、IT+の巴です。
現在、caroa campのパーソナルプランでStudioを学習中。

メンターさんが3ヶ月間マンツーマンで伴走してくれるこのプログラムも、ついに全13週の最終週を迎えました！

3ヶ月のプログラムでは、基礎編・発展編それぞれ2つずつ、計4つの課題提出があります。
そして現在は、その最後の課題――発展編課題②に絶賛全力投球中！

前回（12週目）の記事「【Studioはじめてみた #12】夏休み明け、仕事も課題もフルスロットル！」もぜひご覧ください。

1.  残り課題、山盛りスタート

最終週に残ったのは、あの難関「横スクロールのタグ一覧」。
さらに、トップページ以外の下層ページもまるっと未着手。
おまけに、発展課題①の添削フィードバック修正もまだ…！

──そう、これはもう“夏休み最終日の小学生モード”です（笑）
「なんでここまで残したんだ…！」と自分にツッコミを入れながら、地道にコツコツ、怒涛の1週間がスタート。

2.  救世主・溝口登場！

そんな中、タイミングよく弊社の溝口と会う機会があり、迷わず「助けてー！」と泣きつきましたw

そこで初めて知った衝撃の事実。
なんと、Studio Design Award グランプリ受賞サイト「旅と仕事と」にも、この「横スクロールのタグ一覧」が使われていたのです！w

何度も見ていたのに、気づいてなかった…！ww

しかも溝口曰く、「今まで作ったサイトの中で一番苦労した実装」だったそうです。

まさかそれがStudio学習2〜3ヶ月の課題に出てくるとは！！

やっぱりcaroa camp、最後の最後まで“愛のあるスパルタ教育”ですw

3.  プロでも正解がない!?

「答えが分かる！」と喜んだのも束の間。

溝口の第一声は、
「正解は分からないけど、いろいろ試してこの方法に落ち着いたんだよね〜」

……Studio歴の長いプロでも、試行錯誤の連続！
その一言で、なんだか気が楽になりました。

💡 後日談

アイティプラスが月に一度開催しているライブ配信、【第5回アイティプラスの雑談】「溝口に聞いてみたい、あのWebサイトの構築方法やStudioの使い方」にて、溝口が実際のStudio画面を使って「旅と仕事と」内の“横スクロールのタグ一覧”の実装方法を解説しています。

よろしければぜひご覧ください。↓↓
https://www.youtube.com/watch?v=kdw0RgFUQ3E&t=3187s

4.  溝口式・横スクロールタグ実装法

さて、溝口考案の方法はこちら↓

• カルーセルにすべてのタグを入れる

• 1タグ＝1divではなく、各divに7タグずつ入れる

• 画面横幅を360%に設定し、レスポンシブ対応させる

言われた通りに実装してみたら――

できたーーー！！！

動く！スムーズ！変な挙動なし！
そして何より、ちゃんとスクロールする！！

あとは速度を微調整し、スムーズな動きに。

不思議な挙動も消え、ついに“爆笑カルーセル”からの脱出成功！w
（人の力に100％頼りましたがw）

5.  爆速モード突入！

タグ一覧が完成した瞬間、テンションとモチベーションが一気に爆上がり。

その勢いのまま、下層ページを怒涛のスピードで構築。
メニュー、問い合わせ、問い合わせ完了、記事ページ、検索結果ページ、カテゴリページ、タグページ……

気づけばすべて完成！
さらに、発展課題①の修正も無事クリア！

「人はやればできる！」と声に出して言いたいw
完全に、夏休みの宿題をやり切った小学生の気分です。

6.  3ヶ月の学び、そしてこれから

なんとか3ヶ月のマンツーマンプログラム内で4つの課題すべてを完走！

まだまだStudioで覚えることは山ほどありますが、最初はボタン一つ押すのにも戸惑っていた自分が、いまや“構造を理解して組み立てる”ところまで来られたのは大きな成長。

もしかしたら、これが“自走力”というやつかも…？

7.  最終検証結果

📘ウェブ制作経験ゼロの超初心者でも、3ヶ月でStudioを使えるようになる！

これが、私のリアルな実証結果です。

caroa camp、本当にありがとうございました！

また次の挑戦が始まる予感を抱きつつ――

ではまた、どこかで！