勉強

2019/3/9

デザインが苦手な方が注意するとよさげな点

先日「KMYさんのようにデザインを作るにはどうしたらいいですか」と質問をいただきました。 また、ここしばらくウェブカツのTL上でも、今フリーランスでWEBエンジニアを始めたばかりの方のNoteでも「デザインが苦手」というのを見たので、私がデザイン上で気を付けているちょっとした点について書くことにしました。   といっても私はデザインのプロではありません。 実はデザインを勉強した経験も一切ありません。 そういう点で私が実践していることは、他の方にも実践しやすいのではと思います。   デザ ...

勉強 プログラミング

2019/2/28

【実録】「ウェブカツ!!」を4か月やってみた感想

ウェブカツで勉強を初めて4か月が経ちました。 そして折り返しをとうに過ぎ、いよいよ半年が見えてきました。   現在の状況について 勉強時間と進捗はだいたい以下の通り。 平日:1-2時間(ウェブカツ) / その他2時間 休日:ほぼ勉強時間なし (制作物ちょいちょい程度) 進捗:現在JS上級部/L3 (1か月でJS中級、HTML/CSS中級~上級、JS上級途中まで。その他WEBサービス部やJS入門を繰り返す) 勉強時間を取れるのはほぼ平日のみです。 なお、4か月目はウェブカツ講座を新しく進める時間よ ...

勉強 プログラミング

2019/1/31

【実録】「ウェブカツ!!」を3か月やってみた感想

  ウェブカツで勉強を初めてあっという間に3か月経ちました。   現在の状況について 勉強時間と進捗はだいたい以下の通り。 平日:1-2時間(ウェブカツ)/ その他2時間 休日:ほぼ勉強時間なし 進捗:現在JS中級部/L15 (1か月でWEBサービス部(2回目)、PHPオブジェクト部、WP部、JS中級途中まで) 勉強時間を取れるのはほぼ平日のみです。 講座を復習しつつ自分のサンプル作成などに時間を割いていたりして、正直進み方で言えばかなり遅い方だと思います。   3か月目、自 ...

勉強 プログラミング

【実録】「ウェブカツ!!」を5か月やってみた感想

投稿日:

ウェブカツでの報告ブログ5回目です。

5か月目まであと1週間ほどありますが、ポートフォリオサイトが完成し勉強的にもキリが良かったためこの時点で報告ブログを書くことにしました。

最近多くの方が受講されていて、「このままウェブカツを進めたら数か月後にはどんな感じになるのだろう」「Winのまま進めて大丈夫?」と感じている方が多いと思うので(実際に質問を受けました)、今回はそこをメインに書いてみたいと思います。

 

現在の状況について

勉強時間と進捗はだいたい以下の通り。

平日:0-1時間(ウェブカツ)/ その他2-4時間
休日:ほぼ勉強時間なし
勉強内容:JS/JQuery部入門、Wordpress部、HTML/CSS部中級-上級の繰り返し

勉強時間を取れるのはほぼ平日のみです。

5か月目はウェブカツでの勉強時間が初めて激減しました。

理由は以下の2つ。

・3週間のうち2週間をポートフォリオ制作に費やしたこと。
・後半の講座はWin環境では進めるのが相当難しいこと(解決してない)

 

Win環境の方へ

JS中級以降はCLI(つまりコマンドで進める黒い画面)の使用が必須となり、

 

Win環境の方は、ウェブカツでの講座を進めるための「環境構築」でまず躓きます。

 

環境構築ができない=講座を受けることすらできないので、とにかく大変です。

私はググって問題を解決する力はそれなりにあると思っていましたが、なかなかどうしてそういうレベルではありませんでした。JS中級部のnpm、yarn、gulp導入までは何とかこなせたものの、それ以降のPHPフレームワーク部やJS上級部は結局環境構築ができないままでした。

現場経験がある、もしくはWinを普段からコマンドでスイスイ使いこなしている方でない限りは、ここで数日以上時間を取られると思います(それでも多分無理)。調べてもMacもしくはLinux前提が殆どなので、既にWinで開発を進めること自体が現実的ではないということなのでしょう。

 

逆に言えばJS中級部までは、Win環境で全く滞りなく進められるのでそれまでに何らかの対策を打っておけば問題ないはずです(一番早いのはMac購入です)

私の場合は中古のMac購入も×だったので(買うならちゃんとしたものをお金を貯めて買いなさいと言われた)、今WinにVirtualBoxとUbuntuを導入して仮想環境でできないか色々テスト中です。

 

