見出し画像

【WEBデザイン学習日記-125】転職に向けてポートフォリオをリニューアル中

2024/5/13(月)~の学習日記です。正社員へのこだわりを辞めて派遣でも仕事を探し始めました。応募の際にポートフォリオを提出することも増え、去年作ったポートフォリオのデザインをブラッシュアップしリニューアルすることにしました。

☆★☆ ☆★☆ ☆★☆


2024年5月13日(月) ポートフォリオリニューアルデザインブラッシュアップ:4時間【デザイン・制作物】

今朝も求人欄のチェック&応募作業。
先週応募したWEB関連の企業の1社様より長文でご返信をいただきました。結果的には入社後の最初の1年間は出勤が必要なため地理的な理由から書類選考落ちだったのですが、私のポートフォリオ、そしてこのWEB学習日記を見てくださったようで、心のこもった暖かいお言葉に思わず今までの色んな思いが押し寄せ涙が溢れてきました。

去年から継続して記録してきたこのWEB学習日記ですが、自分の学習日記の記録のため、モチベーションの維持のため、モヤモヤした気持ちの整理のために継続してきました。1年間続けてきたことは決して無駄ではなかったのだと嬉しくなりました。また、今後の転職活動のアドバイスまでいただき、早速これらのアドバイスを参考に今朝は2つWEB関連の求人に応募させていただきました。ここ数日気持ちが落ち込み気味でしたが、また前向きになれるエネルギーをいただきました。本当にありがとうございました。

今日の時間割は「デザイン・制作物」。去年完成させ、制作物の部分しか更新していなかった自分のポートフォリオのデザインブラッシュアップをすることにしました。今改めて見て見ると「垢ぬけていないいかにも初心者が作ったデザイン」という印象(でもこのデザインがあの時の自分のベストだったんだと思います)。ナビバーを左側に固定したデザインでしたが、シンプルにトップに持ってくることにし、ダウンロードした素材を使って色々あしらいを付けることにしました。やり始めたら楽しくて4時間もしてしまいました。そろそろ肩が凝ってきたのでここらで終わりにします。


☆★☆ ☆★☆ ☆★

2024年5月14日(火) ポートフォリオデザインブラッシュアップ&カフェサイトのコーディングの答え合わせ:4時間45分【コーディング】 

今まで正社員にこだわって求人を探していましたが、48歳で正社員で探すのはほぼ不可能な気がしてきました。派遣社員でハイブリッド勤務(月に数回のみ出勤)、もしくはOJT期間のみ出勤しその後はフルリモート勤務という時給のいいWEB関連の仕事に2つ応募してみました。ハードルを下げて条件を変えて派遣社員で探し始めたら選択肢が増えました。アルバイトでもいいのでともかくWEB関連で実績を積んでいきたいです。

去年作成した初心者感溢れるポートフォリオを急遽リニューアルせねばと、今朝はポートフォリオのデザインブラッシュアップに精を出していました。気づいたら夢中に作業をしていて数時間経っていました。結構デザインを大きく変え、下層ページも減らしたのでコーディングは1からやり直しです。1年経ってコーディングも数をこなしてきたので、去年よりはサクサクできるはず。

夜もポートフォリオのデザインブラッシュアップの続き。イラスト付きのボタン(もっと読む、TOPへ移動するボタン)などはPhotoshopであらかじめ作ってしまい、Pngで保存して画像として使おうかなと思っています。以前はコーディングで作っていましたが、レスポンシブにすると崩れるので、画像にしておくと楽な気がします。


☆★☆ ☆★☆ ☆★☆

2024年5月15日(水) ポートフォリオのデザインブラッシュアップ:2時間【デザイン・制作物】

今朝は昨日応募した求人の派遣会社の担当の方から連絡をいただき、ポートフォリオを提出しました。地理的にかなり不利な求人ですが、今までの努力を認めていただき書類選考を通過したいところ。

今日の時間割は「デザイン」と「制作物」ということでポートフォリオのデザインブラッシュアップの続きを2時間ほどしました。没頭するとあっという間に時間が経っていて驚きます。PC用とSP用のTOPページ、スマホメニュー(ハンバーガーメニューをクリックした時の画面)まで作成できました。
あとはTOPページのタブレット画面と5つの下層ページ(ベースがあるのでデザインを変えるのみ)の作成をして、微調整をしたらコーディングに入ります。

先日クラウドソーシングサイトからトライアルに挑戦させていただいたコーディングの副業ですが、とりあえずフリーランス契約の締結が終わりました。今後本案件をいただけるまでにコーディングスキルをブラッシュアップしておかなければなりません(BEM、FLOCSS、SASSなどしっかり頭に入れておかないと)。亀のような歩みではありますが、少しずつ前進している気がします。

☆★☆ ☆★☆ ☆★☆

2024年5月16日(木) カフェサイトのコーディングの答え合わせ&ポートフォリオのデザインブラッシュアップ:4時間25分【コーディング】  

