見出し画像

新人webデザイナーが入社して4ヶ月。

みなさん、お久しぶりです。
新人webデザイナーとして、入社して4ヶ月がたちました。
全然blog更新できてなかったと、反省!!!

泥臭くてもリアルをお届けしたい!を、モットーにもっと更新していこうと思います!

この4ヶ月、私が新しく学んだ事を紹介しようと思います。

『webデザイナー興味あるけど、どんな仕事をしてるんだろ?』とかっ。
『実際働いたら制作よりも、違う事してるのかな?』とか。
私も働く前に色々思ってて、そんな方の参考に少しでもなれたらなって思います。

会社によってそれぞれだけど、『へぇ〜っ🍵』くらいの気持ちで見てください。
お付き合いいただけたら嬉しいです。

4ヶ月で携わった事

  • HTML/CSS

  • figma

  • WordPress

  • LPデザイン

  • ココナラ出品

  • サムネイル制作

  • snsで営業

ザッとこんな感じです!

一つのことを4ヶ月じっくりとゆーより、色んなことに挑戦することができました。

私は、Illustratorばかり触ってきたので、HTMLとは?figmaとは?WordPressとは?くらいで、聞いたことあるなーくらいのレベルです。
だから始めた時はわからないことだらけで毎日が、『わからぬっ( ・∇・)』の連続でした。(現在進行形ですが)

ですが!!!今までしてきたイラレの中の一個のキャンバスに、自分の想ってるデザインを起こしていく作業ではなく。
HPってゆうでっかいキャンバスをゲットできた感じがして私はワクワクしてます!!
コーディングも、figmaも、WordPressも、そのキャンバスを思いっきり使い切る道具と思ったらますます色んなことを学びたいってゆう気持ちが爆発しております!(by岡本太郎)🔥🔥

全部が今のところ極めることができてないのが反省点だけど、それは自分に甘々なところもあるので将来の自分に託す!がんばれ!w

一個ずつ振り返りたいと思います!!!
といいたいところなのですが、盛りだくさんで朝になっちゃうので3つ軽く現時点での気づきを共有できればなと思います。


HTML/CSS

サイトの保守作業に携わることが多かったと思います。
HTML/CSSでまずぶち当たったのが、どう質問したらいいかわからない!でした。(←そこかいw)
そもそもに原因がわからないからどう質問したらいいかわからないんです。
そこでお助けマンなのが検証ツールです!
すべてのサイトには検証ツールでHPの中身が見れちゃいます。包み隠さず全部見れちゃいます!
検証ツールを使いこなせれば結構解決できるのではないか!と思うくらい問題の原因を簡単に証明してくれます。検証ツールを作ってくれた人ありがとう!!
原因がわかれば調べられるのでGoogle先生や、先輩方に質問もしやすくなると思います。
そもそもHTML/CSSの違いはなんぞや?ですが。
HTMLでは、ページ内のグループ分け
CSSでは各グループをデコっていくみたいなイメージです。
CSSで、デコっていくためにはいろんなコードがあります。
全部覚える必要はないのですが選択の幅を増やすために色んなサイトを検証ツールで覗き見しなきゃと思います。

figma

HP内でHTML/CSSをさわっていくと、幅をとることに気付かされます。
サイトを作る上で、まずラフ画みたいに大まかなデザインをかいて、幅を決めていきます。このラフはデザインをコードに起こしていく際に大事なメモみたいな役割をしてくれます。
そのハイテクラフ画を作ってくれるのがfigmaです。✨✨
サイト内では均等であることが美しく、みやすいサイトになるので、デザインの段階でも均等に幅を持つ事がとても大事になります。
なので同じ幅感でデザインを作る箇所が細かい所から大きいところまでいっぱいあるんです。ほんとにいーっぱいw
正直、ここもか!!みたいなくらい多いです!
例えば、各ボタンの位置とかブログの記事の均等な日付とタイトルの間とか、、、

一個づつかえるのめんどくさいじゃないですか、、、一括でできたら楽じゃないですか。そんなお悩みをまるっと答えてくれるのがfigmaなんです。便利〜。
デザインの段階でコードはこうしよう!ってゆうところまで考える事ができます。
そしてみんなで同じページを共有できるのもいい点です。

まだまだ未開拓なので学習したらまたブログ書きます。

WordPress

先ほどのHTML/CSSとfigmaを合体させた最強の主がワードプレスです。
HPは作って終わりではなく、みていく人が飽きないように常に更新していくものだと思います。
だからさきほどのfigmaみたいに一括で変更したり増やしたりできればなんて便利なんだ!とゆーところにぶち当たります。
HTML/CSSでかいてても、一個の更新記事が増えるだけで何十件とある記事を一個づつずらしていかなきゃいけないなんてこともあります。TAIHEN!!💦

ワードプレスでは自分でオリジナルテンプレートのようなものを作る事ができ、レイアウトを崩す事なく簡単に更新を行う事ができるのです。

どう簡単かというと、自分が作ったテンプレートに名前をつけて
コード内で、【A】名前がつくときは【A】のテンプレートを表示させてね!
ってゆう感じで色んな着せ替えを自分で作ってページ内に当てはめていくイメージ。
HTMLみたいに一個のサイトに山盛りの情報をつくるのではなく、
『このページは違うデザインのヘッターにしたいからこっちにしよっかな〜🎵』『でもこっちもいいな〜🎵』みたいな事が決めた名前一つで変更可能なんです!
私みたいな優柔不断さんにはとっても嬉しい機能です✨

あれ、、、もしかして最強なのでは!!と思ってます。
勉強していくので共有していきます。
本ぶあついな〜。

おわりに

どどっと4ヶ月が過ぎていきました。
まとめって苦手、、、(笑)
勉強あるのみっとゆう感じです。
この4ヶ月でしか学べてないことなので、内容がまだまだ薄くてスミマセン。。
わからない人でもわかりやすく、共有できればなっと思ってます。

次回ココナラの出品紹介させてください!

読んでくださって感謝です🙏

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