ウェブカツ後半の過ごし方

1日4-5時間はウェブカツでびっしり勉強していた私ですが、4-5か月目は講座を受ける時間が減りました。

というのも、WEBサービス部くらいまでの知識を使って自分の制作物をガンガン作っていく時間と、そのために色々と調べる時間が増えたからです。作っては調べる(もしくはウェブカツ講座を見直す)の繰り返し。

ウェブカツの講座を受ける時間が減ったからと言ってサボっている感は全然なく、前半3か月で得た知識を前提に「さあ何をどう作ってやろう」と進めることで、逆にウェブカツの知識をどんどん定着させて力がついた気がします。

 

これは他のウェブカツ生を見ていても共通している気がしてて、

 

「うわあこの人すごい!」と思う人は講座をガガーッと一生懸命受けたあと、分からないなりにガンガン自分の制作を進めている人ばかり。

自分の体感でも、サイト制作にしろWEBアプリ(PHPの仕組み)にしろ、自分で作ってみて初めて「ウェブカツで言ってたのはこういうことか!」と理解できる部分が多かったです。

なのである程度コードに慣れた時点で、講座と並行しつつ何かを作っていくのがウェブカツ後半の過ごし方のオススメであり、習得への近道だと思います。

 

 

自分の話

ポートフォリオができました!
https://raradi.com/kmy/index.html

 

 

制作期間はジャスト2週間。
まだJQueryを1から構築することができないのでプラグイン頼りのところもありますが、それなりに頑張りました。

使用したのはHTML/CSS/SASS、JQuery。

ウェブカツの進度で言えば、こんな感じです。

・コーディング → HTML/CSS入門
・JQuery    → JS入門
・フォーム    →  PHP入門
・メール送信   → PHP入門
・アニメーション→ HTML/CSS中級
・SASS    → HTML/CSS上級
・レスポンシブ → HTML/CSS上級

 

これを見ると分かると思うのですが、アニメーションやSASS、レスポンシブといった付加的な部分以外はほぼ入門部で網羅されています。

 

ウェブカツの鬼練と、HTML/CSS入門部後半で作るページがきちんと習得できれば、自分でポートフォリオサイトを作るだけの技術は十分ついています。あとは見た目(使う写真やデザイン)の問題です。あ、それから慣れ。

なので度々「HTML/CSS入門で制限がかかっている」という不満を見ますが、絶対「分かった気になっているだけ」なのでその間に写経なり自分のポートフォリオ制作などを進めた方がよいです。

 

自分で、どこが理解できていないか痛いほど分かります。

 

このポートフォリオにはいくつかLPやサンプルサイトを掲載していますが、これらは前半の3か月で制作したものです。

 

プラグイン使うなら余裕?

このポートフォリオのトップの縦割りデザインや、クリックしたら画面が出てくるモーダルにJQueryのプラグインを使用しています。

ポートフォリオの意義的に、見栄えが良いのが優先なのでプラグインを率先して使った感じです(あまり使い過ぎるとサイト的に重くなる等色々あるのはまあ置いといて)。

 

最初プラグインというのは「サンプルコード写すだけで楽勝ちゃう?」と思っていたんですが、

 

全 く そ ん な こ と は な か っ た。

 

ここで役立ったのが、ウェブカツJS/JQuery入門部でした。

 

結局カスタムするにあたって、基本が必要なんですよね。

「サンプルソースではHTMLタグを指定しているけど、これだと自分のサイトに実装した時に影響範囲が多岐にわたるのでclass指定して差し替えよう」

「ここではテキスト差し替えだけど、HTMLごと入れ替えたいので.text()ではなく.html()で指定しよう」

とか、そういう単純な入門部に書かれている基本の積み重ねがカスタムの基本でした。

 

例えばポートフォリオで使っているバリデーションチェック。

テキストを赤に指定したクラスに変更して(.addClass('has-error'))

 

 

OKならフォントアイコンに変更とか(.html('<i class="fas fa-check"></i>')))

 

なので、今入門部を勉強されている方は、そこは本当に基本の基本で役に立つところなので自信をもって勉強を進めて大丈夫です。

でないと私みたいに5か月たっても入門部を何度もやり直すことになりますよ!

 

今の自分はどれくらい?

「エンジニアと名乗っていいのはどこからだろう」
「どこまで力をつければ、実践(現場)で通じるレベルなんだろう」

勉強していて、これがずっと疑問であり不安でありました。

 

