メイソンとサービスとしてのフロントエンドが製品開発のゲームチェンジャーになる理由

（これはスポンサー記事です。）定期的にやり取りするアプリやソフトウェアを見てみましょう。 それぞれに独自のデザインがありますよね？ そして、それでも、それらのそれぞれについて似たようなものがあります。 ナビゲーションバー、連絡先フォーム、機能ボックス、CTA —特定の要素はどこに行っても存在する傾向があります。

これは、これらの要素が、ユーザーが作成した製品にどのように関与するかにおいて重要な役割を果たすためです。 ユーザーの側からすると、これは良いことです。 これらの認識可能で予測可能な要素をアプリケーションのフロントエンド構造内に含めることにより、ユーザーはそれらの前のコンテンツに焦点を合わせます。 UIの謎を解こうとしているのではありません。

しかし、ソフトウェア開発者の側からすると、これは苦痛です。 製品に含める必要のあるコンポーネントの種類を知っています。 ただし、これまでは、最初から何度も何度もそれらを構築する必要がありました。 さらに悪いことに、何かを更新する必要があるときはいつでも、更新を実装してライブサイトにプッシュする必要があります。そして、それらの変更をすぐに行うための帯域幅を持っていることはめったにありません。

そのため、メイソンがサービスとしてのフロントエンド（FEaaS）で行っていることは非常に興味深いものです。 この記事では、FEaaSの目的と、それを使用して製品チームとマーケティングチームに権限を与えることが重要である理由について詳しく説明します。

FEaaSとは何ですか？

あなたはサービスとしてのソフトウェア（SaaS）が何であるかを知っています。 しかし、サービスとしてのソフトウェアコンポーネント（SCaaS）について聞いたことはありますか？

数年前、SCaaSの周りには軽い不平がありました。 基本的な考え方は、ソフトウェアの再利用可能なUIコンポーネントとウィジェットを作成して簡単に保守できるというものでした。 しかし、それが実際に普及することはありませんでした。これはおそらく、開発者が実行できることを制限しすぎたためです。

ただし、FEaaSを使用すると、はるかに価値のある強力なソリューションを利用できます。 基本的に、Masonのサービスとしてのフロントエンドソリューションを使用すると、ソフトウェアの視覚的な側面と機能を迅速かつ効果的に構築できます。

これは、複雑な機能を構築し、それらをAPIと通信させることを意味します。 データソースとしてAirtableに接続されたさまざまな設計の複雑なフォームの例はここにあります。

さらに、Masonを使用して構築する各機能は、他の製品と同じコードベースに存在します。 メイソンで作られたカスタマイズ可能なApixu搭載のチャットボットを見てみましょう。

そして、これは私がメイソンのテンプレートを使用して電子ブックのプレゼント用に作成したヒーローバナーです。

間違いありません。これはウェブサイトビルダーではありません。 メイソンは、あなたとあなたのチームが個々のコンポーネントと完全に機能する機能を構築できるようにします。 マネージドホスティングウェブサイトや製品全体ではありません。 これにより、サイトビルダーソリューションの機能に制限されることがなくなります。

選択したツールで、Webサイト、アプリ、またはその他のソフトウェア製品を構築できます。 次に、Masonから非常に複雑な機能を設計およびエクスポートして、コードベースに統合します。 あなたとあなたの顧客データを閉じ込めるプラットフォームとは異なり、メイソンは製品チームが現在の製品を増強し、すべてを所有できるようにすることを指摘することが重要です（代わりにあなたのウェブサイトとビジネス全体を所有する一部のウェブサイト購入者とは異なります）。

メイソンは誰のためですか？

Masonを使用すると、完全に開発されたソフトウェア製品、または少なくともそれを構築するためのソリューションがすでにあるはずです。 Masonは、製品の機能（およびその機能）を構築および設計するために使用するツールであり、簡単に（つまり、コーディングなしで）実行できます。

これらの機能は、自己完結型であり、問​​題がなければ製品に組み込まれます。

メイソンが建てられた実際の人々については、メイソンのCEOであるトムマクラフリンは次のように説明しています。

「今日、製品全体がコードベースに存在するため、製品を構成する機能の多くが地球上の他のすべてのコードベースにあるにもかかわらず、それはエンジニアリングチームの事実上の領域になります。それほどユニークではありません。 Masonを使用すると、製品チームはこれらの一般的な機能をより迅速に構築できますが、さらに重要なことは、技術的であろうとなかろうと、組織内の誰もが本番環境に移行した後でもそれらを管理できるようにすることです。」

