256times_07_課題06

256times 第0期の振り返り【課題#06】

2ヶ月遅れで私の256times 第0期の振り返りをしていますが、昨日は遂に5月から始まった第1期生の成果発表会が開催されていました。

紛らわしいタイミングの更新で恐縮ですが、私は引き続き2019年1月から3ヶ月感開催された第0期の振り返りをします。

前回までのnoteはこちら。

01. 【感想】256times第0期を卒業した今思うこと
02. 256timesの振り返り【課題選考】
03. 256timesの振り返り【課題#01】
04. 256timesの振り返り【課題#02】
05. 256timesの振り返り【課題#03】
06. 256timesの振り返り【課題#04】
07. 256timesの振り返り【課題#05】

※あくまでも私の個人的な感想です。
※第0期のカリキュラムを通しての感想です。必ずしも今後も同じカリキュラムとは限りませんので、ご了承下さい。

では、ささっといきます。

■ 課題#06 『イベント準備&UI基礎錬』

課題#06(3/27-4/9)
・UI基礎錬(4/2締切)
  - 課題テーマに基づく架空のサイトのUIをHTML/CSSでモック作成。
  - 自分的に一番かっこいいと思えるように仕上げること。
  - jQuery/Bootstrapの類は禁止。
  - スマホWebアプリ想定
  - ブラウザ幅が変わっても違和感がないデザインにすること。
・イベント発表コンテンツ100%完成(4/9締切)

■この2週間のメモ、学び&気づき

・発表コンテンツについて悩んでいたら、他のメンバーが色々意見をくれる。涙

・発表コンテンツは、自分がJavaScriptで最初に詰まったDOMツリー構造についてわかりやすいコンテンツを作りたい!と思っていたが、アプローチが難しくて煮詰まる。

・発表コンテンツの方向性が「ちょっとアレだね…」ということで、@taguchiさんのメンタリングを受ける。「どうしよう…!」と凝り固まっていた部分について、例えばこんなのとかあんなのとかどうですか?…とたくさんアイデアをいただき、目の前がパァァっと開ける。

・しかし、結局決めるのは自分。頭フル回転で、どうにか自分的も腑に落ちて、人にも少しは役立つようなテーマを見つけねば…と、ギリギリのところを這いつくばる。

・翌朝、テーマ再設定!!OKが出る。初学者の私にとっては、プログラミング学習においてモチベーション維持がすべてだったため、初学者の気持ちに寄り添うあるあるネタ集のサイトを作ることに。発熱からも復活。

・UI基礎錬では、余白の大切さについて徹底的にレビューいただく。あとフォントやボタンのサイズとかも。

・CSSが全然言うこと聞いてくれない。

・たった1ページのサイトUIイメージを作るだけなのに、CSSの理解が乏しく、指示をulにつけてみたりliにつけてみたり、毎回実験しながらやってものすごく時間がかかる。

・gridレイアウトを初めて使ってカードUIを作成!flexboxはspace-around等で均等配置しても、最終行の要素数が少ないとそこだけ中央揃えになって違和感あるけど、グリッドはデフォルトで左から埋めてくれる。

・よく忘れがちだった「liを横並びにした時にできる空白の消し方」を覚える。→ulにfont-size: 0;を指定して、実際の内容の方に正しいfont-sizeを指定する。
参考: https://dotinstall.com/lessons/basic_css_layout/35711 (2:05〜)

・発表テーマ変更に伴って結果的にサイトを2個作ったけど、大枠はすらすらっと作れて、Firebaseへのアップロードもスムーズになってきたことを実感。

・なんとなくスルーしていた絶対配置に向き合う!マスターしたはず!

・配色とかレイアウト、むずかしすぎる。

・UIもむずかしすぎる。

・自分では「こうやって使うんだ!」とわかっていても、ユーザーには1/3も伝わらない。

・marginとの戦い。

・line-heightで行間をとることの大切さ。単位無し数値のみ指定する方が、後々フォントサイズを変えた時に修正不要で便利。

・自分で素材集めるのってタイヘン…。

・「誰かのために、何か自分の経験に基づいたコンテンツを作る」ためには、普段からそういう目線で過ごしてないと、いきなり考えるのはなかなか難しかった。

■まとめ

自分の勉強や経験の何が人の役に立つのか?というのは、普段からそういう目線で物事を見ていないと、突然作ろうと思ってもなかなか厳しいことを痛感。

もう無理かも…と落ち込んだ状態から復活できたのも、@taguchiさんや他の受講生の温かいサポートがあったからに尽きます。

この2週間は、UIって難しい!CSSって超難しい!!と唸ってました。
余白や配色など、たくさんのコツを教えていただきました。なんとなくスルーしてた絶対配置を理解して使えるようになったのが良かったです。

webサービスでよく見るUIって、ほんとすごいんだなぁ。

残すはラストの1週間。次回へつづく。