今日は朝からハローワークに行ってきました。転職活動が更に長期化することが考えられ、遅ればせながら雇用保険受給申請をしてきました。これから定期的にハローワークに顔を出す必要があります。1年半ぶりに訪れましたが、ハローワークの端末を使って近所のWeb関連の求人を検索してみると、いくつか関連する求人が見つかったので印刷をして持ち帰ってきました。

現在、英語を活用した仕事(海外営業や翻訳関連、英文事務など)とWeb関連の仕事(Webディレクション、コーダーなど)の二択で転職活動をしていますが、前者だと英語はあくまでも”ツール”であって、業務内容は自分の興味がないものも含まれるわけで、やはり後者に絞って仕事を見つけるのが今後のキャリアのために自分が取るべき選択肢なのかも知れないとも思ったりします。何としてもWeb関連で実務経験を積んでいきたいのですが、都会は結構求人があるけど今住んでいる場所が田舎すぎて地理的な理由から求人に応募できないというのが大きな障害😢

午後からはWebデザイン学習。木曜日の時間割は「コーディング」ということで、スクールのコーディング課題のカフェサイトのコーディングを動画を見ながら自分で書いたものと答え合わせ。、

<学んだこと>
◎"order"というプロパティを使うとFlexで横並びにした要素の順番を変えられる。左側にテキスト、右側に画像が並んでいて画像を左にしたい場合はテキスト要素にOrder:2とかけるか、画像の要素にOrder:-1とかけると画像が左になる
◎ボタンは他の所にも使う可能性があるためボタンをくるんでいるところにtext-align:centerをかける
◎レスポンシブにした時に左右に余白ができるようにPC画面でwidth:96%にしておく方法がある
◎ハンバーガーメニューをクリックしてスマホメニューが表示された時に、三本線がバツ印になる書き方。自分が今まで書いていた方法より簡単にかける方法を知り、目からウロコでした。
◎スマホ画面にはホバーをかけないメディアクエリー特性を使ったコードの書き方 →今まではプロパティの後ろに「:hover」とつけてホバー効果をかけていましたが、「@media (hover: hover) { }」という書き方があることを学びました。
◎コーディングしたものとデザインカンプをチェックする方法(Window ResizerとChrome拡張機能のPerfectPixcelを使用)

夜の時間割はフリーにしてあるのですが、ポートフォリオのリニューアルを早く進めていきたいので、デザインブラッシュアップの続きをしました。TOPページ(PC、SP、スマホメニュー)はできたので、5つある下層ページの内の1つ(PC, SP)のデザインを作りました。残すはあと4つ。以前は下層ページが8つもあり、TOPと内容が重複していてあまり下層にする意味がないページがあったので、今回は下層ページを極力TOPにまとめてページ数を減らしました。

☆★☆ ☆★☆ ☆★☆

2024年5月17日(金) ポートフォリオのデザインブラッシュアップ続き:3時間【デザイン・制作物】 

今後働き始めると行けなくなるので、動けるうちに行っておこうと今日は車を走らせて月に2回しか営業しないというパン屋さんと以前から行ってみたかったオシャレな喫茶店行ってみました。たまにはいい息抜きになります。

数日前に応募したWeb関連の仕事(派遣)ですが、両方とも書類選考落ちになりました💦やはり地理的な障害は大きい・・・1カ月だけOJTで通勤(家から2時間近くかかる)して後はフルリモートという案件だったのですが、やはり企業様側としては近くにお住まいで何かあった時にいつでも通勤できる方を採用しますよね。

別に応募していた英語関連の求人先からトライアルの翻訳課題をいただいたので(英和・和英の英訳3つ)、先ほど翻訳を終わらせ返信しました。来週初めには選考結果が分かるはず。

今回の転職は「昔から好きな英語を活かせる仕事」もしくは「Web関連の仕事」へ転向するためなので、妥協はせず根気強く転職活動を続けたいと思います。失業保険を申し込んでから少し心に余裕を持って転職活動ができるようになりました。失業保険の給付はまだまだ先ですがこの先長期戦になっても給付があると思うと焦りが軽減されました。

夜はポートフォリオのデザインブラッシュアップの続き。全下層ページも作成が終了し、各ページを確認して文章の修正やデザインの微調整をしています。あとは4つの下層ページのレスポンシブデザインを完成させたら、Photoshopで素材を作り(コーディングでは作らなず画像として取り扱うボタンなど)、コーディング作業に入りたいと思います。目標は5月中のリニューアル終了。

☆★☆ ☆★☆ ☆★☆

2024年5月18日(土) スマイルハウジングのサイトコーディング&ポートフォリオのデザインブラッシュアップ:2時間45分【コーディング・制作物】

今日は快晴。真夏のような暑さです。

