皆さん、こんにちは！LikePay.dev Academyのイーゴリです。
今回は、2021年11月18〜19日にWebflowの開催したNoCode Conferenceで発表された新しい機能について日本語でまとめたいと思います。
こちらの記事は、Webflow公式ブログを参考にして書いてきました。
Webflowは、世界人口の0.5%しかWeb開発ができない現状の中、2013年からコードを書かず、ビジューアル的にWebのUIが作れるNoCodeムーブメントにコミットしてきました。
今まで、WebflowはUIを作れるツールを開発してきて、多くのユーザーさんに素晴らしい、優賞的なWebサイトが作れる力を与えてきました。これからは、UIだけではなく、よりリッチなユーザー体験が作れるいくつかの機能を発表しました。
・メンバシップ（会員機能）：最新の機能で、Webサイトに有料会員システムを追加できるようになります。
・ロジック：条件を付けてカスタムなワークフローが作れる（ZapierやIntegromatのような）機能です。
・共同編集：ワークスペースとより細かい権限管理機能。
・ブレンドモード：重なるエレメントの色ブレンドをWebflowで設定できる機能です。
・バックドロップフィルタ：エレメントの後ろの背景にブラーや色シフトのエッフェクトが作れる機能。
・アクセシビリティガイド：ベータ版リリースに続いて、アクセシブルなWebサイトの構築をさらに簡単にする新しい監査パネルを公式にローンチしました。
・CMSパフォーマンス向上：データアーキテクチャをアップグレードして、Webflow Designerでのプロジェクトの読み込みが最大15倍高速になり、ブラウザーでのメモリ使用量が6分の1になり、読み込みに必要な帯域幅が86分の1になりました。
メンバシップ
Webflowメンバシップは、決済機能やアクセス権限を持ったパワフルな会員サイトをWebflow内に作れる機能のセットです。
デザイナーツールに追加されたのは、下記の三つ機能：
・ユーザーデータベース：会員のデータベースを直接にデザイナーツールから管理できます。そうして、豊かなユーザー体験を実現するために不可欠でさる、パスワードリセットのような通知メールとログインや新規登録のようなページ画面も設定できるようになります。
・アクセスグループ：ユーザーのログイン状況によって表示・非表示するコンテンツの管理も可能です。
・会員費：有料会員プランを作成できるようになります。一括のお支払いも、月額や年会費のサブスクリプション課金も設定可能です。
メンバシップ機能を使えば、会員限定のコンテンツとページを100％自由にデザインできます。例えば、フリーランスや制作会社の方は、クライアント限定の管理画面やコンテンツが作成できます。
メンバーシップのベータ版は段階的にオープンされ、NoCodeカンファレンスの直後に最大のベータテスターグループに開放されます。順番待ちリストはこちらから登録できます。
ロジック
Webflowの追加機能としてロジックが発表されました。
この機能によって、Webflowユーザーはカスタムアクションとコンディションを使って、自由にワークフローが作れるようになります。フォーム送信のような、特定の流れ通りに実行されるアクションではなく、様々な条件を付けてアクションの流れを自由にカスタマイズできます。
もちろん、ロジックのワークフローは、コードを書かずにデザイナーツールから作成できるようになります。エンジニアを雇うことなく、Webサイトのバックエンドが開発できます。
ロジックは2022年にリリースされます。ロジックは、リード獲得から、サイトコンテンツの更新と管理、さらには顧客とのコミュニケーションまで、WebflowのCMS、フォーム、メンバシップのような強力な機能をつないで、よりインパクトのあるユーザー体験を作成するための無限のツールです。
チームの継続的な改善
Webflowのチームがより簡単に共同で作業できるように、2つの追加のコラボレーション機能が発表されました。
１）チーム拡大をシンプルにするワークスペース。個人アカウントとチームアカウントプランは、必要に応じて一人から複数人ユーザーまで一緒に使えるワークスペースプランに合併されます。
２）新しい請求とパブリッシュ権限管理。ワークスペースは、シンプルでスケールしやすいだけではなく、より豊かなアクセす権限管理の機能もあります。アカウント全体とプロジェクトレベルでそれぞれのチームメンバーのアクセス権限を設定できるようになります。
これからも、コラボレーション機能はさらに改善されます。2022年に、プロジェクトごとのアクセス権限の設定とコメントのみのアクセス権限とコンテンツ編集のみのアクセス権限が開発されます。
今年夏にリリースされたコラボレーション機能と、これから2022年にリリースされる機能についてはこちらを見てください。
新しいデザイナー機能
より細かくデザインをコントロールするためには、デザイナーの新機能としてブレンドモードとバックドロップフィルターがリリースされました。
ブレンドモードを使って、積み重ねられた要素の色の混ざり方をコントロールできます。もちろん、ライブプレビューができます。今までは、ブレンド設定をコントロールするためには、カスタムCSSコードを追加する必要がありましたが、今回のリリースでその必要がなくなり、より使いやすいツールになりました。
ブレンドモードはすでに利用可能になっています。
バックドロップフィルターを使うことで、要素の背景にブラーや色シフトなどのエフェクトを与えます。アップルなどのデザインに優れているサイトでは、バックドロップフィルターはよく使われていますが、今までは追加でCSSを書かないと実装できない機能でした。今回のアップデートでは、Webflowデザイナーから簡単に設定とプレビューできるようになって、利便性が大幅に上がりました。
自分もこの機能を早速自社サイトで使いました。こちらのサイトのヘッダーは、背景にブラーをかけて、グラスのようなエフェクトを作っています。前は、カスタムCSSを書いて実装していましたが、今回のアップデートが出た直後にWebflowのデザイナーで設定しなおしました。
注意：バックドロップフィルターに対応しないブラウザもあります。現在は70％のブラウザしか対応していないため、この機能はしばらくベータ版のものとして存在します。
サイトのアクセシビリティ対応はより簡単になりました。この夏にベータ版としてオープンされたAuditパネルは、改善されると共に本リリースされました。
改善されたことで、サイトをパブリッシュする前に、アクセシビリティ的な問題点がより見つけやすく、解決しやすくなりました。
より高速でよりダイナミックなCMSデータ
データは、Webflowサイトのエンジンです。数字で言うと、CMS機能は68％のWebflowサイトで使われています。ユーザーさんは、コードの一行も書かずに、デザインコントロールを100％保有しながら、ダイナミックなデータを使ってサイト構築できます。
そうして、そのCMS機能は大幅にアップグレードされます。
改善されるのは、データのパフォーマンスです。具体的に言うと、データのロード仕方が改善され、その時に必要なデータだけが必要な形でロードされるようになりました。
CMSやEC機能を使っているWebサイトはより軽くロードしやすくなります。
改善されたCMS機能は、現在プライベートベータ版として使えます。申込はこちらです。
自分も、今回発表された新機能をとても楽しみにしていて、たくさんの利用シーンを想像しながら毎日を過ごしています。皆さんは、メンバシップやロジック機能を使って、何を構築しますか？
.webp)
