Webデザイン備忘録

6年目Webデザイナーのデザインメモ

WEBデザイナー5年目の反省と6年目の目標

f:id:ayarpyyy:20201129150348j:plain

年イチの戒めブログがもう6年目…?
来年もう中学生になってしまう もう中学生になってしまう

ところで、ここ近年で後輩も年数を経てきたところで、
戒めに始めたこの備忘録が自分なりに役立ってきております。

当時の自分はどんな事してたかな
そろそろこれやってもらった方がいいんじゃないかな
というバロメータだったり

当時の自分もこの壁にぶつかってたなとか
ここ注意して欲しいなっていうポイントだったり

いちいち考えて文章を打たずともコピペで伝えられて割と便利だったなあと(URLは気まずいので断固教えない)



ayarpyyy.hatenablog.com

この1年で学んだこと

・圧倒的超絶当事者意識を持つ
・敏感になりすぎずある程度ほっとく

両極端なこの2点かなあと思いました。

圧倒的超絶当事者意識を持つ

もう自分の仕事の範疇を超えて、自分が関わった案件はもうなんかもう全部細かく見とく。
うちではディレクションもデザイナーが兼任する事が多いため、なんかもうそれに尽きる。
できるならな!

敏感になりすぎずある程度ほっとく

上記のとおり、圧倒的超絶当事者意識を持つしかないのか〜そうか〜全部自分でやらなきゃいけないのか〜と絶望に至ったので、今まで積極的に引き取ってきたものや小さい事を放っておくことにしたのであります。

なんでもやりますアピールする時期もとっくにすぎたし、もういいやとスルーするようにするとちょっと楽になったかもという印象。

5年目に目標としてたことの反省

後輩に向けたデザイン講習会を開きたい

→伝わってるかはわからないけれど、講習もしたし、常日頃のメモを渡したりなどみっちりやった…やりきった…

クライアントと良好な関係を築けるディレクションをしたい

→軌道修正のために、できること・できないこと・仕様などの細かい説明をしたり
 クライアントにはなかなか面倒臭いやつだなと思われている気がしている。

より使いやすいUI、新しい感じのちょっとしたデザインを研究したい

→UIはあまり手を出せなかった気がする。
 デザインは(使われるかどうかは別として)その案件の系統での新しい感じのデザインを取り入れるよう挑戦を多くした。


目標立てたことに関してはまずまずといったところかなと思います。


6年目の目標

この1年、コロナの影響もあるのかないのか(デフォルトが引きこもりなので生活自体はノンストレス)なんというか絶望みが深くなってしまい、どうしたものかなあと思っていました。
デザイナー・ディレクターとしてもまだできていない事は沢山あるのだけれど目標を立てられるほど地固まっていないので6年目は上を目指さずにゆったりと生活してみたいと思っている所存です(できるならな!)

うれしかったこと

もうどこいっても(フリーでも)大丈夫なくらいのスキルはあると言われたこと

フリーで食べていけるかは別として、確かにもう打ち合わせも緊張しないし、
見積もりもできるし、質問への回答もある程度できるし、仕様を考えることも、
危ないことの判断もできるようになったなんだなーとしみじみ…

同じ意識を共有できる人ができたと師匠に言われたこと

嬉しい…?とは違うかもですが、仕事に関しての悩みというかどうにかならないかみたいな意識を
共有できる人が久々にできて喜ばしいと言われ、師匠との目線のラインの格差というか
そういうものが縮まってきたのかなあと思いました。



なんかまとめてみると絶望みあふるるブログになってしまった…!
引き続き6年目もなんとか生きていければと思います。

WEBデザイナー4年目の反省と5年目の目標

f:id:ayarpyyy:20191014010011j:plain

もう5年生…小学生で言ったら高学年…
1年経つごとに、プロフィール欄とヘッダ文の年数を変更するのですが、5年に書き換える時になんとも言えない気持ちになりました。
小学生の時の6年間はとても長かったのに、大人になってからの5〜6年は一瞬ですな

そして本年も恒例の反省と目標をばしていきたいと思います。

ayarpyyy.hatenablog.com

読み返すと4年目、目標たててなかったのでざっくりの反省から

この1年で学んだこと

・スケジューリング感を養うこと
ディレクションの考え方
・圧倒的当事者意識を持つ

大雑把に言うとこの3点で4年目は頭を悩ませ胃を痛めていた感があります。

スケジューリング感を養うこと