なので今回このポートフォリオをもって思い切ってウェブカツ主催者様に聞いてみました。
(一部不要なレス等は省略)

 

 

「一人で仕事獲るスキルとしては困らない」
「十分デザイナーと名乗れる」

と言っていただいたのは相当嬉しかったし、クリアすべき点(FWなどでの制作)を挙げて頂いたので相当モチベーションがアップしました。

プログラミングを教えてハイ終わり、ではなく「現時点ではこうだからこうするとステップアップできる」的なアドバイスを頂けるのは本当に有難いことです。

 

 

育児中のママさん受講生の方々へ

ウェブカツTLではガリガリとPHPでWEBアプリを作っている方が多い中、私はフロント方面に絞ることにしました。
その辺の経緯は4か月目のブログで書いているのですが。

【実録】「ウェブカツ!!」を4か月やってみた感想

ウェブカツで勉強を初めて4か月が経ちました。 そして折り返しをとうに過ぎ、いよいよ半年が見えてきました。   現在の状況について 勉強時間と進捗はだいたい以下の通り。 平日:1-2時間(ウェ ...

 

基本的にウェブカツの講座はフルスタックエンジニア(フロント~バックまで全てカバー)を網羅できる内容であり、ここ得た知識と技術を持って現場で修行(もしくはフリーランス)でいこう!というスタンスです。

 

が、実際子育て中の方には、当面厳しいルートでもあると思います。

 

「とりあえずフロント」のすすめ

「育児中は1日4-5時間だけ家でリモートしたい」
「子供が大きくなるまでは旦那の扶養内で済む報酬でいい」

 

この辺であれば、上にも書いた通り「HTML/CSS部入門」講座がスイスイできるレベルになれば、実は結構仕事(パート)があります。
(但しこの場合はあくまでも「コーダー(HTMLとCSSのみ)」の作業)

実際、ネット上のエージェントの募集案件を見てもパートレベルのリモートのコーダー募集は割とあって、デザインだの難しい言語を使えだのという条件もありません。あくまでもコーダーに特化した感じ。

時給は1000円ほどですが、田舎なら重労働でフル勤務なのに最低賃金レベル(800円ちょい)のパートがほとんどなので、それを考えれば条件的には随分恵まれた方ではないでしょうか。

 

実際に私がウェブカツを受けている数か月、ママさんに特化したサイトに何気なく登録していたら何度かコーダーでの仕事の打診が来ました。単発ではなく、その企業がパートとして雇ってくれる形でです。

もちろん、ウェブカツでの勉強を進めてJSやwordpressなどが使えるようになればもっと条件も良くなります。

育児がある程度落ち着くまで、それなりのお金をもらいつつスキルを磨き経験を積んでいくという点でも、現実的な方法だと思うんですよね。

 

何故こうしたことを書いたのかというと、ウェブカツTLではどうしても若い方のフリーランスやフル勤務での転職といった、育児中のお母さんには難しい話がメインであること。

育児中のお母さん達はいくら一生懸命勉強しても、すぐには働けません。
実家が近くになかったり旦那の助けがない限り、もし保育園に預けることができたとしてもフル勤務のハードルは相当高いです。

 

ていうかほぼ無理。

 

そして、ウェブカツの目安は半年と言われていますが、自分がやってみて実感するのは

「育児をしながら空き時間で続けるには半年で出来るボリュームじゃないのでは?」

ということ。

 

そのくらいいい講座がボリューミーであることは確かなのですが、ある程度優先度をつけて(フロントがある程度できた時点で仕事を探すなどしながら)勉強するのもありなのではと思いました。

そのためにも、上で書いてたとことリンクしてくるのですが、ポートフォリオと制作物を早めに作っておくのはオススメ!です(パート募集でも作品提示は必ず求められます)。

 

今たくさんの方が入られて、あと数か月もしたら「じゃあどのように活かしていこう」ということを考えるようになると考えるようになると思うので、参考にして頂ければ。

 

今後の自分について

ウェブカツ主催者様にある程度示していただいた通り、私の課題は「FWを使用したJSやPHPでの制作・実装」になります。

そして自分の中では「Wordpress」も最優先。

色々見ているとやはりHTMLで作ったものを自分でWPにコンバートできるスキルはほぼ必須だと思っています。そして意外とこれを言う人が少ないのですが、

 

ポートフォリオの作品のバリエーションを増やすこと。

 

「勉強中です!仕事探してます!」系の人のポートフォリオの作品って、大体「カフェ風サイト」「旅行をテーマにしたサイト」「美容院サイト」などが多くないですか。

なぜなら、この辺のキレイな風景写真やインスタ映えしそうなカフェめし写真を使っておけば、それっぽく見えるからです。それっぽく作るのが簡単(知らんけど)。

 

私も、ポートフォリオを作るまでは見栄え優先で「スイーツ」「ジュエリー」「化粧品(ソープ)」などをテーマに、言い換えればわざと見栄えがする写真が使えるジャンルを選んでいました。

 

が、実際のWEB制作会社の実績一覧を見て回ると実はそんなところはあまりないんですよね。「保育園」「病院」「学習塾」「地元の建設会社」などなど、カチッとしたイメージの企業の方が多いくらいです。つまり、

 

デザインに縁がない業界の企業だからこそ、専門に依頼してくる

 

ニーズはきっとこうしたところの方が多いはず。
なので、ポートフォリオを営業ツールとして活かすために、堅実に見えるサイト、ポップに見えるサイトなどバリエーションを増やしていくつもりです。

 

ということで6か月目どうしましょう。
6か月目まで受講して、そのあと試験を受けようかなと考えてはいるのですが、とても試験に耐えうる実力がついてなさそうでどうしたものやら。

 

最後におまけ:デザインについて

 

最近デザインの件で質問があったので記事を書いたり答えたりしていたのですが、反響が大きくて驚きました。

デザインが苦手な方が注意するとよさげな点

先日「KMYさんのようにデザインを作るにはどうしたらいいですか」と質問をいただきました。 また、ここしばらくウェブカツのTL上でも、今フリーランスでWEBエンジニアを始めたばかりの方のNoteでも「デ ...

 

デザインのオススメ本を紹介したツイートのRTが24件にいいね100件以上とか、結構切実な問題なんだなあと。

 

とりあえず簡単にできることを1つ。

フリー写真を使う時!

1)いかにもなジェスチャー写真
2)いらすとや

