レスポンシブWebサイトの構築ができるSaaSアプリケーション「​Webflow(ウェブフロー)」

レスポンシブWebサイトの構築ができるSaaSアプリケーション「​Webflow(ウェブフロー)」について解説しています。

■フリープランを利用する

まずは「Webflow(https://webflow.com/)」のページにアクセスします。

アクセスすると、「Get started – it’s free」ボタンがありますので、こちらをクリックします。

クリックすると、「The most powerful web design tool awaits(最も強力なウェブデザインツールが待っています)」と書かれたウインドウが表示されますので、「Sign in with Google(Googleでサインイン)」ボタンをクリックします。今回はGoogleアカウントでのアカウント登録を行いますので、事前にGoogleアカウントを取得しておく必要があります。取得したアカウントでGoogleにログインします。

クリックすると、「ログイン – Googleアカウント」というページが表示されます。ページ内には取得したGoogleアカウントが表示されていますので、アカウントを選択します。

選択後、「We’ve got a couple quick questions(いくつか簡単な質問があります)」と表示されますので、「Let’s go」ボタンをクリックします。

クリックすると、「What best describes your role?(​あなたの役割を最もよく表しているものは何ですか?)」と質問されますので、表示されている「Web designer(WEBデザイナー)」、「Product designer(プロダクトデザイナー)」、「Developer(デベロッパー)」、「Marketer(マーケター)」、「Entrepreneur(企業家)」、「Other(その他)」の中から該当するものを選択し、「Continue」ボタンをクリックします。今回は「Other」を選択しています。

クリックすると「Who will you be building websites for?(​誰のためにウェブサイトを作るのですか?)」と質問されますので、表示されている「Clients, as a freelancer(​フリーランサーとしてのクライアント)」、「​Clients, as part of an agency(代理店の一部としての顧客)」、「The company I work for(​私が勤めている会社)」、「​My business(私の仕事)」、「Myself(​自分自身)」の中から該当するものを選択し、「Continue」ボタンをクリックします。今回は「My business」を選択しています。

クリックすると「Do you have experience building websites?(​​ウェブサイトを作った経験はありますか?)」と質問されますので、表示されている「Never built(​未構築)」、「Used website builders(​使用済みWebサイトビルダー)」、「Some experience(ある経験)」、「Expert(エキスパート)」の中から該当するものを選択し、「Continue」ボタンをクリックします。今回は「Some experience」を選択しています。

クリックすると「What do you want to build today?(​​​今日は何を作りたいですか?)」と質問されますので、表示されている「Business site(ビジネスサイト)」、「Ecommerce store(eコマースストア)」、「Portfolio(ポートフォリオ)」、「Blog(ブログ」、「Other(その他)」、「I’m just testing Webflow out(Webflowをテストしているだけです)」の中から該当するものを選択し、「Finish」ボタンをクリックします。今回は「Business site」を選択しています。

クリックすると「Create your first project(最初のプロジェクトを作成する)」と表示されますので、プロジェクトの作成を行います。今回は「Business Starter」というプロジェクトを選択します。

選択すると、「Welcome to Webflow」というポップアップが表示されます。「Let’s go」をクリックすると、Webflowの説明が表示されます。「☓」ボタンをクリックするとポップアップが閉じます。

説明を終了すると、レスポンシブWebサイトを構築するためのエディタ画面が表示されますので、構築を開始することができます。

コメント

タイトルとURLをコピーしました