未経験webデザイナーの1ヶ月間の過ごし方。やった仕事まとめ

実務未経験からwebデザインの現場に飛び込んで早くも1ヶ月が経ちました。

右も左も分からない状況で、とにかく何でもやるぞという気持ちと、これから先どうなるのかという漠然とした不安と戦ってきました。

そんな中でも1ヶ月、職場の人に支えられたり、自分でもやれることを探してスキルアップを心がけてきました。

走るとり
最初の1ヶ月でかなりいろんな仕事を受けました

【6ヶ月間の軌跡!】未経験から独学でwebデザイナーになった僕の転職方法

2018.10.22

未経験webデザイナーが1ヶ月でやった仕事

初心者マークをつけたままではありますが、給料が発生している分はしっかり働きました。

1ヶ月間でやった仕事をまとめて振り返ってみます。

webサイトの簡易的な修正

できあがっているwebサイトの修正です。すでに基盤となるコーディングはされているので、修正箇所に追加の文章をコピペして完成。難易度的にそう難しくはありません。

コードも分かりやすく書いてあるので助かりました。

ただDream Weaverに慣れていなかったり、そもそも他人のコードを見て修正するなんて、独学時代ではやらなかった(やれなかった)ことなので緊張しながら作業しました。

ランディングページのカンプ制作

僕が過去にカンプをつくったのはポートフォリオのためだけで、しかもPCのファーストビューの3点だけでした。

ランディングページ(LP)のカンプを頼まれたときは「なんとなく作れるだろ~」と思ってましたが、淡い期待は一瞬で消え去り、まず何をどこから手をつけていいかわからない状況に陥りました。

悩んだ点は5つ。

  • フォントサイズはどうしたらいいか
  • 画面サイズは何pxでつくったらいいか
  • 余白はどれくらいあけたらいいか
  • どうしたらコーディングしやすいか
  • 書き出す画像はどうしたらいいか
  • スマホサイズはどうやってつくるのか

カンプは後ほどのコーディングに関わる大事な設計図のようなものなので、あまり感覚的に作ってはいけません。

上司からは

PC1000px スマホ幅750pxで作成。

フォントサイズに関しては、PCは画面上と同じサイズでOK。スマホはその2倍くらいで作ればOK。

余白は両端3%あける。

との指示のもと作成しました。あとは見せて修正、見せて修正を何度か繰り返しました。

Photoshopに慣れていないせいもあり、めちゃくちゃ時間がかかりました。もっとレイヤー整理とかできれば作業効率は上がりそうです

PCとスマホの画面サイズの差にも悩みました。PCの感覚でスマホのLPをつくるとかなり文字が小さくなったりとか。

LPコーディング

縦に長くつくった画像をスライスしてつくります。

<img>タグを連ねるだけなので、難しいコーディングではないのですが、スライスすることすらほぼ初めてだったので苦戦しました。

慣れてしまえばどうということではないのですが、やはりどの部分をどのくらいスライスすればいいの?と時間ばかりかかってしまい、さらに時間がかかることに焦り始める負のスパイラルに陥りました。

HTMLメール

画像付きメールのことです。前職ではガラケーに送るような超簡易メール(コーディングなし)をつくったことがありましたが、当然それとは別物。

画像はFTPでアップロードしなければいけないし、CSSは使えないからstyleタグで体裁を整えなければいけません。

FTPstyleタグと出た時点でもうちんぷんかんぷんでした。

時間をかけて、先輩のアドバイスをもらいながら完成までたどり着きました。

バナーデザイン

一番数多くやった仕事かもしれません。コーディングよりもこちらの方が得意ということがあり、上司もできる仕事からガンガン振ってくれてる感じです。

バナーも一発で通るときもあれば、そうじゃないときもあり、通らないときは何度出しても「ちょっと違うな~」と言われ修正することも。

僕よりもディレクターさんの方が目が肥えてるので、デザイナー・ディレクター問わず修正指示をもらってる状況です。

ひとつのバナーをつくるとサイズ展開で何個もつくる必要がある場合もあります。

正方形でつくっていたものを縦長、横長につくるのはまさにパズルをやっている気分です。

いまでは自分なりにバナーの作り方もある程度セオリーを持って作っています。

webデザイン初心者のバナーデザイン制作手法【#バナーお題】

2018.12.02

年賀状デザイン

会社の年賀状デザインをつくりました。

webの会社なので紙では送らずメールを出すみたいです。入ったばかりで会社の年賀状デザインを任されることが嬉しかったですが、プレッシャーでもありました。

個人で送る年賀状ではないので、会社を意識したデザインをしました。

テクスチャ素材の使い方がいまいち分からず、素材サイトの素材をそのまま使いがちになってしまいました。素材まで自分で用意してデザインできればデザイナーとしてステップアップしていけるかも…?

チラシ作成

web会社なのですが、クライアントからチラシやパンフレットの制作依頼もあるようです。

ここでは広告業で培ったillustratorの実務経験が生きました。

最近ではPhotoshopしか(ほぼ)使わなくなりましたが、ふとしたタイミングで別のAdobe製品が使えるのは強みだと思います。

まだまだ使ったことのないAdobe製品があるので、ぼちぼち触ってみます。

画像編集

ECサイトに登録する画像をつくりました。例えば300x300pxの白背景に商品名と商品画像を配置する作業です。

単調な作業ですが、数が多いです。100枚くらいの画像たちを何時間もかけて編集していきます。作業内容も意外に細かくて、テキスト占有率何パーセント以内に抑えなければいけないという指定もあります。

画像の配置、文字の配置にも上司の目が光るので、適当にやったら即修正がはいります(適当にやってはいませんが)。

コラム執筆

自社サイトのコラム記事を書きました。入社してまだ1ヶ月も経ってなかったのですが、デザインについてのコラムを書きました。知識もないのにコラムなんて書いていいの?と思いましたが、知らないことを調べて自分の知識にした上で、プラスアルファの情報を発信することに意味があるとのこと。

定期的に書くことになっているので、SEOや文章力向上に役立つかもしれないですね。

会社のサイトに載るので誤字脱字にはかなり気をつけました。

webデザイナーが誤字脱字を防ぐためにしている具体的な方法

2018.12.23

まとめ:もっと早く効率的に!量をこなしていきたい

1ヶ月を通してみるとさまざまな案件に携わってきたなという感じです。

ただし上司に比べれば僕の業務量はまだまだ少ないです。同じ時間だけ働いて生み出せるものが少ないのは悔しい。

なのでもっと効率よく作業をこなせる技を身につけていきたいと思います。

走るとり
まだ始まったばかり。でも一年後は胸をはってwebデザイナーといえるようになっていたい!