ソフトウェア開発者と設計者である製品チームは、Masonを使用してソフトウェアを構築するチームです。 ただし、マーケティングチームとコンテンツチームは、新しい編集や微調整をすべて展開するためにエンジニアリングを待つ必要なしに、展開後にMasonで構築した機能を更新することができます。

これは、フロントエンド機能のメンテナンスが開発者であるあなただけに依存しなくなったことを意味します。 チームの誰もが（デザイナー、マーケター、コンテンツクリエーターなど）、MasonのFEaaSプラットフォームを使用して、ソフトウェアの機能を構築および更新できます。

そのため、製品の強力な機能をより効率的に構築できるだけでなく、チームは更新をオープンチケットリストに積み上げるのではなく、リアルタイムで展開できます。

FEaaSが重要な理由

（完全に理解できるとはいえ）ソフトウェア開発者のボトルネックが原因で、過去にソフトウェアの開発、展開、または更新のスケジュールに問題がありましたか？ もしそうなら、FEaaSはあなたにとって夢のように聞こえるはずです。

これまで、ソフトウェアエンジニアには他に選択肢はありませんでした。 Web向けの製品を作成したい場合、すべてをゼロから作成する必要があり、特に目的がより複雑な場合は、作成するのにかなりの時間がかかりました。 その間ずっと、あなたのチームの残りはあなたがあなたの役割を果たすのを翼で待っていました。

メイソンがFEaaSソリューションで主導権を握っている中で、その機能が製品開発ワークフローにどのように革命をもたらすかを見ていきたいと思います。

UIコンポーネントを視覚的に設計する

FEaaSは、エンジニアと開発者を製品のコードベースからビジュアルビルドインターフェイスに導きます。 そのため、コードを切り替えたり、デプロイした後の外観を視覚的にプレビューしたりすることなく、構築しているものを正確に確認できます。

Masonのビジュアルビルダーを使用すると、コンテナー、列、レイヤー、およびテキスト、フォームフィールド、ボタンなどの事前構成された要素のシステムを使用して、複雑でありながら重要なUIコンポーネントを設計できます。

他の最新のビルダーツールの動作と同様に、コードを1行も記述せずに、より多くのことを実行できるようにするための豊富なオプションがあります。 また、デスクトップ、モバイル、タブレットのビューを簡単に切り替えることができるため、レスポンシブデザインも問題ありません。

さらに、Masonには、最も一般的なUIコンポーネント用のさまざまなテンプレートを含むフル機能のUIキットが付属しています。 または、必要なものを手動で選択することもできます。

フィーチャーカード。 ログイン画面。 ブログコンテンツブロック。 ヒーロー画像。 CTAボタン。 訪問者に製品を利用して行動を起こさせるために必要なすべてのコアコンポーネントは、すでに構築されています。

作成するすべての製品で最初から作成することにうんざりしている場合は、これらのテンプレートが非常に役立ちます。 ご想像のとおり、この方法で製品コンポーネントを設計およびカスタマイズできることは、チームの生産性に大きな恩恵をもたらすでしょう。

コンポーネントと機能をより迅速に構築する

現在、コンポーネントを視覚的にスタイリングできることは、MasonのようなFEaaSプラットフォームを使用する利点の1つにすぎません。 ご想像のとおり、このようなツールはスピードを出すために製造されました。

Masonを実際に使用するという点では、これはめちゃくちゃ速く読み込まれるツールです。これは、ツールの起動、変更の保存、またはあるビューから別のビューへの移動を待っていた過去に時間を失った人にとって非常に価値があります。

それがワークフローにどのように影響するかという点では、そこでもスピードが上がることを期待してください。

メイソンビルダーを使用すると、次のことができます。

• 簡単なドラッグアンドドロップで、新しいコンテナ、列、行、コンテンツブロック、またはカスタムコード化された要素を追加します。

• この視覚化された要素の階層を使用して、コンポーネントのレイヤーを確認、編集、複製、移動、または削除します。

• 単純化されたのはUIデザインだけではありません。 APIを介してコンポーネントを他のソースに簡単に接続することもできます。

Masonの[構成]タブを使用すると、次のような他のアプリケーションとすばやく統合できます。

• Authy
• フェイスブック
• Hubspot
• ストライプ
• Twilio
• もっと。

それで、あなたが単にそれでリードを集めるのではなく、あなたのヒーローバナーで宣伝されたeBookを売りたいとしましょう。 最初に行うことは、Stripe統合を設定することです。

必要なのは、Stripeの開発者ダッシュボードの公開可能キーと秘密キーだけです。

次に、メイソンの対応するフィールドに各キーを入力します。