おかげさまで2人の後輩デザイナーができ、指示やフォローをしながら複数の案件を進めていくようになりました。
2人とも未経験者からのスタートのため、最初のうちは指示もフィードバックも細かく行うことが多く、「2人同時のフォローは無理ィ〜〜〜〜!!!」と自分の要領の悪さに何回も泣きそうになりました。。

そんな中、大きめの案件を後輩1人と進めていくことになったのですが、
なんせ手がまわらんで自分の他の案件をまわすため途中で1週間ほど後輩にすべて任せてしまい、自分の案件を片付けて戻った時にはキャッチアップをするには少し遅すぎる状態になっていました。
デザインチーム全体で助けてもらい、なんとか事なきを得たのですが、想定が浅すぎるというのが敗因でした。読み違えや想定外が多すぎ問題…

スケジューリングする時は、いろんな事を想定していく。
・後輩のレベルを考え、数回のフィードバックがあることを想定した作業期間を設定する
・できなかった時の事を考え、自分が終えれる工数を想定してキャッチアップに入るリミットを決める
・その他最悪のパターンを想定しておく

ディレクションの考え方

フロントに立つ事が多くなり、クライアントとのやりとりで精神がすり減る事が多々ありました。

人と人との事だから乱暴に思える依頼やメールの書き方ひとつでモヤモヤしてしまうことがあるので、感情に振り回されず冷静に物事を判断しなくてはならないなと気をつけています。

圧倒的当事者意識を持つ

すべてはこれに限るな、というところなのですが
今までは師匠や先輩についていくばかりで、当事者意識は持ちつつも「自分はだめなやつだから抜けがあるかも」とか「先輩が作成したものに私が発見できるミスなんてあるわけない」という意識がチラつきながら作業していたのではないかなと思いました。

現在は、後輩ができたことにより強制的により強い当事者意識を持つようになった感じがします。
・自分が漏らしたら終わりだという意識
・自分が関わった案件はすべて当事者意識を持って社内ディレクションしていく

(といいつつ成長してきた後輩にWチェックで指摘されまくりだったりするのですが)

うちの会社は少数人数なため、ディレクター不在の状態で
誰がすすめてるの?いつまでにやればいいの?結局どういう仕様なの?とふんわりしたかんじになる時があるので
自分が作業に関わったものは圧倒的当事者意識で進めていかねばならんという意識をもうようになりました。(デザイナーがフロントに立つ事が多いので必然的にそうなるし保身の一貫でもある。)

5年目の目標

・後輩に向けたデザイン講習会を開きたい
・クライアントと良好な関係を築けるディレクションをしたい
・より使いやすいUI、新しい感じのちょっとしたデザインを研究したい(視認性や意味合いにプラスになる部分的なアニメーションや今までのボタンの概念からの脱出など)

うれしかったこと

自己肯定感超絶ひくおなので忘れないように嬉しかった事はメモっておく。

2度目の失敗する事がないと言われたこと

師匠に、「あなた初めてすることは失敗する時あるけど、そのあとは絶対失敗しないでしょ」って言ってもらえて、とても嬉しかったのである…
何度も同じミス繰り返すことに定評があったのに、意識して改善しようとしていたら結果と信頼に繋がっていたのだ…ウッ
ayarpyyy.hatenablog.com

引き継いだ案件をミスなく終えられた

会社で請け負っているほぼ全案件をまとめて調整しなくてはならない事案があったのですが、途中から引き継いで、当日何をしなくてはならないのか、確認すべきこととそれに必要な要素の準備、当日の流れや各クライアントとのやりとりなど終え、その後奇跡かと思うほどどこからもバグや修正依頼がきていないのが地味にうれしかったのです。

情報の整理と入念な準備、デザイナー/ディレクターとしての経験値が上がった気がする…

デザインがウマイと言われたこと

もはや社内では中堅デザイナー… 数ある案件の中、グワーーーッッと短期集中してやったコーポレートサイトのデザインを見て高評価いただいた時に、あるパターンでは私いいとこまできてるんか、と少しだけ実感につながりました。

そのあと師匠のデザインみるとやっぱり綺麗で洗練されてて「ちゃんとした売り物」っぽいなって思うのだけれど


思いの外反省が長くなってしまった。
5年目もなんとか生きていければと思います。

人に教えることが難しいお話

f:id:ayarpyyy:20190612225228j:plain

先日、ようやくブログをproにしてみました。
.wrokなる謎ドメインです。ヒヒッ!
いたずらにヘッダー背景をグラデにしてみたのでメニューが見づらい見づらい…!
調整しなきゃと思いつつほったらかしています。います!!