土曜日の時間割は「コーディング」と「制作物」ということで、午後はtorikumuのコーディング課題のスマイルハウジングのサイトをコーディングすることに。習ったばかりのFLOCSSのフォルダ形式でBEMのクラス名をつけてコーディングをしていこうと思います。

最近はデザインカンプを見て構成が頭に浮かぶようになってきたのでやらないことが多いのですが、今日はコーディング作業をスムーズに進めるために、最初から構成をあらかじめ書くことにしました。

構成を作っておくとコーディングが楽に

この構成をもとにまずはhtmlを書いていきます。30分ほどでTOPのhtmlが書きあがりました。このやり方だと作業効率がぐっとあがる気がします。

夜は「制作物」ということでポートフォリオのデザインブラッシュアップの続き。

☆★☆ ☆★☆ ☆★☆

2024年5月19日(日) ポートフォリオのデザインブラッシュアップ&スマイルハウジングのコーディング続き:5時間半【デザイン・コーディング・制作物】  

今朝もポートフォリオのデザインブラッシュアップの続き。Figmaのプロトタイプ機能を使って、クリックした時のアクセスの確認&修正も行いました。TOPと全下層ページのスマホ対応デザインも完成しました。

前回ポートフォリオを作った時はPhotoshopを全然活用できていなかったのですが、今回はコーディングで崩れそうな箇所はあらかじめ素材としてPhotoshopで作っておこうと細々したパーツも作り始めました。

パーツにしておくと便利

夜は「コーディング」。コーディング課題のスマイルハウジングのCSSコーディングを始めました。FLOCSSのフォルダ方式で書いたのですが、非常に管理がしやすいです。全てコーディングが終わったらセルフチェックをしてからSlackに提出してみようと思います。

明日からまた新しい1週間の始まり。引き続き転職活動頑張ります。

今週のWEB学習時間は26時間25分でした。週の学習目標時間10時間達成です。

☆★☆ ☆★☆ ☆★☆


<5/13(月)~5/19(日)に出来たこと> 

【デザイン】ポートフォリオのデザインブラッシュアップ
【コーディング】カフェサイトのコーディングの答え合わせ
【コーディング】スマイルハウジングのコーディング

<転職活動状況> 
◎4/8に4社応募(WEB関連) →2社書類選考落ち
◎4/10に2社カジュアル面談応募(WEB関連)→1社書類選考落ち
◎4/10に副業案件1件に応募(コーディング)→書類選考落ち
◎4/12に2社応募(WEB関連、英語関連)
◎4/15に2社応募(英語関連)→1社書類選考落ち
◎4/18に3社応募(英語関連)→3社書類選考落ち
◎4/22に1社応募(英語関連)
◎4/23に1社応募(英語関連)→書類選考落ち
◎4/24に3社応募(東南アジア関連)→1社採用枠埋まり済み、1社選考条件満たさず
◎4/25に1社応募(WEB関連)→書類選考落ち
◎4/25にコーディングの副業案件1件応募(コーディング)
◎4/26に5社応募(英語関連)→書類選考落ち3件
◎5/1に副業案件1件に応募(コーディング)→トライアルに挑戦するも期限までに終えられず断念。努力を認めていただいたのかその後業務委託契約を締結いただけました
◎5/6に副業案件1件に応募(コーディング)→時間差で契約を逃す
◎5/8に2社応募(東南アジア関連)→書類選考落ち1社、返信なし1社
◎5/9に4社応募(WEB関連)→書類選考落ち3社
◎5/10に6社応募(英語・WEB)→書類選考落ち3社
◎5/11に1社応募(英語)→書類選考落ち
◎5/13に4社応募(WEB関連)→書類選考落ち3社
◎5/14に2社応募(WEB関連:派遣)→書類選考落ち2社

→41社の求人に応募
(書類選考落ち29社、返信なし7社、その他返信待ち)
→4つの副業案件に応募
(書類選考落ち3つ、1件トライアル後、業務委託契約へ)


<WEBデザイン学習の時間割>

自分用の時間割を作ったら今までムラのあった学習時間が安定し、バランスよくデザインとコーディング、制作物に時間を割けるようになりました!

☆★☆ ☆★☆ ☆★☆

<今後の目標>
★ 2024年6月末までにWEBデザインでの副業案件を1つ取る! →トライアルに挑戦し、一応フリーランス登録のメンバーには入れていただけたようです。初めての案件をいただけるようになるまでスキルアップに努めます。
★ 2024年5月中にポートフォリオのリニューアルを終わらせる
★ 2024年中に近所の農産物直売所のサイトリニューアル(架空)とレストランのリニューアル(架空)を完成させ、営業をかける
★ 2024年5月末までに今までの経験を活かし、今後にもつなげられる仕事に転職する
★ WEBデザインの学習と制作活動を地道に続けながら少しずつ実績を積む
★ 2024年中に「色彩検定UC級」、「WEBクリエイター能力認定試験」のスタンダードに合格する




この記事が気に入ったらサポートをしてみませんか?