「デザイン」タブに戻り、クレジットカードフォーム要素をコンポーネントにドラッグします。

フォームをページに追加したら、この統合を設定するための最後のステップが1つあります。

[構成]タブに戻ります。 サイドバーに「フォーム」という新しいオプションが表示されます。

関連するすべての詳細がすでにここに追加されており、フォームへの接続がすでに確立されていることがわかります。

繰り返しになりますが、メイソンは、ソフトウェアエンジニアがコンポーネントをゼロから構築する場合、通常は時間がかかるような作業を簡単に行います。 代わりに、製品の新機能をすばやく設計およびプログラムするために必要なすべてのツールが用意されています。

新機能を簡単に導入

確かに、新機能を迅速に設計できることは、製品チームにとって重要です。 ただし、それでも展開の問題は修正されません。

ボトルネックは、製品開発のさまざまな時点で発生する可能性があります。 また、エンジニアだけが簡単に起動したり更新を展開したりできるほど複雑なソフトウェアを構築する場合、パイプラインでさらに遅延が発生することしか期待できません。

メイソンはこのためのソリューションを開発しました。 まず、Masonのライブラリにコンポーネントを公開するのは簡単です。 ビルダーの右上隅にある[公開]ボタンをクリックするだけで、残りはメイソンが処理します。

ただし、コンポーネントを製品またはアプリに組み込むには、開発者が関与する必要がありますが、これは1回だけであり、5分以上かかることはありません。

これを行うには、ビルダーの右上隅にある「<>デプロイ」ボタンを使用します。 次に、次のことを行うように求められます。

基本的に、あなたがしていることは、あなたが構築した機能のためにメイソンが作成した一意の識別子を取得し、それをコードベースに追加することです。 正しく設定されると、製品はMason APIを呼び出して、コンポーネントをアプリ側にレンダリングします。 そして、サイトのフロントエンドにいる人は賢明ではありません。

新しいコンポーネントとそのすべての機能をライブでプッシュするのと同じくらい簡単です。

全員が変更を加えて更新をプッシュできるようにする

FEaaSのメリットについてここで述べたすべてのポイントは、この最終的な、そして巨大なメリットを中心に踊っています。これは次のとおりです。

FEaaSを使用すると、すべての人が機能に変更を加えて、ライブアプリケーションにプッシュすることができます。

ちょっと考えてみてください。

チームは、エンジニアが必要な変更を実装するのを待つのにどのくらいの時間を費やしましたか？ そして、訪問者を引き付けて変換するアプリの能力を阻害するという点で、それは何をしましたか？ 印象的な外観のUIがなく、適切に機能する機能がなく、訪問者に行動を起こさせるために必要なすべての重要な要素がありません。

あなたは最終的にソフトウェアを人質にすることによってビジネスのお金を犠牲にしている。 これまで、それはソフトウェア製品チームが助けることができなかったものです。 それは彼らの仕事の本質でした。 しかし、メイソンによるFEaaSで、これはついに変わります。

（1）コンポーネントを公開し、（2）アプリケーションにデプロイすると、機能が製品内に表示されます。 しかし、それに変更が必要だとしましょう。 例えば：

• デザイナーは、フォームのスタイルを変更して、刷新されたランディングページのデザインを反映したいと考えています。
• マーケティングマネージャーは、ホームページのヒーロー画像を置き換える必要のある新しいブランド画像を持っています。
• あなたの編集者は、最新の潜在顧客のオファーの文言を微調整することを決定し、CTAを更新したいと考えています。

コンポーネントを変更するためにMasonBuilder内に誰がステップインするかは関係ありません。 次に、ビルダーの右上隅にある色あせた「保存済み」ボタンが緑色の「公開に移動」ボタンに変わります。

そして、何を推測しますか？ クリックするのに技術的な経験は必要ありません。

メイソンは変更の公開と展開を処理します。アプリとメイソンの間で接続がすでに確立されている限り、これらの更新は訪問者が見ることができるように即座に公開されます。

あなたとあなたの製品チームがチケットの集中砲火で行き詰まり、新しいコンポーネントを構築するか、既存のコンポーネントを微調整するように求めている場合、これは事実上それを止めます。

まとめ

Web向けの製品を構築することの素晴らしい点の1つは、誰かが常に新しい方法を開発して、私たちがより多くのことを達成し、同時により少ないことを行うのを助けることです。

ソフトウェアアプリケーションでは、一般的に、長い時間がかかりました。 ありがたいことに、FEaaSはここにあり、Masonがソフトウェア開発をスピードアップし、出力を改善し、さらに多くのチームが参加できるようにするための非常に価値のあるツールを開発したように見えます。