さて、今年に入ってから私にも後輩ができ(2人も!)ようやく師匠に恩返しできるミラクルチャーンスがやってきたなというところです。
しかし色々考えなくてはならないことが多くてうまいこといかず
人に教える、というか、教えつつ案件をまわしていくのがこんなに難しいことなのかとさっそく絶望しています。

働く事がめんどくさくなくなる日なんてこないのか

ブログに書くことで脳を!整理しようという算段!
まず何を言いたいのか

▼問題点と反省点と考えた事たち

  • 自分が当然に理解しているものを教える(理解してもらう)事が難しい
  • 指示やフィードバックで言い方を考えて伝えることに脳みそを使う
  • 考え方、取り組む姿勢を教えることが難しい
  • 製作フローを学んでもらうことと、納期の兼ね合いが難しい(力量の見極め)
  • 教えながら自分の作業もこなし、進捗をみつつスケジューリングしていくことが難しい
  • 自分の時間を作る事が難しい
  • 過去に書いた記事が役立った話
  • できないことは悪ではないというお話
  • 師匠に言われてきたありがたいお言葉が染み込むように理解できてきた


こんなところかしら…
少しずつこれらをネタに記事を書いて脳みそお掃除していけたらなと思っている所存です。

ということで1つめ

自分が当然に理解しているものを教える(理解してもらう)事が難しい

なかなか伝わらないな、どうしたら分かりやすく伝える事ができるのかなって思う事が多々あります。

たとえば余白。余白が全然なかったり、ありすぎたりでフィードバックで余白ババアになっている今日この頃。WEBデザインはすべて同じではないけれど、ある程度のセオリーはあると思うのです。(WEBだけでなくDTPもだと思いますが)


4の倍数、もしくは2とか6、8でとるとか
横の余白は縦の倍くらいがちょうどいいとか
5のつく数字は絶対に使わなかったり


これもなかなか「ちょうどいい感覚」が理解してもらいづらいのです。
「ちょうどいい感覚」といいつつもロジックがあり、ロジックがあるけど結果見た目で「ちょうどいい感覚」の余白をつけてほしい。


こういうの、((( ツ タ ワ レ ー ー ー  ‼︎ ))) ハッ!!! って念じてる


「わからない」という感覚がわからないでもないので怒ったりしないです。
ただそのたび念じる。
フィードバックだしつつ奇妙な波動送っている。


あと、自分はレイアウトする時に、自然と見えないグリッドではかってるなって思います。
必殺グリッド・アイ

要素のあるところは四角く枠線が見えていて
その上下左右のエリアの余白が均等か、どこがセンターなのか見てる…!

たまーにやる紙面とか画像デザインの時も
整列ツールで綺麗にしたあと、錯視などの影響でズレて見える場合
最終的に目で見てちょうどいい位置に配置しています。


こういうの、((( ツ タ ワ レ ー ー ー  ‼︎ ))) って思って


説明はするのだけれど、わからないと言われてしまうと自分の説明スキルではお手上げで、 そ、そっか… としか言えない…

こんどホワイトボード使って視覚的に説明してみようかなと思ってます。
(いつもだいたいチャットでの指導、まとめて書いたフィードバックだけ)

デザイン講習会で議題にしたいこともまとめていこう…
そしてここをキャンプ地とする

<デザイン講習会の議題にしたいこと>

1)余白について(見方、つけかた)
2)サイトごとのカラーの指定について


さて 久々にかいたかいたー
↑のネタ記事が続くかどうかわからんけど またメモ書きます。
なんせ備忘録だもの

WEBデザイナー3年目の反省と4年目の目標が難しいお話

f:id:ayarpyyy:20181007220937j:plain

へへ!へへへへ!
記事書くのってなんて気力がいるんだ!ついに年1!
世の会社勤めをしつつブログ書いてる技術者の方はゴイゴイスー…

4年目も無事にWEBデザイナーとして生存しております。
社内の人員の変動や割と大きめの案件が立て続けにあったことで嵐のように駆け抜けた感!

3年目に目標としていたことはなんぞやと見返したところ目標が何一つ変わっておらず

ayarpyyy.hatenablog.com

この1年私は何やってたんかなと思い返すと
コーディングに重きを置いていなかったので変わっておらんのだなと感じた次第です。

この1年で学んだこと

ディレクションのしかた
・仕様の考えかた

大まかに出すとこんな感じでした。

今までも細々とした保守でクライアントと直接やり取りすることはありましたが、新案件でフロントに立つことがなく、私の出したデザインをもとに仕様を考えてもらいそれを実装していくというフローが多かったと思います。

