この度、ポートフォリオ兼自身の備忘録として、この「kajimaru note」を開設しました。

実はこれまでにも同じようなブログを何度も作っては閉じる、ということを繰り返してきたんですが、最近になって色々と思うこともあり、今回またこうして形にすることにしました。

過去に書いた記事も修正・加筆して少しづつアップしていこうと思います。

この記事は、サイトリリースに向けた実装段階でのテスト投稿になりますが、せっかくなのでこのサイトを作ろうと思ったきっかけについてお話できればと思います。

「考えること」の必要性

まずひとつ目のきっかけは、最近のAIの急速な普及です。

ここ数年でAIは一気に身近なものになり、今ではWeb初心者でコードにそこまで詳しくなくても適切なプロンプトを与えることである程度イメージに近いWebサイトを作れるようになってきました。

そう考えると、AIが答えを提供してくれる今、わざわざ自分で調べたり、試行錯誤したりしたことを備忘録として残しておく意味はあまりないようにも思えます。

もちろん、AIは便利で、自分もコードを書いていてわからないところを質問したり、書いたコードを添削・レビューしてもらったり、実装方法のヒントをもらったりすることはよくありますが、その一方で、AIに頼り切った制作では、生成されたコードが「どういう処理手順で動いているのか」を理解しないまま使いがちです。

これはエラーが起きたときに、どこを直せばいいのか判断できなくなったり、一見うまく動いているように見えてもアクセシビリティやパフォーマンス、保守性などに問題を抱えている場合に気付けないということに繋がりますし、そして何より、AIに「こうしてほしい」と具体的な指示を伝えるためにも、ある程度は自分自身がコードやWebの仕組みを理解している必要があります。

技術が進歩して、便利なものが使えるようになったのであれば、それを使わない手はありませんが、AIに任せられるところは任せて、自分で考えるべきところに時間を使う。そういう付き合い方が、これからのWeb制作では大切なのかなと思っています。

だからといって、すべてを完全に理解する必要もなく、この「kajimaru note」も何かをゼロから覚えるための教科書というより、自分が調べたり、試したり、つまずいたりしたことを残して、その過程を共有する場所にできればと考えています。

AIを使いながらでも、「これってどういう仕組みなんだろう」と一歩踏み込んで考えるきっかけになればいいなという思いからこのサイトを立ち上げました。

デザイナーとコーダーの認識差

そして、もうひとつの理由は、「デザイナーとコーダー間にある認識差を埋めたい」と思ったことです。

仕事柄、デザイナーが作ったデザインをもとに、動きやインタラクションの仕様をまとめてコーダーに伝える、という工程があるのですが、その中でデザイナーに対して「このデザイン、実装するのが結構難しいです…」と差し戻しになるケースがよくあります。

デザインとしてはもちろん成立していて、見た目もすごくいい。
ただ、いざブラウザ上で動かすとなると複雑なJS処理が必要だったり、実装するために想定以上の工数が必要になったりすることがあります。

そうなると、当初の見積もりよりも工数が増えて予算をオーバーしてしまったり、場合によってはデザインそのものを調整・再考してもらう必要が出てきたりします。

そしてそのたびに、「なぜこの実装が難しいのか」「どうしてこれだけの工数がかかるのか」といったことを、デザイナーに説明するのですが、

もちろん、これはデザイナーに非があるわけではなく、デザイナーにはデザイナーの専門領域、コーダーにはコーダーの専門領域があります。こういったやりとりが発生するのは、ある意味では当たり前のことなのかもしれません。

ただ、デザイナーがWebやブラウザの仕組み、HTMLやCSS、JavaScriptといったコーディングの基本的な概念を知っていれば、「これは実装するのが大変そうだな」と事前に想像できる場面は増えるし、逆に、コーダー側もデザインの意図を理解していれば、お互いに「なぜこうしたいのか」「なぜこれは難しいのか」を話しやすくなり、意図に沿ったかたちでの代替案も提案しやすくなります。

そうやって、お互いの領域を少しずつ理解することで、制作途中で発生する無駄なやり取りや手戻りを減らせるんじゃないかと考え、このサイトに載せる内容もそういった部分を少し意識していきたいと思っています。

特に、これからWeb業界に入ろうとしている人や、デザインを中心に仕事をしているけれど、Webやコーディングについてもう少し知っておきたいという人にとって、何か参考になるものになれば嬉しいです。