はできるだけ避けましょう!

 

1)は、「いかがでしたか!?」で終わるようなNAVERなどのまとめサイト系やアフィリエイト系ブログによくあるあれです。

こういうの。

いや悪くはないんですが、せっかくデザイン性のために写真を使っているのに「いかにも」な印象に引っ張られてそれどころじゃなくなります(※個人の感想です)。

プレゼン用のパワポ資料みたいなものならいいと思うんですが、その辺は用途によって使い分ける方が効果的です。

 

2)は、学校行事や役所などそういうところでのプリントや掲示物には向いているでしょう。

しかし、せっかく作った自分のオリジナル制作物を、一気に「どこにでもあるもの」にしてしまいます。そもそもデザインセンスを問われる制作物をアピールする時にいらすとやを使っている時点で、クライアント側の選択肢から漏れても仕方ないのではないかなと。

ちなみに私自身はいらすとやさんの能力・画力はすごいと思っています。ただ自分の制作物として使うには向いてないという意味です。

 

この辺りなどで探すのもよいです↓
ウェブカツで使われているフリー写真もここにあったりしました。

 

 

 

もひとつおまけ:2画面のすすめ

別のウェブカツ生の方も最近ブログに書いておられましたが、講座を受けるにあたって画面を分ける方が絶対に効率がいいです。
マルチモニタ出来る方や、タブレットで画面を出してPCで打てるならそれで。

 

私の環境

 

 

マルチモニタが難しい場合は、エディタを2画面に。

 

写経の場合は右にサンプル、左でコードを打ちます。
制作の場合は3画面で、左にHTML、真ん中にsass、右にcssかjsファイルという感じです。

 

同時に色々見ながら作らないといけなくなってくるので、モニタは難しくてもエディタの画面分けは慣れておいて損はないんじゃないかなと思います。

 

一応貼っときます。ウェブカツおすすめ。

ウェブカツ!!

おすすめ記事

1

※ここではSkillHacksを購入し、実際に使った個人の感想を率直に述べています。SkillHacks主催者を誹謗中傷する意図は全くございません、予めご了承ください。   現在、プログラミ ...

2

ウェブカツで勉強を初めて約1か月経ちました。   私のツイートについているハッシュタグ「#skillhacks では実務レベルのスキルがつかなかったので #ウェブカツ で稼げる力を学び中」を ...

3

私がHTMLを覚えたのは20年ほど前のことです。 まだCSSもなく、背景がデフォルト灰色のままの文字だけ並んだホームページがまだ普通だった時代。HTMLの初心者用本というのは殆どなくて、HTML/JS ...

-勉強, プログラミング

S