うちの会社(弊社っていうとなんかかたくるしいので)は分業していないので社内にデザイナーとシステムエンジニアがおり、都度相談して仕様を練って実装していくスタイルなのですが、ようやくそこに混じって行けるようになったなという感じです。


3年目の目標は叶えられていませんが、仕様を考えられるようになったので別ベクトルでちょっと成長が実感できました。
システムありきなデザインというか、無理なデザインをしない、ここはこういうシステムでこうやって情報が吐き出されるからこのデザインで…と繋がりを考えられるようになりました。

ここの情報は持ってくるのが難しいのではないかーという箇所も検討つくようになり、システムさんに相談することもできたりなんだり

こうしてフリーになっても困らない基盤ができていくのかなって、ちょっと思いました。
仕様が考えられるようになると、デザイナーだけでワープレ使ってサイト作らなきゃいけない時や、もしも分業することになった時にもシステムや実装に無理のないデザインができるのでスムーズに仕事できるだろうし…


デザイナーは3年目から安定期に入ると師匠が言っていたので、ゆるやかな死をしないようにいろんな技術を高めていけたらなとと思います。

note.mu


後輩ちゃんもできたしね。追い越される恐怖で精神病みそう!ヒヒッ!
ジョジョ5部も始まったことだしテンション上げていかねば

WEBデザイナ2年目の反省と3年目の目標

f:id:ayarpyyy:20180128184051j:plain

順調にブログ更新怠ってます!へへ!
あっという間に2年目も過ぎて3年目突入し、ボヤボヤと過ごしていく事の抑制に反省と目標をば書いておこうと思ったんす。

昨年の今頃の絶望感はそれなりに軽減されていますが、やっぱりまだ失敗も絶望も多く、全然自信はついてないのです。 

デザインについて

昨年指摘されて気をつけていた事
  • フォントのカーニング
  • 視認性を考慮する
  • 一つの要素に対してさりげない効果を3つ以上使う
  • 細部の調整を怠らない
  • 目で見て違和感のない位置が正解なこともある

それなりに体に染み付き、自然とデザインカンプを作る際に行えていたかと思います。その成果か、自分でイマチイ実感はないのですが、しばしば絵を作るのが上手だと褒めていただけるようにもなりました…

デザイン:2年目で指摘されたこと



カンプ作成のスピード向上

最初のたたきカンプを作成し、ブラッシュアップさせるまでの工数がかかりすぎていました。
参考サイトの選出が定まらなかったり、ハッとするような(違和感のない奇抜感というか、新鮮に感じるような)デザインにこだわるが故に思い悩んでしまったり、主張すべきものやまとめるべきコンテンツの精査が遅く、時間がかかってしまっているのかと思います。

3年目はここらへんの勘を養って工数削減していきたいと思います。

 

クライアントの希望や意図を汲み取る

デザインを作成する際いただくコンセプトや指定は抽象的なものが多かったりするので、クライアントから聞き出した情報からよく考えて考えてアタリをつけていけるようにしたいと思います。

ウーンと思う箇所や、なんとも言えない注文にも意地をはらず、どこまでルール内で自分なりにかっこよくしたものを提出できるかがミソなのですね…

 

UIの基礎を学ぶ

メニューやモーダルウィンドウを開閉する時のボタンの位置や、何か操作した時のデザインが弱いと指摘を受けました。
自分なりにロジックを持って配置してはいたのですが、デザインの動線重視で配置していたため、操作感としてはおかしな位置にしてしまっていたりしていたのかなと思っています。
ここら辺は解釈の思い違いなどもありそうなため、勉強していきたいと思います。

 

コーディングについて

昨年指摘されて気をつけていた事
  • うまくいかない時こそ冷静に
  • CSS/SCSSはコメントをつけながらエリアごとにまとめて綺麗に書く
  • 変数などルール決めしたものは必ず使う
  • レスポンシブした時のことを考えながら要素を配置する
  • PC表示時にある要素はスマホ表示でもそのまま使う。
  • PCブラウザで横幅を可変した時の表示とスマホ実機で見た時のデザインは必ずしも一致しなくてよい

冷静になれているかは怪しいですが、こちらもそれなりに体に染み付き、コーディングを行えていたかと思います。レスポンシブで悩んでも折り合いをつける箇所など経験で解決することができるようになってきました。


コーディング:2年目で指摘されたこと



metaタグまわりの確認を忘れない

