デザインとプログラミングの両方に共通する2つの勉強法【超初心者向き】

アイキャッチ 本

こんにちは。カトー(@hisayosky)です。

 

けん子
デザインとプログラミングに興味あるけど、どうやって勉強したらいいの?

 

という疑問に答えます。

結論は、

基本操作 + 模写

これをひたすらやれば基本的な力はつくはずです。

 

ぼく自身の勉強歴をお話ししますと、デザインは今年2月から奥貫あずささん(@azuazu320)に10回シリーズで教えてもらっています。

あと1回ですべて終了します。

9回終了時点でオリジナルのバナー、フライヤー、名刺、ロゴなどが一通り作れるようになっています。

 

プログラミングはiSara3期に参加しまして、5月28日から勉強を始めました。

勉強をはじめて17日目ですが、HTMLとCSSはひと通り書けるようになっています。

 

どちらも勉強の仕方が本当によく似ているんですよね。

今回はデザインとプログラミングの両方に共通する勉強法について解説します。

ではいってみましょう。

 

デザインの勉強方法

片付いたデスク上

基本操作

☑ソフト

PhotoshopとIllustratorを使えるようにします。

奥貫さんの講座では毎回必要な操作の説明を受け、それを使って課題に取り組んでいました。

 

☑伝わりやすいデザインの4原則

  • コントラスト(強弱)
  • 反復(繰り返し)
  • 整列(余白)
  • 近接(グループ化)

 

これをきちんと理解して使えるようにします。

「使えるようにする」のがポイントでして、この原則を使わないとデザインってできないんですよ。

本当に重要なので講座では叩き込まれましたね。

 

模写

例えばこんなバナーを模写します(講座で使ったものではありません)。

バナーサンプル

Pinterestより転載

模写の対象はいろいろです。バナーとフライヤーでやりましたが、本当になんでもよいと思います。

模写することでソフトの操作が体で理解できます。

何より大きいのは「まねのしかた」がわかることです。

 

まねはオリジナルを作るときに必要なスキルです。

奥貫さん

素人ほど真似しませんね。逆にプロは本当によく人の作ったものをパクります

 

まねには慣れが必要です。ぼくははじめ、どうやってまねたらいいかわかりませんでした。

わからないと自分流でやってしまいそうになるんですが、そこをこらえてまねに徹することです。

 

プログラミングの勉強法

プログラミング画面

ぼくはまだHTMLとCSSしか勉強していないのでその範囲で書きます。

 

基本操作

☑Progate

初心者向けのプログラミング学習教材です。月額980円でオンラインで勉強できます。参考書は一切不要のすばらしい教材です。

▼関連記事
プログラミング初心者がProgateで「HTML & CSS」に取り組むコツ【挫折防止】

 

出されるままに課題をこなしていくと、自然とコードを書くことに慣れていきます。

やってみてわかりましたが、本を読むより言われるままに書いたほうが習得は早いです。

課題が細切れになっていて、段階づけが非常になだらかになっているのがよかったですね。

 

☑テキストエディタ

Progateでコードが書けたら、テキストエディタで書いていきます。

ぼくはSublime Textという有料ソフトを使っています。

 

はじめから環境を作っていく経験はテキストエディタでないとできません。

Progateとテキストエディタはまったく別」と思っていた方がいいです。

だいたい同じと思っていると、Progateでできたことがことごとくうまくいかなくてかなり凹みます。

 

模写

例えばこんなサイトを模写します(参考例です)。

camp hackサイト

CAMP HACKより転載

寸法は目分量で、とにかく見た目が同じになるように作っていきます。

デザインならこれでおわりですが、プログラミングの場合はさらにレスポンシブ対応ができるように手を加えます。

 

レスポンシブWebデザインとは

PC、タブレット、スマートフォンなど、複数の異なる画面サイズをWebサイト表示の判断基準にし、ページのレイアウト・デザインを柔軟に調整することを指します。

出典:必読!5分でわかるレスポンシブWebデザインまとめ|LIG

 

時間がないなら独学はおすすめしない

勉強する女

以上がデザインとプログラミングの基本を身につける勉強法でした。

こうして見ると独学でも十分できそうですよね。

 

もしデザインやプログラミングを早く身に付けたいなら、独学より習うことをおすすめします。

人に習うことの利点は、「必要なこと」を「必要なとき」に「いい順番」で「少しずつ」提供してもらえることです。

独学だと必要なことを探すところからやらねばなりません。多くのエネルギーと時間を学習以外のところに割くことになります。

 

デザインもプログラミングも独学でできるようになった人は確かにいます。

一方で挫折した人は比較にならないくらい多いはずです。

早く確実にできるようになりたいなら、独学じゃない方法も調べてみてはいかがでしょうか。

 

まとめ:デザインとプログラミングの初期の学習法は両方に共通している

  • どちらも「基本操作+模写」で基礎力がつく
  • 本を読むより手を動かすのが重要
  • 早く確実にできるようにしたいなら、誰かに習うのがおすすめ

 

▼最後まで読んでくれたあなたにおすすめの記事
プログラミング初心者がペラサイトのコーディングをやってみてわかったProgateの限界

▼ノマドエンジニア育成講座「iSara」に参加する動機を書いた記事
今日からiSaraでプログラミングをはじめるので動機をまとめておく

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です