UX / UI のデザインに強いWebシステムの開発と、BtoB Webマーケを支援するWeb制作を提供する
N's Creates (エヌズクリエイツ) 株式会社 フロントエンドエンジニアの齋藤 (@31mskz10) です。

最近はSTUDIOやWix Studioなど、ノーコードでウェブサイトが作成できるサービスの勢いがますます強くなってきました。

ノーコードサービスとは？

ウェブサイトは、デザインを作成した後に「コーディング」という、コードを書いて実際にウェブサイトを実装するフェーズが必要になります。

しかし、ノーコードサービスはコードを触ることなく、簡単な操作でウェブサイトの作成ができます。

最近はデザインツールのFigmaと連携して、デザインをそのままノーコードサービスへ取り込む機能もあります。

昔のノーコードサービスのイメージ

昔のノーコードサービスのイメージといえば、少し専門的な話になってしまいますが「position: absolute;」を大量に使い、中身はめちゃくちゃでとりあえず見た目だけ揃えるようなイメージがありました。

しかし、最近はきちんとコーディングされ、普通にコーディングしようとすると工数がかかるようなことまで、簡単に実現できるようになってきました。

正直、複雑なプログラムが発生しない単純なウェブサイトであれば、ノーコードで十分だと感じています。
しかし、その反面でデザインデータの構造（作り）が重要になってきたなと感じています。

デザインデータ作りの大切さ

昔はレイヤーが多少ぐちゃぐちゃでも、問題なくコーディングできていましたし、デザインツールの機能をフルで活用する必要もありませんでした。

もちろん活用した方が便利ですし、早く作業が終わりますが、コーディング作業への影響という意味では、（活用してもらっていた方が嬉しいですが）問題ありませんでした。

しかし、例えばFigmaからSTUDIOに連携する場合は、オートレイアウトなどFigmaの機能をちゃんと使っていないと、STUDIOに連携したあとにレスポンシブの対応で想定通りにならない可能性が出てきます。

結果として、STUDIO側で余計な作業が増えてしまう可能性があります。

「見た目が同じだから、まあ良いでしょう」ではなく、適切なFigmaの機能を使ってデザインを作成していないと、後々の連携に影響してしまうのです。

そしてこれはある意味、「コーディング作業が無くなった」のではなく「コーディング作業がデザインツールの操作に統合された」という捉え方もできます。

デザインツールでの操作が最終的なウェブサイトに影響してしまうわけですから、今まで以上にデータ作りが重要になっていきそうだなと感じました。

UX / UI のデザインに強いWebシステムの開発と、BtoB Webマーケを支援するWeb制作を提供する
N's Creates 株式会社は、神戸三宮オフィスまで週１出社（それ以外はリモートワーク）できる「デザイナー」「エンジニア」を募集しています。

興味のある方は、カジュアル面談しますので気軽にお問い合わせください！