振り返り

【月報】Webデザイナーの振り返り【2021.03】

おはこんばんにちは!はやぴ(@hayapiiii12)です。

3月もあっという間に過ぎてしまいました。仕事では消費税関連の更新作業や期末だからかかけ込みの案件が多かったかな〜〜

さてさて3月の月報です。カスミさん(@_mi_su_ka_)のnote週報がみやすくて為になるので私も倣って今月からインプット・アウトプット(特に仕事)したものや気に入ったサイトなどをまとめてみようかなと思いました!早速書いてみますぞ〜〜。もう4月中旬だけど!!気にしないぜ!!

気になったWebサイト

実相山 正覚寺

https://nakameguro-shogakuji.or.jp/

今までお寺のサイトってどちらかというと「和」「堅実」など堅いイメージを持つデザインが多かった気がするのですが、このサイトはメインビジュアルのグラフィックがモダンで一見お寺のサイト・・?と思えるくらいの衝撃を受けました。ムービーも引き込まれたしインパクト大でかなり印象に残ったWebサイトです。

Bluestorm

https://bluestorm.jp/

ライフジャケットというブランディングが難しそうな製品をライフスタイルに馴染むようなビジュアル、見せ方にされてます。特にメインビジュアルなど写真の見せ方がいい。サイトのデザインだけではなく製品のブランディングがしっかりされてて印象的でした。

読んだ記事・本

[Webデザイナーさんへ] そのデザインがコーディングしにくい理由と、改善ポイント詳説 Part.2

https://b-risk.jp/blog/2021/02/code-friendly-2/

Part.1から心待ちにしていました!!今会社の体制として分業制なのでめちゃくちゃ参考にしています。

特にテキスト周りに関してはほんといつも気をつけねば・・と思っていたところなのでこの記事をみながらチェックするようにしています。

できそうなことを、すぐやる。

https://note.com/harahiroshi/n/nbe434e104159

ハラヒロシさんのnoteは更新時いつも読ませていただいてるのですがこの記事は私に喝を入れてくれた記事のひとつでした。

すぐやらないことってほんと一生かかってもやらないよな・・。最近また後回しのクセが出てきているので直していきたい。

その他やったこと

テキストエディタの移行

お世話になっていたテキストエディタ「Brackets」が今年の9/1にサポート終了するということで急いで「Visual Studio Code」へ移行しました。

所感Bracketsとほぼ変わらないので使いやすい!しBracketsより見やすいぞ!

Live Serverで効率よくコーディングできてます。ただBracketsのライブプレビューハイライトみたいなのは使えないのかな?そこだけ知りたい><

あとphpのプレビュー設定ができてないのでそこもせねば。

XAMPP設定

phpを扱うことも増えてきたのでXAMPPのローカル環境の設定をしました。ただまだ設定が不十分なのか表示できないときがあるのでちまちま設定していきます。ほんとこういう系?不得意でござる・・。

アウトプット① オウンドメディアリニューアル(教育関連)

オウンドメディア系のリニューアルデザインは今回が初めてでした。リニューアル目的は「ターゲット層に沿ったトンマナの改修」「記事内の回遊性の向上」の大きく2つ。

リニューアルなので既存サイトのデザインルールの拾い上げや実装面での課題(どこを残してどこを改修するか)解決が難しく苦戦しました・・。

担当業務

デザイン全般/コーディング指示・FB/スケジューリング(デザイン・コーディング)

よかったこと・やったこと

  • 先方のリニューアル後のデザインイメージ・コンセプトに沿うデザインにすることができた
  • 画像の縦横比が一部バラバラで表示がうまくできてなかったので統一を行った
  • hover時やクリック後のデザインなど細部のルールがなかったので作成
  • 記事内の見出し・文章間のmarginや大きさなどの見直し。装飾も大きさ・ベタ塗りなどで調整し、わかりやすく・見やすく最ルール化

反省点

  • 後ほどのデザイン変更・追加事項が多く、スケジュールの遅延・工数も増えてしまった
  • 記事の装飾(ライン・ボールド・見出しデザインなど)が拾いきれておらず後からのデザイン追加があった
  • 制作ツールの選定(メディア系などUIのルール決めが多いものはPhotoshopじゃないほうがいい絶対!笑)
  • 実装時、変更点などが多いことから見積もっていた工数よりも大幅なオーバーとなった

今後やっていくこと・改善点

  • メディアサイトなどデザインルールが多いものはXDなどルール管理がしやすいデザインツールで作成!
  • なるべく最初のクライアントとの会議に参加させてもらい、仕様を理解しておく(今回ここがかなりキモだなと痛感しました)
  • リニューアル時は変更点・追加点・減らす点を確実にしておくこと。最初に書き出してそれに見合う工数・スケジュールを立てる

アウトプット② サイト一部リニューアル(ウエディング関連)

担当業務

デザイン全般/コーディング指示・FB/スケジューリング(デザイン・コーディング)

よかったこと・続けていきたいこと

  • クライアントとのミーティングに参加。雰囲気やリニューアル背景などを深く聞くことができました。個人的にデザイナー、エンジニアなど制作側もミーティングに参加した方がすり合わせしやすいな〜と気づきでした。

反省点

  • 制作前の要件の整理や、クライアントのやりたいことを汲み取れておらず、デザインの作成し直しが発生しました。工数も2倍に膨れ上がってしまった。1番の反省点です。

今後やっていくこと・改善点

  • 一部リニューアルの際は、既存のサイトに合わせてデザインをするのではなく、下記を事前に確実に確認しようと思いました。

デザインはリニューアル前のデザインに合わせて大丈夫か?/参考サイトはあるか?/リニューアルの意図は?

まとめ

3月は仕事量が2月より多くてなかなか大変でした。しかも全体的に案件のスケジュールがズレにズレてあとでかなり詰まっちゃったりしてもうスケジューリング〜〜!!という感じでした。

その影響で今月(4月)タスクがかなり溢れてしまっててやばい・・笑

この「スケジューリング」が今後今の部署の1番の課題です。新しい案件入れないし、ストレスも溜まるしいいことない。受託だからというのもあるのかな〜。FIXさせる力を養わなければほんと・・。

4月は人の入れ替わりも多くて、まだ初旬ですがすでに諸々ヤバみ★なんですけど、なんとか乗り越えて、今月末ハッピーな月報を書けるように頑張ります!!!