#01 | はじめてのウェブフロー：導入のメリットと機能

‍

‍

はじめまして、Webデザイナーのワタナベです。

こちらのページではウェブフロー初心者でも使いこなせるよう、ウェブフローについて解説していきます！

ウェブフローとは？

ウェブフローは簡単にいうと、「コードを書かなくてもwebサイトを作成できる『ノーコード』と最近呼ばれる類のwebアプリケーション」です。

コードはインターネットの中核の役割を持っているので、ウェブサイトやアプリを構築するために欠かせません。

そのため、「ノーコード」とは、「コードを使わずに開発する」ということではありません。

「ノーコード」とは、コードをビジュアル化（見える化）することで、より簡単に（そしてより速く）コードを書くことに焦点を当てられています。

つまり、デザインするだけで、ウェブフローのようなプラットフォームが自動的にコードを書いてくれる時代になったのです！

ウェブフローでは、「基本的なコードに基づいてデザインする」という意識で制作に取り組めば、専門的なコードの知識がなくても制作をすることができます。

そして、感覚的にデザインをするうちにコードの書き方も学ぶことができるかもしれません！

‍

ビジュアルWebデザインツールであるDesigner機能では、今までの常識と最適な操作性に基づき、デザイナーが設計したデザインを、シームレスにクリーンな制作に適したHTML、CSS、JavaScriptに変換することができます。

つまりデザイナーが、コードが打てなくても問題なく、画面上で（感覚的に、直感的に）Webサイトを開発することができます。

プロトタイプ作成が中心の方は、デザイナー機能だけでプロトタイプをエンジニアと共有して再現したり、コードをエクスポートしたりすることもできます。

デザイナー機能と同様に、CMS（コンテンツマネジメント機能）もまた、ノーコードのウェブ開発ツールです。

CMS機能には、インデザイナーの要素（サイトデザイナーが作業する場所）とオンサイトの要素（クライアントやコンテンツマネージャーが作業する場所）があります。

後者の要素をEditor（エディター）と呼んでいますが、これについては後ほど説明しますね！

コレクションと呼ばれるコンテンツタイプの雛形を作成したら、さらにデザイナー機能を用いてアイテムをサイトでどのように表示するかをオリジナルで設計することができます。‍

ウェブフローの「Ecommerce機能」では、デザイナー機能とCMS機能の力を合わせて、オリジナルにカスタマイズされたEコマース（いわゆるネットショッピング）を作ることができます。

ウェブフローのプロジェクトであればどのようなものでもECサイトにすることができますが、ホスティング料金は通常のWebサイトとは若干異なります。

ECサイトは、Stripe、Apple Pay、Paypal、Google Payなどの決済ゲートウェイと接続できるほか、さまざまな統合機能によって店舗の機能を拡張することができます。

ウェブフローの４つの役割の最後のピースは、ホスティングプラットフォーム（すべての動作を支える動作環境）です。

Amazon Web Services (AWS)とFastlyに支えられたこのプラットフォームは、非常に高速で信頼性が高く、大企業グレードのセキュリティを備えており、以下のような高パフォーマンスな機能を利用するために必要となります。

つまり、ウェブフローにはデザインの組み立てから始まり、運用に至るまで、サイト運営に必要な機能が全て揃っているのです。

ウェブフローの４つの機能と利用するメリットをお分かり頂けたでしょうか？

次回はウェブサイトを作る基礎知識について説明していきます！