Webデザイナーがワンストップ(フルスタック)できちんしたWebサイトを制作することが日々難しくなっていると感じます。

ヒアリング、ディレクション、UX、デザイン起こし、コーディング、レスポンシブなど、やるべきことがあまりにもたくさんあるからです。

特にフリーランスのWebデザイナーが自分一人で制作案件をこなす場合はかなり大変かもしれません。単一ページのランディングページの制作などにシフトしたいところですが、セールスライティングやマーケティングに長けていないと、顧客の課題解決に繋がるLPを創り上げるのは難しいとも言えます。

結果的にWebデザイナーは、既存のスキルだけでなく、常に何かのスキルをセットし続けないといけない職業になったと言えます。月収100～200万円以上を目指していくなら、なおさらです。

そこで、今回はWebデザイナーのスキルセットの選択の一つであるWebプログラミングに焦点を当てていきたいと思います。

Webデザイナーの価値を高めるWebプログラミングとは

そもそもWebプログラミングとは

Webプログラミングとは、WebアプリケーションやWebサービスの開発の際に行うプログラミングです。

Webプログラミングができれば、動的なWebサイトやWebサービスを作ることができます。そればかりが、デザインによりリッチなアニメーションを加えることも可能です。

コンテンツを単純に見せるだけのサイト以外のサイトが作れるようになれるので、Webデザイナーとしての守備範囲が格段に広がります。

また、日々、良質なオープンソースが開発されています。Webプログラミングができれば、オープンソースを自分なりにカスタマイズして、顧客のニーズに寄り添ったWebサイトを納品することもできます。

Webデザイナーの価値を高めるWebプログラミングは多くの場合、Webサイトの表示に繋がる、もしくはWebサイト表示に近接するフロント側のプログラミングになるでしょう。

フロント側のWebプログラミングを行う人たちはフロントエンジニアと言われています。

このフロントエンジニアと呼ばれる人たちが、今後、Webデザイナーのライバルとなり得る可能性があります。

Webデザイナー VS フロントエンジニア

フロントエンジニアがWebデザイナーの役割を網羅する可能性が出てくる

Webプログラミングでできることが非常に多くなっているので、Webデザイナーの役割が侵食される可能性があります。

例えば、WebデザイナーがPhotoshopやXDを使ってデザインしていたデザインを、フロントエンジニアが図形計算処理で創り上げることもできます。値を変えるだけで様々なデザインを出すこともできますし、時間やユーザのアクションと紐づけて、カラーバリエーションを変更することもできます。

結果的にフロントエンジニアが組み込んだWebデザインのほうがリッチに見えてしまいます。

PhotoshopやXDのカンプデザインに強いWebデザイナーの弱点は、あまりにも静的にデザインを仕上げるということです。

もちろん、静的なデザインされた画像だけをHTMLに張り付けていくことが求められるケースはまだまだたくさんあります。例えば、通販のLPなんかはいまだにすべてが画像で作るケースが多いです。カンプデザインに長けていないと作れないレベルが求められます。

デザインカンプ力に全振りしてWebデザイナーの道を突き詰めるのもアリだと思います。

しかしながら、Webプログラミングのリテラシーを持っていれば、エンジニアリングを施す前提でカンプ作りができるようになります。

様々なWebデザイナーのデザインカンプを見ると、「このデザイナーはライティングスキルがない」とか「このデザイナーはJavaScriptのことは知らない」というのが浮き彫りになります。なぜなら、デザインカンプをデザインするキャンパスとして捉えていることがデザインに鮮明に表れているからです。

今後はWebデザイナーとフロントエンジニアがライバルとなる場面は多くなっていくと思います。

例えば、今後、良質で優良なデザインサービスやデザイン素材が溢れれば、フロントエンジニアはそれを使いながら良いWebデザインをアウトプットすることができるようになるかもしれないからです。

そうなると、Webデザイナーが出る幕が少なくなります。逆にWebデザイナーがWebプログラミングをより手軽に扱えるようになるオープンソースが登場すれば、フロントエンジニアを必要としなくなる可能性も出てくるでしょう。

Webデザイナーが身に付けたいWebプログラミングとは

JavaScriptとモダンJavaScriptフレームワーク

今後、Webデザイナーが最も行うべきWebプログラミングは何かというと、それはJavaScriptとモダンJavaScriptフレームワークと言えるでしょう。

なぜなら、JavaScriptの存在感がWebの中で日に日に大きく増しているからです。

JavaScriptを扱えることが、Webデザインができることだと認知されていくようになる可能性も出てきます。

JavaScriptをよりWebの中で輝かせ続けているのが、モダンJavaScriptフレームワークです。

JavaScriptフレームワークには、

・AngularJS(アンギュラージェイエス)
・React(リアクト)
・Vue.js(ビュージェイエス)
・Backbone.js(バックボーンジェイエス)
・Knockout.js(ノックアウト)

などがあります。

Google、Facebook、Yahoo、Instagram、Netflixなど、有名なサービスでも採用されていて、JavaScriptフレームワークを使うことで、手軽に様々なアプリケーションを実装できるようになります。

上記の中でも、よりシンプルに学べて、Webデザインと融合させやすいのはVue.jsだと感じます。

また、今後はWebサイト高速化やセキュリティのために、CMSからSSG(静的サイトジェネレーター)が主要になるのではないかとも言われています。

そして、静的サイトジェネレーターの多くはモダンなJavaScriptフレームワークによってつくることができます。特に動的な処サイトジェネレーター辞書的なCMSは静的サイトジェネレーターへ移行するメリットが大きいでしょう。

Webデザイナーがキャリアや自身の存在価値を高め、より幅広い案件をより高価で得るために、JavaScriptとモダンなJavaScriptフレームワークをスキルセットしていくのはとても良いことでしょう。

JavaScriptが扱えるようになれば、JQueryプラグインをカスタマイズすることもより簡単になっていきます。既存のWeb制作でも非常に役に立っていくでしょう。

Webデザイナーは新たな一手と向き合い続ける職業である

気づけばWebをより自由に扱うことができ主体的に稼ぐことができる

以上、WebデザイナーがWebプログラミングにどう向き合うべきかについて掘り下げて解説してきました。

Webデザイナーという職種は、常に新たなスキルをセットすることが求められてきた歴史があります。そして、これからもそれは変わることがないでしょう。

ただし、スキルは廃れるわけではありません。過去のスキルを通じて学んだ考え方、捉え方、知識は、新たなスキルを習得する吸収力に直結します。

これはWebデザインの世界に限ったことではありません。おそらくWebデザイナーの職に向き合った人は、まったく新たな分野のスキルセットも爆速になるでしょう。

WebデザインとWebプログラミングが双璧になれば、小さなサービスをどんどんアウトプットして、広告収入で稼いだり、マッチする企業へ営業してサービスをバイアウトしたり、案件受注以外の様々な可能性があります。

ぜひ、Webデザイナーとしてのキャリアを思いきり輝かせるために、Webプログラミングのスキルセットも検討してみてください。