OGPまわりの設定や、クロールされないようなnoindex記述の取り忘れがあり、冷や汗を書く事がありました。特にクロールまわりについては2度も失敗してしまったため、3度目はあってはならない。。死ぬ思いでリリース前後のチェックシートを作成しようと思います。

 

デザイン側でがんばりすぎない

jQueryである程度デザイナで完結できることもあるけれど、挙動も遅くなったりするので大人しくシステムエンジニアさんにお願いした方がよいこともあるという事。

その案件の規模や料金によって実装の仕方を考えるという感じですね

 

姿勢について

昨年指摘されて気をつけていた事
  • ①一度指摘されたことは繰り返さない
  • ②納期は確実に守る。間に合わないと思った時はすぐに報告
  • ③業務時間外を有効に使う
  • ④言われたまま作るのではなく、自分で考えて提案していく
  • ⑤自分しかいないと思う
  • ⑥常に情報収集をしておく
  • ⑦休む時間も必要

①は、1年目よりかはマシになっていたかと思いますが、繰り返し指摘いただくことがあり、猛反省…

②は、社内納期のフィードバック分の時間を十分に確保できていない事があったため、自己管理能力をアップさせたいと思います。

そして、⑦は結構重要だなと思いました。仕事のことは業務内で納める、休みの日は思い切り休む…!休まないと疲れて思考力が落ちちゃうんすなあ

姿勢について:2年目で指摘されたこと


常にアンテナを貼っておく

情報収集が足りていない…どうしても自分の興味がある記事に偏って読みがちなので反省です。あと、常に新しいデザインを見るように。ついついカンプを作る時などにざざっと調べがちなので、こういうイメージといえばここ、みたいなアタリをつけられる程度に見ておく。

 

説明が下手

説明する時に、いらない情報といる情報の区別がつかず、端的に話そうとしてはしょりすぎたり、焦って説明する順序がメタメタになってしまったり…

机の前に説明の仕方のメモを貼って、説明する前に確認…するけど焦りに勝てず!

効果があるかはわからないのですが、今は時間はかかってしまうけれど何を伝えたいのかをメモに書き出して、どういう順序で話せばよいかシミュレーションしてから話すようにしています。

 

立ち回りが下手

確認など、まわりを巻き込んでいく、ちゃんと自衛しながら進めていくのが重要とアドバイスいただたいのですが、なかなか頭がまわらなくてできなかったりしています。

誰々に確認済み、など自分以外にも確認してもらう人を増やすと、ミスや不具合の検知ができるし説得力が増すので効果的なのだそうです。確かに…私が確認した、となると説得力ないけれど誰々も確認している、となるとじゃあ大丈夫かーとなったりもする。(情けない話ですが)

 



 

2年目の反省と3年目の目標

2年目に目標としていたこと↓
  • 工数管理と自己平均の見積もりを正確にする
    →最初はグラフ管理していたのですが、慌ただしくなるにつれしなくなってしまいました。。しかし、いつのまにか社内平均的な工数を出すようになれていて、見積もりを出す時は師匠の確認なしでもOKな範囲になっていたので成功しているのかと思います。

  • 情報収集
    →これは引き続き…というか永遠ですね…中身のクオリティをアップする。

  • デザインの向上(サイト模写する)
    →何点かしか模写することができなかったのですが、模写することで細かいディティールなど見ただけではインプットできていなかったものを取り込むことができたかと思います。

  • ロゴデザインできるようになる
    →ロゴってどうやってつくるのか、というところから、パターンを把握するとちょっととっつきやすくなりました。ロゴ作成の仕事もすることができ、クリアできたかと思います。

  • jQueryの難しい書き方や短縮記述の仕方覚える
    →複雑な書き方や効率の良い書き方は未だに習得できていませんが、モーダルウィンドウやアコーディオンメニュー、レスポンシブした時のグロナビなんかは自作でササッと書けるようになりました。

  • jQueryだけでなくJSの書き方も少しは覚える
    →これはぜんぜん…手付かずでした。

  • もっとWeb系の本を読む
    →web系というか、デザイン本を定期的に購入していました。これも引き続き。


上で書いた以外の、3年目の目標は引き続きこんな感じですかね…

  • jQueryの難しい書き方や短縮記述の仕方覚える
  • JSの書き方を少しは覚える
  • phpの基礎も理解したい
  • UIデザインの勉強

3年目ももう数ヶ月すぎてしまいましたが、引き続きがんばるぞ…!

環境もちょっとずつ変わってきているのでしっかりせねばな3年目。