数学苦手なド文系法学部だった人間が、これからプログラミングやデザインを始められる人に向けて贈るメッセージ【個人的おすすめツールや勉強の仕方・始め方】

# これからプログラミングやデザインを始められる人に向けて【個人的おすすめツールや勉強の仕方】
最初って何から手を付けたらいいかわかんないですよね
僕もまだペーペーのものですが、初心者の時、網羅的に知っておくべきツールや勉強の仕方が書いた記事あったら良かったなって思うので書いちゃいます。
決して、僕ってすごいでしょ！とかいう気持ちはなく（むしろ日々実力のなさに泣いてます）
駆け出しの皆さんの背中を後押ししたいから書きますう。

ざっくりこんな感じで書きますね
>
・学習に当たって大切だと思うこと
・プログラミングを始められる方へ
・デザインを始められる方へ


## 学習に当たって大切だと思うこと
### ソフト面
個人的にソフト面で大切なのは
>
・横の繋がりと斜めの繋がり
・学習の発信、あるいはセルフブランディング
・積極的に巨人の肩に乗る

だと思ってます
つまりどういうことか
####横の繋がりと斜めの繋がり
横のつながりは、同じように学習を始める仲間のこと、斜めの繋がりとは自分たちより早く学習を始めていて、先を行く人のこととします。
往々にして、横のつながりは、**継続する意志**を維持してくれます。
斜めの繋がりは、**自分の目指す先**、そして、**追いつけない悔しさ**を与えてくれます。
僕はこの2つのつながりがあったからこそ、ど文系ですが、ここ２年間は学習を続けられています。

####学習の発信、あるいはセルフブランディング
今はTwitterやCocoda!、Progate、note、その他様々なSNSが存在しますが、積極的に「自分はプログラミングやってるよ！デザインやってるよ！！」っていうことを発信するのが個人的におすすめです！
つながりが生まれていく可能性が高まります
僕はこれがあったから友人や先輩にいろいろなつながりを作って頂いて、案件などもご紹介頂けました🙇‍♂️ありがとうございます皆さん...
そんなにインフルエンサーぽい感じじゃなく、ゆっくり、「あいつ頑張ってるんやなあ」と信頼感を持たれるぐらいの発信で大丈夫だと思います👍
####積極的に巨人の肩に乗る
日々、めっちゃすごいエンジニアさんやデザイナーさんがサービスを作ってくださってます！
便利なサービスは、いーーーーっぱい使っちゃいましょ！
下は氷山の一角です

>
フリーのイラストがいっぱい。SVG形式で使える	https://undraw.co/search
綺麗なスライドを作れる	https://slidesgo.com/
参考デザインサイト	https://muuuuu.org/ 
デザイン参考サイト	https://bookma.torch.blue/ 
流体シェイプの作成	https://www.blobmaker.app/ 
フリーイラストダウンロードができる SVGでもできる	https://icooon-mono.com/ 
フリーでロゴが作れる	https://hatchful.shopify.com/ja/
波（ウェーブの作成）	https://getwaves.io/ 
おすすめFigmaプラグイン	https://photoshopvip.net/121035 
まじでいいアニメーションがあるLottiFiles	https://lottiefiles.com/ 

### ハード面
・パソコン！
別にMacbookは必須じゃありません！が、まあMacの方がかっこいいかも笑
ハードで必要なのってそれくらいかな？

## プログラミングを始められる方へ
プログラミング、個人的に初めは簡単で、かつ目に見えて成果が出るものがいいかなーと思ってます。
なのでHTMLやCSS、js、Railsを学ばれるのが個人的にはいいかなと思います！

### じゃあどうやって勉強するか
・[Progate](https://prog-8.com/dashboard)
・[Dotinstall](https://dotinstall.com/)
・[Udemy](https://www.udemy.com/)
・[Techpit](https://www.techpit.jp/)
・書籍（これまたいっぱいあるのでぜひ書店行って好みのデザインのやつ買ってみてくださいね）

以上のどれか好きなものを1ヶ月くらいやレたら、もう実際に
**自分で何かアプリを作っちゃいましょ！**

[Cacoo](https://cacoo.com/)や[Figma](figma.com)だったら、無料で簡単にデザイン案（デザインカンプ）が作れるので開発がしやすいと思います！

やっぱり作りたいもの作るのが一番学べます。
それで詰まった時には、もう血反吐を吐くらいぐぐりまくりましょう！

・使ってる言語
・実装したい機能
・詰まってるポイント
などを検索ワードにひっかけましょう
「Rails Googleマップ 表示されない」みたいな

### まとめると、始めるためのステップは、
・パソコン開く
・上記の勉強サイトどれか1ヶ月やる
・2ヶ月間くらいを目処にアプリ一つ作ってみる
・こなしつつ、勉強してること/アウトプットをSNSで発信！
・慣れてきたら[Github](https://github.com/)に登録して、アウトプットをそこに蓄積

## デザインを始められる方へ
僕もデザイン始めたてなので、始めた時に知っておいたら良かったなあっていう神サービスをご紹介します

・[cocoda!](https://cocoda-design.com/)（デザインの学習・アウトプットができる）
・[Figma](figma.com)（デザイン案が作れる）
・[Slidesgo](https://slidesgo.com/)（めちゃいいスライドが作れる）
・[muuuuu](https://muuuuu.org/)（良いデザインのサイト集）
・[bookma](https://bookma.torch.blue/)（良いデザインのサイト集）
・[pinterest](https://www.pinterest.jp/)（良いデザイン集）
・[dribbble](https://dribbble.com/)（良いデザイン集）
・[lottiefiles](https://lottiefiles.com/)（アニメーションがDLできる）
・[icooon](https://icooon-mono.com/ )（フリーアイコン）
・[hatchful](https://hatchful.shopify.com/ja/)（ロゴが簡単に作れる）
・[getwaves](https://getwaves.io/ )（波が作れる）
・[Figmaプラグインベスト10](https://photoshopvip.net/121035)（良いプラグインいっぱい🎉）
イラスト系
ー[Loose Drawing](https://loosedrawing.com/)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/411851/9a695414-6202-f6ad-1819-29899d37b033.png)

ー[Linu stock](https://www.linustock.com/)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/411851/15acdcfc-606b-7ec8-bec8-d9a171c53aa6.png)

ー[peeps](https://www.openpeeps.com/)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/411851/1cb61d91-d649-7d09-e1c1-208d09978b68.png)

ー[Shigureni](https://shigureni.com/)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/411851/f1d339bc-4e6e-c384-b31c-57122a1b0146.png)

ー[Drawkit](https://www.drawkit.io/)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/411851/0f0a02eb-1012-e133-507d-2642f78d9a24.png)

ー[undraw](https://undraw.co/search)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/411851/39ef6725-6179-7fbd-6ba8-dd63935d6cd0.png)

### 個人的におすすめ学習ルート
・パソコン開く
・Figmaをダウンロード
・Cocodaのお題こなす
・アウトプットをSNSで発信！🎉
・日々、インプット Via Pinterestとかdribbbleで！

以上！！個人的に昔の自分に教えてあげたいことをつらあつらあと書き申し上げました
##全部あくまで個人的！！！
何かあればこちらまで！
[Twitter](https://twitter.com/facultyoflaw11)